Avery Mulberg Final Design
Ta da!! Here is the final design presentation for Megasuits.com done by myself and Angela Mulberg. It's pretty awesome.
Thursday, May 26, 2011
Thursday, May 19, 2011
Monday, May 16, 2011
Week 7 Reading
Wahoo! The last chapter.
Chapter 12 is about making good decisions. They talk a lot about guidelines for asking for information on a website. The author gives three guidelines: only make the user provide what you need to complete the transaction, don't ask for a lot of optional information and who the user the value they'll receive in exhange for the information. The author also discussed "sizzle" and basically said to keep it to a minimum because it is counterproductive. Most people on the web don't want to be engaged, they're just there to get something done and sizzle just gets in their way.
Even with all this advice, you should never say never. Certainly any good design can work in some circumstance, but don't use them unless a) you know what you're doing, b) you have a good reason and c) you'll test it to make sure you did it right.
OMG, the same thing by the same guy:
http://roachpost.com/2010/03/06/steve-krug-adding-sizzle-to-your-web-site/
Beacon Tech wants you to add sizzle:
http://blog.beacontechnologies.com/top-10-ways-beacon-can-add-sizzle-to-your-website/
How to design the perfect form:
http://webdesigntuts.com/web-design/how-to-design-the-perfect-form/
Chapter 12 is about making good decisions. They talk a lot about guidelines for asking for information on a website. The author gives three guidelines: only make the user provide what you need to complete the transaction, don't ask for a lot of optional information and who the user the value they'll receive in exhange for the information. The author also discussed "sizzle" and basically said to keep it to a minimum because it is counterproductive. Most people on the web don't want to be engaged, they're just there to get something done and sizzle just gets in their way.
Even with all this advice, you should never say never. Certainly any good design can work in some circumstance, but don't use them unless a) you know what you're doing, b) you have a good reason and c) you'll test it to make sure you did it right.
OMG, the same thing by the same guy:
http://roachpost.com/2010/03/06/steve-krug-adding-sizzle-to-your-web-site/
Beacon Tech wants you to add sizzle:
http://blog.beacontechnologies.com/top-10-ways-beacon-can-add-sizzle-to-your-website/
How to design the perfect form:
http://webdesigntuts.com/web-design/how-to-design-the-perfect-form/
Megasuits Redesign Progress
Megasuit Redesign Presentation
Here is our progress for the Megasuits website redesign. Angela took care of the concept statement and the site lo-fis, I took care of the mood board/logo and the checkout lo-fis.
Here is our progress for the Megasuits website redesign. Angela took care of the concept statement and the site lo-fis, I took care of the mood board/logo and the checkout lo-fis.
Week 6 Reading
Chapter 10 talks about the common courtesy of usability. The author refers to the reservoir of good will. If users are treated badly at a website, they'll probably leave and not only not want to use your site in the future, but they'll probably think less of your organization. The reservoir is idiosyncratic, meaning some people are patient, some aren't, some are trusting, some aren't. You can't always count on a large reserve. It is also situational depending on a users time frame. You can refill the reservoir by doing things that improve usability, but sometimes one single mistake can empty it and you're done for.
Things that diminish goodwill include: hiding information that we want, asking us for information they don't need, lying, taking too much time away from us, or if your site looks ameteur. Things that increase goodwill include: making things you know we want to see obvious, telling us what we want to know, know what questions we are likely to have and answer them, be comforting, make it easy to recover from errors, and be apologetic.
Chapter eleven talks about accessibility. Designers and developers are responsible for doing something about this since they are the ones who build the sites. Designers and developers fear more work and a compromised design. Accessibility can seem like one more thing to fit in and it will force them to design sites that are less appealing. If something is confusing on your site, it's probably going to confuse those who have accessibility issues. The way to fix this is to test often and continually smooth out parts that confuse everyone. The way to learn how to make anything is to watch people use it. It's also a good idea to add appropriate text to every image, make forms work with screen readers, create a "skip to main content" link at the beginning of each page, and make all content accesible by keyboard.
Intro to usability:
http://www.useit.com/alertbox/20030825.html
Intro to web accessibility:
http://www.w3.org/WAI/intro/accessibility.php
Usability is good management:
http://www.gerrymcgovern.com/nt/2003/nt_2003_04_07_usability.htm
Things that diminish goodwill include: hiding information that we want, asking us for information they don't need, lying, taking too much time away from us, or if your site looks ameteur. Things that increase goodwill include: making things you know we want to see obvious, telling us what we want to know, know what questions we are likely to have and answer them, be comforting, make it easy to recover from errors, and be apologetic.
Chapter eleven talks about accessibility. Designers and developers are responsible for doing something about this since they are the ones who build the sites. Designers and developers fear more work and a compromised design. Accessibility can seem like one more thing to fit in and it will force them to design sites that are less appealing. If something is confusing on your site, it's probably going to confuse those who have accessibility issues. The way to fix this is to test often and continually smooth out parts that confuse everyone. The way to learn how to make anything is to watch people use it. It's also a good idea to add appropriate text to every image, make forms work with screen readers, create a "skip to main content" link at the beginning of each page, and make all content accesible by keyboard.
Intro to usability:
http://www.useit.com/alertbox/20030825.html
Intro to web accessibility:
http://www.w3.org/WAI/intro/accessibility.php
Usability is good management:
http://www.gerrymcgovern.com/nt/2003/nt_2003_04_07_usability.htm
Week 5 Reading
In chapter eight, we learn that most arguments are a waste of time. Duh. But also it lets us know how to avoid them. Most web design teams spend a lot of time rehashing the same issues over and over. This is because what we like as web users always differs from other users. If we believe everyone is like us, it will create a gridlock in any web design meeting. Instead of trying to find something that everyone likes, the group usually will try to determine what most users like to figure out the persona of the average web user. The problem is, there is not average user. Instead of asking questions like "do most people like pulldown menus?" you should ask "does this pulldown menu with these items, etc. work for people who are most likely going to use this site?" You have to think creatively as a group in order to answer these questions and come up with a solution that fits.
Chapter nine discusses usability testing (I just wrote tasting, that sounds more fun). The important thing to remember is that focus groups is not usability testing. In a focus group, people sit around a table and react to ideas. Usability testing is on user at a time being shown something and asked to figure it out or do a typical task. Testing one user is 100% better than testing none. The point of testing is to inform your judgement. You're trying to make improvements to your site, not to prove that it works somehow. Testing provides invaluable input which will make it easier to choose with greater confidence. It's not something you do once. You must test, fix and test again.
An ideal number of testers is three to four people per round. The first three are likely to encounter nearly all the problems and using three users helps ensure you will definitely do another round. A lower number of users allows you time to test and debrief on the same day in order to fix the problems quicker.
It's important to review the results right away do decide what to do next. First you must review the problems and decide which ones should be fixed, then problem solve and figure out how to fix them. When fixing the problems, try to solve anything new and remove any surprises. It's important to give your group plenty of time to test and fix so at least a month ahead of the release date is good to start testing.
This is the perfect web design team:
http://www.myintervals.com/blog/2008/03/10/how-to-assemble-a-web-design-team-based-on-the-a-team/
A simple problem solving article:
http://webdesign.about.com/od/webdesignbasics/a/aa062007.htm
Twelve tips for team building:
http://humanresources.about.com/od/involvementteams/a/twelve_tip_team.htm
Chapter nine discusses usability testing (I just wrote tasting, that sounds more fun). The important thing to remember is that focus groups is not usability testing. In a focus group, people sit around a table and react to ideas. Usability testing is on user at a time being shown something and asked to figure it out or do a typical task. Testing one user is 100% better than testing none. The point of testing is to inform your judgement. You're trying to make improvements to your site, not to prove that it works somehow. Testing provides invaluable input which will make it easier to choose with greater confidence. It's not something you do once. You must test, fix and test again.
An ideal number of testers is three to four people per round. The first three are likely to encounter nearly all the problems and using three users helps ensure you will definitely do another round. A lower number of users allows you time to test and debrief on the same day in order to fix the problems quicker.
It's important to review the results right away do decide what to do next. First you must review the problems and decide which ones should be fixed, then problem solve and figure out how to fix them. When fixing the problems, try to solve anything new and remove any surprises. It's important to give your group plenty of time to test and fix so at least a month ahead of the release date is good to start testing.
This is the perfect web design team:
http://www.myintervals.com/blog/2008/03/10/how-to-assemble-a-web-design-team-based-on-the-a-team/
A simple problem solving article:
http://webdesign.about.com/od/webdesignbasics/a/aa062007.htm
Twelve tips for team building:
http://humanresources.about.com/od/involvementteams/a/twelve_tip_team.htm
Week 4 Reading
Chapter seven talks about the difficulties of designing a homepage. As quickly and clearly as possible, the homepage needs to answer four questions: what is this?, what can I do here?, what do they have here?, and why should I be here and not somewhere else? These questions must be answered with very little effort.
Some guidelines to designing a homepage include: use as much space as necessary but don't use any more space than necessary, don't use a mission statement as a welcome blurb, and test and test again. Taglines can always be an efficient way to get a message across without a lenghthy explanation. Good taglines should be clear and informative and convey differentiation and a clear benefit. Bad taglines sound generic.
Lots of designers are now using pulldown menus to save space, however they cause a number of other problems. For examples, you have to seek them out and they're hard to scan which doesn't make certain things obvious to the user right away.
Ten most violated homepage design guidelines:
http://www.useit.com/alertbox/20031110.html
Homepage Design:
http://www.uxmatters.com/mt/archives/2007/08/home-page-design.php
How to design an effective homepage:
http://www.vanseodesign.com/web-design/home-page-design/
Some guidelines to designing a homepage include: use as much space as necessary but don't use any more space than necessary, don't use a mission statement as a welcome blurb, and test and test again. Taglines can always be an efficient way to get a message across without a lenghthy explanation. Good taglines should be clear and informative and convey differentiation and a clear benefit. Bad taglines sound generic.
Lots of designers are now using pulldown menus to save space, however they cause a number of other problems. For examples, you have to seek them out and they're hard to scan which doesn't make certain things obvious to the user right away.
Ten most violated homepage design guidelines:
http://www.useit.com/alertbox/20031110.html
Homepage Design:
http://www.uxmatters.com/mt/archives/2007/08/home-page-design.php
How to design an effective homepage:
http://www.vanseodesign.com/web-design/home-page-design/
Week 3 Reading
Chapter six is all about designing navigation. They state a basic fact: people wont use your website if they can't find their way around it. In most cases, a decision needs to be made whether to ask first or browse first. A website doesn't have a live person who can tell you where things are, which is why it's good to include a search box that gives appropriate answers.
If you choose to browse, typically you'd look at the homepage and click on the section that seems right, then click on a subsection and hopefully find what you want. However, if after a few clicks the user can't find what they want, they'll leave and look somewhere else.
There are three main purposes for navigation: to help us find what we're looking for, to tell us where we are and because it gives us something to hold on to. Navigation can put ground under our feet. There are also some other equally important functions that are often overlooked: it tells us what's here, it tells us how to use the site and it gives us confidence in the people who built it.
Seven steps to easy web nav:
http://www.smartisans.com/articles/web_navigation.aspx
Effective web nav:
http://webdesign.about.com/cs/webnavigation/a/aaeffectivenav.htm
Four bad web designs:
http://www.useit.com/alertbox/bad-design.html
If you choose to browse, typically you'd look at the homepage and click on the section that seems right, then click on a subsection and hopefully find what you want. However, if after a few clicks the user can't find what they want, they'll leave and look somewhere else.
There are three main purposes for navigation: to help us find what we're looking for, to tell us where we are and because it gives us something to hold on to. Navigation can put ground under our feet. There are also some other equally important functions that are often overlooked: it tells us what's here, it tells us how to use the site and it gives us confidence in the people who built it.
Seven steps to easy web nav:
http://www.smartisans.com/articles/web_navigation.aspx
Effective web nav:
http://webdesign.about.com/cs/webnavigation/a/aaeffectivenav.htm
Four bad web designs:
http://www.useit.com/alertbox/bad-design.html
Week 2 Reading
In chapter three, we learn about designing for billboards and that most audiences are more likely to scan rather than read. It's important to create a clear visual hierarcy and break up the pages so if the audience is going to scan, they'll at least absorb the most important information. It is also important to know your conventions so when you're creating a design, your audience can find what they're looking for faster and wont lose interest. Especially in web design, it's important for users to be able to navigate a web page even if they don't totally understand everything. Web conventions are there for a reason, so if you're not going to use them, you better make sure to replace it with something equally clear or that it adds something of value. Other important factors of web page design include making clickable things very obvious and cutting down on the noise. Even something as easy as lightening line weight can help with a design.
In chapter four, we learn about how users like mindless activity and when they're searching for something on a web page, they usually don't want to think about it. There are two ways to play it; you can either use the rule that it shouldn't take more than three clicks to get somewhere or, if it takes more, it should be very simple. Think of it like playing Twenty Question, it's a mindless choice. When creating links, make it as clear as possible. For example, if someone wants to buy something for their home office, make it clear where they can find something if you have a link for home and for office.
Chapter five teaches us to omit words. Writing should be concise and should not containt unnecessary words. On most web pages, a lot of the words are just taking up space. One thing to eliminate from web pages is instructions. No one is going to read them because they want to be able to navigate the page without them. Don't use a lot of words when few will get your point across.
Here is a very similar article that reinforces these topics:
http://www.joelonsoftware.com/uibook/chapters/fog0000000062.html
Here is an article about someone "writing without words":
http://designmind.frogdesign.com/articles/numbers/writing-without-words.html#/images/dm/numbers/writingwithoutwords_01.gif
Here is a website with various webpage designs without words:
http://webwithoutwords.com/
In chapter four, we learn about how users like mindless activity and when they're searching for something on a web page, they usually don't want to think about it. There are two ways to play it; you can either use the rule that it shouldn't take more than three clicks to get somewhere or, if it takes more, it should be very simple. Think of it like playing Twenty Question, it's a mindless choice. When creating links, make it as clear as possible. For example, if someone wants to buy something for their home office, make it clear where they can find something if you have a link for home and for office.
Chapter five teaches us to omit words. Writing should be concise and should not containt unnecessary words. On most web pages, a lot of the words are just taking up space. One thing to eliminate from web pages is instructions. No one is going to read them because they want to be able to navigate the page without them. Don't use a lot of words when few will get your point across.
Here is a very similar article that reinforces these topics:
http://www.joelonsoftware.com/uibook/chapters/fog0000000062.html
Here is an article about someone "writing without words":
http://designmind.frogdesign.com/articles/numbers/writing-without-words.html#/images/dm/numbers/writingwithoutwords_01.gif
Here is a website with various webpage designs without words:
http://webwithoutwords.com/
Thursday, May 5, 2011
Megasuits Concept Statement
The main users that would visit Megasuits.com would be men with middle income that need suits, but can’t go to the higher end department stores to purchase them at full price. Right now, the website design speaks to a very cheap audience and doesn’t put forth the feeling of classy as a suit website should. I feel the website should be designed as though you’re buying a high end department store suit at a lower price rather than buying a cheap, knock off suit that won’t last long and won’t look as good.
Initial thoughts are the website is too busy. There should not be so many photos of suits, it is way too overwhelming. There are two navigation bars that seem to be the same, only one has sub-navigation. There is also a flash banner ad at the top of the page that distracts from everything else and the logo is not even big enough to over shadow it. At first glance, it looks like there are two search bars at the top of the page, but in fact one of them is a search bar and one of them is to sign up for a membership. These need to be more distinct so users know which one they want to use. There is nothing classy about the color choices either.
Basic improvements can be made such as creating one simple navigation bar with the ability to roll over and see the sub-navigation. This will clean up a lot of the business. Also, instead of having a homepage with multiple photos of suits, the site will include a slideshow that will be the main focus to highlight new suits, sales, etc. The flash banner has to go and everything they’re trying to highlight there will instead be in the slideshow. The search bar will be made more obvious and the membership bar will be placed in a different spot, possibly next to the sign in link, so it’s clearer to the user which function is which. Finally, as you get to the secondary pages, it’s important to know what pages you’re on, so making sure there is some kind of highlight to know where you are and a clear path back to the homepage is very important and will be included.
Initial thoughts are the website is too busy. There should not be so many photos of suits, it is way too overwhelming. There are two navigation bars that seem to be the same, only one has sub-navigation. There is also a flash banner ad at the top of the page that distracts from everything else and the logo is not even big enough to over shadow it. At first glance, it looks like there are two search bars at the top of the page, but in fact one of them is a search bar and one of them is to sign up for a membership. These need to be more distinct so users know which one they want to use. There is nothing classy about the color choices either.
Basic improvements can be made such as creating one simple navigation bar with the ability to roll over and see the sub-navigation. This will clean up a lot of the business. Also, instead of having a homepage with multiple photos of suits, the site will include a slideshow that will be the main focus to highlight new suits, sales, etc. The flash banner has to go and everything they’re trying to highlight there will instead be in the slideshow. The search bar will be made more obvious and the membership bar will be placed in a different spot, possibly next to the sign in link, so it’s clearer to the user which function is which. Finally, as you get to the secondary pages, it’s important to know what pages you’re on, so making sure there is some kind of highlight to know where you are and a clear path back to the homepage is very important and will be included.
Subscribe to:
Posts (Atom)