At this point you should have Balsamiq installed on your computer to begin wireframing the proposed site. For more information about what I’m doing I’ve written an article and posted a video that should get you up to speed. The video is only about 4 minutes so if you’re not sure what this is about, please take a moment to watch it. The link to both the article and the video is here.
In this article and video I jump into Balsamiq and start with the layout. I make some mistakes along the way and I ended up clipping off about 3 minutes of the video because I made a very big mistake. I made the error of thinking that if I added a link that saved it to a duplicate page, that the link would be transferred over to the page Balsamiq created. Oh well, did I mention I’m learning? đ
The video goes over the menu, canvas, option window and adding assets. I touch on how to crop an image and changing items on different elements on the canvas.
Alright, so I mentioned in a previous article that I decided to blog as I learned Balsamiq Wireframing. I’m not going to go into why I am just now learning wireframing, you can read the article when you get the chance.
The first step in any project is that we have a goal and a means to meet that goal. This project was given to me by a friend who wants a web site that will allow him to monitor his art project. Pretty simple, right? Well, not really. When I questioned him further it turns out that it could end up being beyond my web capabilities, but I wanted to give it a try. So here is the brief.
What I was told
The idea behind his art project is to create many (unknown the exact number, but probably about 100) small sculptures that would be cheap to make and would last a while. They would probably be made out of some tough resin so each one will last. I don’t know the exact size, my assumption is that they are about 12″ tall. Each sculpture would be placed around the US by people that he knows. An example would be that person A would place it at the corner of a street in Chicago, person B could leave it at a metro station Dallas, Texas. You get the idea, a hundred of these scattered around the US.
What he wants for his site:
He wants a site that would record what happens to each of the sculptures. A way to log the location and any other information that a person would be willing to add. Each piece would have a distinguishing mark or number to identify it and the web site url. The sculptures would not have any aids like a sensor to record where they are. The info must be added by a person.
After that there isn’t too much info about the details. He’s not sure if gps should be used or if just someone using a form to add information is enough. He did mention that there needs to be as little information about the project as possible. In other words he wants to see what happens with the pieces without interference from anyone. If the sculpture get thrown away, that’s fine.
That’s generally what I know about the project. I am leaving some info out because it’s his project and I don’t want to broadcast it without his permission.
What is needed for the site:
These are my initial thoughts and until I change them, the wireframing will be based on them. He may come back and want something different, but for now I’m going to proceed this way.
There must be a way for people to enter information about a sculpture. It must be dynamic and allowed to be modified.
A basic info page about the project, but not too much info.
Browse ability to see where individual sculptures are located and to allow someone to see where the piece has been.
Less info is better, so no explanations or hints.
Allow comments
Resources needed.:
mySQL database
Geolocation ability based on IP (can be over-ridden by person)
Map of the sculpture’s location based on the IP address.
The ability to upload images/selfies with sculpture. He didn’t request this, but I think it would be warranted.
How I’m going to proceed with Balsamiq:
I think four pages are needed, remember that less information is wanted.I think that’s it. It sounds really simple on the surface but the development of the backend may be difficult.
Home page
Browse
Add
Search
Okay now that the basics are complete I hope that you follow along as I create his site in Balsamiq. Remember, this is about learning wireframing and all the other stuff is not important. What I mean by that is that it is entirely possible that WordPress (or some other program) would be able to do what he wants with less hassle.
As a web designer and almost a frontend developer I am always interested in hearing what established web designers are doing. This year in Amsterdam, NL the world of CSS designers/developers came together to discuss what else? Cascading Style Sheets. I guess to most non-web people this may not sound like the most fun place to be, but to me I can only hope someday I’ll be able to partake in the festivities. I sometimes feel that I’m all alone when it comes to working on the web, mostly just me and my computer. The thought of mingling with like-minded people would be great fun. Officially, the conference is over, but according to the web site, https://cssday.nl/2019
“Make no mistake, this is an advanced conference. We ask our speakers to treat CSS and UI topics that they themselves, as well as the attendees, can geek out on.”
Some of the speakers that were featured were some of the designers Continue reading →
You know those banners that are on the bottom of most web sites you go to? You know, those annoying banners that block content because you refuse to accept any cookies? If you’re like me you find those things annoying and wish you didn’t have to deal with them.
So last night I decided to join the herd and install the code on two of my sites. I didn’t want to do it but due to laws in the European Union, any web site that expects to work in Europe is supposed to have them. In fact if what I’ve read is true, they will get stricter as time goes by. At the moment a site must inform the visitor that they set cookies. In the future they’ll have to state what cookies and give you the option to opt-out.
As a visitor to many sites, this sounds really good on the surface. I don’t want to be tracked or to have the site do things to my browser just because I don’t know what they are doing. More info is usually better. If you agree with me, step back a second and imagine every site you go to requires you to tick a box, or maybe tick several boxes to choose what cookies you’ll accept before you actually get Continue reading →
So youâve got a great idea for a site and youâre thinking about doing it yourself. Good choice! When I first started back in the late nineties I tried out a lot of different ways to get my site online. If youâre old enough to remember, the biggest thing going was the free hosting from many providers. You only had to have their banner stuck to your page somewhere. If I were to sum up the service back then it would be âterrible.â They rarely gave you the ability to control your site the way you wanted. You were limited by their control panels and what kind of languages you could have in your code. It was the wild west back then and I have to admit looking back it was kind of fun.
So how do you get started?
The first thing youâre going to need once you have an idea for a site, is a domain name.
A domain name is registered with an organization like ICANN though registrars like godaddy.com and namecheap.com. What you need to know when registering a domain name is that itâs really not like it used to be. Ten years ago it was important to register a top level domain(tld) otherwise your site wasnât considered real and people would be confused by something other than, .com, .org, or .net. I donât think itâs that way anymore. Over the past few years the flood of different domain extensions have increased to the point where it doesnât really matter anymore. Whatâs important is that the name is memorable. If I registered a .design domain name as kens.design, it would be easy to remember, and that is the key. If your domain name is memorable, you canât lose.
My personal choice for purchasing domain names is Namecheap.com. I donât have any affiliation with them except that they have been good to me. There are a lot of good ones, and some hosting companies will include a domain name in their hosting offer. I wouldnât do that, itâs better to keep it separate. You register the domain name, then search for a good host. When I was first starting out, I went for the deal on hosting that included a free domain name. All good, right? Well, after a few days I couldnât upload anything to the server and out of frustration I canceled the hosting. Not a big deal except they kept the domain name and I didnât blame them for it. But on my side, the name that I had chosen, the name that I spent hours researching and second guessing until I was positive it would work for my new business, was now gone. I considered it a lesson learned.
When youâre shopping for a domain name remember to ignore the first price. For example there are many domain registrars that will give you a discount for the first year or two, but then charge full price from then on. Donât be fooled, some domain extensions can be upwards of $100 per year and you may feel obligated to stay with them because you donât want to change names.
Okay, I decided for this lesson that Iâd research what the going rate for the tlds are. I went to the sites below and searched for âthisisapricecheckâ and the results are listed. I have to say that I was disgusted with networksolutions.com. They automatically added my search into the checkout, they didnât list the prices until I clicked the checkout button, and then they added services that are simply not needed. I would avoid them at all cost. Itâs a shame because there was a time that I thought that they were in the top three.
Registrar
.com
.net
.org
Godaddy.com:
$17.99
$13.99
$11.99
Namecheap.com:
$10.98
$14.98
$14.98
networksolutions.com:
$32.99
$34.99
$34.99
domain.com
$9.99
$12.99
$14.99
Having researched the prices, I was reminded that you donât need anything but a domain name. Donât be fooled by the sales gimmick of adding more and more onto your purchase. Yes, the privacy feature is nice, but itâs not needed. Iâve had my sites public for twenty-years and have yet to see any spam or any problems at all.
Do:
Look for a domain registrar that isnât âsellingâ to you. Iâm not sure if that make sense, but think about it as buying a car from a car dealer. The best places give you what you want and donât try to upsell you.
Shop for price. If youâre starting a business thereâs a good chance that youâll have the domain name for many years. Donât be misled by discounts for the first year or two. The actual price is whatâs important.
Spend time researching. There are hundreds of sites that want your money, but only a few deserve it.
If youâre sure of your new venture, then register for multiple years. Itâs kind of like locking in your price. For my personal site I registered for ten years. It will save you money in the long run.
Donât be afraid to transfer your domain to a different registrar if youâre feeling abused by your current one.
Donât:
Donât add extra items to your purchase. Anything important like ssl can be added later. If itâs not important ignore it. I tell my students, âJust the domain, nothing else.â
Donât buy hosting from the domain registrar. They may be a good host, but you can never tell. GoDaddy.com had a reputation for years as being a great registrar but an awful host. People would buy hosting and be limited on what they could do with their site.
Donât buy a domain from a site that you arenât comfortable with. I think you should trust your gut reaction to a domain name purchase. The domain name could be with you for who knowâs how long, twenty or thirty years. Thatâs too long to be with a site that you donât trust. Remember you can always transfer to a different registrar.
Okay, as I conclude this lesson, I just want to remind you that you should trust your own decisions. Iâve seen people who have registered strange names and have succeeded with them, and the opposite is true. There are good domains names that donât get traction. In the end itâs your concept and execution that will ensure that you are successful on line.