Mobile First

So the primary focus of the video is as the title suggests…mobile first.  It does appear that the predictions and statistics he presented appear to have come true. Mobile devices (especially for web usage), have taken over PCs in terms of usage and sales. So many people are using their mobile devices for using the internet today. I still feel there is a place for PCs when it comes to web design, but I can definitely see where he is coming from. I do wish the video was in a higher resolution so I could see the statistics that he kept bringing up. Very disappointing since it was recorded back in 2010.

I think it might be difficult to design for a phone first, and then move on to a bigger screen from there does seem to be a difficult task. I personally feel it's easier to start large (like a PC screen) and then reduce and consolidate down, rather than try to go from small to large (like a photograph that's been scanned). I do appreciate that he goes into using the touch interface and the accuracy (or inaccuracy) of the human finger. While working on the wireframe for our current assignment, I wanted to make sure that I can use it with my own fingers (large enough icons, but not cluttered) because I have large hands. I figure if I can use it comfortably, most other users should be able to as well.

I remember using (or more specifically trying to use) my Motorola Razor for using the web. It was pretty similar to the example he showed. The triple tap just to get to letters was ridiculous when I think back upon it. I think I used it to get some news, sports scores, and weather info and that was it. It was, well, pathetic I think. It reminds me of when websites were just text back in the early days of the web ('95-'97).

One type of interface that is mentioned that I don't think should be a part of mobile use is the double-tap. Using a touch interface can be awkward when you're trying to tap in the same location twice in a row. Of course, that may just be my own opinion, but I don't think I would design a site or interface that used a double-tap for its touch interface.

Speed is important!  I don’t feel he emphasized this enough. Even with 4G, you want a mobile site to load quickly and be simple enough that it doesn't take long regardless of connection. In fact, I think it’s more important in case you’re in an area with the faster speeds are yet available (something that is still true).  I know if I try to visit a site that takes forever to load; I will likely leave that site and look for another that serves the same or a similar purpose. Don't make me wait, I'm not that patient.

I've never seen a site or app use the "insta-scrolling" that is shown off. Personally, I don't think it would be particularly useful. In fact, I could find it annoying if it was turned on and I tilted my phone and the text started scrolling without my knowledge.

The last function he talked about was the use of the camera on the device for recognition. I happen to the use the camera quite a bit when I'm out shopping to comparison a product with the price on Amazon. Recently Amazon has introduced the ability to take a photo of the actual product or item that you're looking at without even having to deal with either a barcode or RFID. I absolutely think this is a very important function for certain websites. I would love the idea of being able to take a picture of a movie and get reviews or IMDB information while I'm out shopping.

Despite what I said earlier about it being easier to design an interface with a larger display in mind and then condensing it to a phone or tablet display, I do feel the idea of taking mobile into consideration first is a strong direction to go in, and definitely something I will keep in mind.

Biggest Mistakes In Web Design

Reading the Biggest Mistakes In Web Design was interesting to me because I had previously attended and graduated from MATC’s Commercial Art program, so I have a bit of history in regards to design and have seen how websites have evolved in years. One of the mistakes mentioned was the use of Flash. When I took my web design class back in either 1997 or 1998, Flash was all the rage in web design. Unfortunately, in a time where people were still slowly starting to get high speed internet access, Flash was a bane. In this era of HTML 5, I feel Flash is a dinosaur in web design (though it can still have a place in animation and game design).

As a former design student, I can understand how someone wants to make their site pretty and seem important to the visitors. This can be done if you serve the purpose that the user is looking for. The example was in Nobody Cares About You or Your Website. The user doesn't care that the person who designed the site graduated from college with straight A’s and now works for the swankiest design firm in the city. They don’t care if you used your design skills to make the site look artistic. What the user cares the most about is if your website has what they are looking for. If you do, then they may start to appreciate the work you put into the site.

This doesn't mean good design shouldn't be used. Obviously, you want to make sure the user can actually read the site. Using good contrast can go a long ways towards that. It doesn't help your case if you have a black website with dark purple text, or a white website with yellow text. At the same time, look at other sites out there that may be similar to what you’re doing. See how they have it laid out. What works and what doesn't work? The Accept Jesus website looks was designed by someone on a bad acid trip while listening to too much Grateful Dead and was tasting colors and hearing smells when they designed it (if you haven’t looked at it personally, please do. http://www.dokimos.org/ajff/).

Of course another aspect of good design is making sure the user knows where they are and how to get where they want to be. Making the site easy to navigate is important. If the user can’t find what they want, they will eventually just leave and go elsewhere. This means making it clear to the user where things are, helping them find what they need and not getting in their way with either a confusing navigation system or annoying pop-ups. This also includes using text for text, and not pictures for text (as the article said, a search engine will not be able to read a picture).

Finally, it’s important to make sure you give the user a reason to return to your site in the future. The article referred to this as heroin. While the comparison may be a bit crude, it is accurate. The sites I visit the most are the ones that update their information pretty regularly. This can be a news site that keeps it’s stories fresh, a store that updates its homepage with new items or deals/specials, or an art site that keeps the art that it features new and different (especially if I want to discover something new). Give the user a good taste of what you offer and make sure you keep them coming back for more.

Don't Make Me Think: Chapters 4-7

So the fourth Chapter of our text is “Animal, Vegetable, or Mineral," which essentially talks about trying to keep your categories relatively basic and easy to understand. The best example he used I thought was when he was searching for something for his home office and had the categories available of either Home or Office. I've run into this issue before because depending on what you’re looking for, it can be quite confusing. It can also make a difference of what the user is looking for specifically. For example, if the user is looking for paper clips and staplers, Office would seem like the most logical selection. Where I feel it can be tricky is if the user is looking for something like a desk or a lamp. Both are items that are used in an office, but can easily be items someone would have in the home without having an office. It just makes sense that the designer should maybe keep thoughts like that in mind when making decisions about what goes where.

Chapter five discusses reducing unnecessary words from your site. The examples he used included “Happy Talk” and instructions. I can understand why a lot of sites use happy talk on their homepage. The site wants you to know how great they are, and hope that the enthusiasm projected will pass on to the user as they are using the site. Often a site might say something like:

Welcome to Brand-X. We’re glad you've taken the time to visit our site. Our company has been around for 75-years and our company goal has always been to provide the best product that we can. We hope your experience is great and we thank you for your patronage.

The other item mentioned in the chapter are involving instructions. Like the example he used for the survey (which I found amusing was Verizon, since I had recently had a horrible experience with their website). It was ridiculous how many instructions there were for that survey. As a user, I would think that something that has that many instructions, it must be really complicated and I’m going to take a little time to decide if I want to take the survey or not. The more simplified instructions that the author offered up would definitely increase my chances of wanting to take the survey (or whatever task I might be looking at).

The next chapter covers what I think is one of the most important aspects of using the web (or applications in general), navigation. The author was correct that this is a pretty lengthy chapter, but there really was a lot of important information to look at. I thought the Sears analogy at the beginning was a great way to compare a physical store to a website. As a user of both, if I know what I’m shopping for, I rarely want to waste a lot of time browsing. There are a few aspects that I like from this. First is searching for something specific. The example he uses is a chainsaw. If you decide to use the search bar on the website and ask an employee for help at the store, both methods need to be knowledgeable enough to help you find what you’re looking for. If I go up to an employee at Sears and ask for the chainsaws and they lead me to the hacksaws, that’s the same as typing in chainsaws to a search engine and the first result being hacksaws.

The same goes for if I’m looking on my own. Your store had better be laid out well enough that I can find what I’m looking for easily enough before I throw my hands up and leave (and probably just go to Amazon and order one).

The importance of hierarchy was also discussed. Making sure the user always knows where they are at all times (especially when dropped in the middle of a site), and making visual cues obvious (such as using highlights, color, etc). Without that you risk losing the user to a better designed site that offers similar services. The navigation must be clear and consistent. This doesn't mean you can’t be a designer, but you better make sure your design is understandable.

It’s unfortunate that the book is as old as it is because he does reference Amazon a lot. Their current design no longer uses tabs, though it is still a very well designed site.

Finally, chapter seven focused on the importance of the homepage. The best explanation given in the chapter was comparing it to that of a newspaper page one. You have your site name/head and tagline placed in a prominent spot at the top and probably to the left (based on how most people read) so it can be seen right away. You have your brief explanation of the site’s content (news, shopping, information, etc) and maybe why your site is the best (though that can be considered “happy talk” that was mentioned earlier). It then features your headline, which can be a featured product or lead story/article. All of this information is presented right away on the site, before you even look at a menu, search bar, or have to scroll down at all (the above the fold part that was discussed).

The homepage can also vary somewhat from the rest of the navigation because you need to make sure you’re conveying the needed information to the user, but that doesn't mean that navigation takes a backseat. Things still need to be laid out logically and easy to use, or again a user will leave if it’s too complex and move on to a similar website that may have a better layout.