Weird mutant fish people, zombies, unicorns, and zoro. Just a normal day in #cgt256—
Nick Coma (@gfxcoman) February 22, 2012

While the above tweet provides an informative summary of class :), maybe it would be useful to supplement it with the slides I showed – good and bad examples of indicating clickability and visual hierarchy.

This blog post has additional examples that illustrate how you can use size, contrast, color, pattern, etc. to create visual hierarchies. Please read.

For your own Show & Tell exercises, consider showing effective examples of visual hierarchies and explain how they are achieved through visual design.

The main goals for you are to understand:

1. the difference between wireframes, mockups, and prototypes
2. what each one is used for
3. how you can conduct early usability testing with prototypes.

First, review these examples of mockups and prototypes, so you can see exactly what we are talking about.

Then, make sure to read chapter 7 from your BGW textbook.

The resources below will help clarify the reading:

1. Read about the importance of wireframing - what wireframing is and what it is used for; as well as tools for creating wireframes.

2. Go through this presentation that explains the differences between wireframes and mockups:

3. Go through this presentation that teaches you how to wireframe

4. Go through this presentation that shows you how to create prototypes

5. Finally, watch this short video so you can see how usability testing can be done with paper prototypes:

Below are the slides that draw your attention to the key points from your reading. Make sure to understand them!

Remember, we do not meet in class on Monday. Keep your eyes on this blog for resources related to wireframes, mockups, and prototypes. I completely expect blog comments and tweets related to this topic.

1. Don’t be an egg head

Customize your account with a photo, bio, and maybe even background. If you’re not comfortable showing your real name or face, that’s fine. Just use an image that’s appropriate in an informal professional setting and communicates something about who you are. Be careful about broadcasting your location. This may be unsafe, so you may want to turn that option off.

2. Let me know you’re there

Please follow @mihaela_v and @geovon_b. Send me a tweet (include my user name, @mihaela_v, somewhere in the tweet) and say hi. This will make it easy for me to follow you back, and add you to the student list.

3. Follow your classmates

This is easy. You don’t have to identify and follow them one by one. Just follow this list, and you’ll automatically follow all the people in it. I also have a list of people on Twitter who have been my students at some point in time. You may know some on that list.

4. Figure it out

Send some tweets. Figure out how Twitter works. Figure out if you want to use an app (like Tweetdeck, or Hootsuite) or you’re content with the web version of Twitter. Figure out how to @ someone, what retweets (RT) and hashtags (#) are. Ask questions about Twitter on Twitter. Someone from class will be able to answer.

5. Tweet

Before you start following professionals, build up your Twitter account with some interesting tweets. Tweet about what has your attention. What is it that you’re focusing on right now? Tweet interesting links to news, blog posts, sites you use as part of your work. Things you think other classmates may be interested in, professionally.

6. Create a PLN

One of the main reason people use Twitter is to create their own Professional Learning Network (PLN) – that is, to follow people they can learn from. So, find people you can learn from and follow them. These are people who work in the areas you are interested in, people who post interesting links, people who may connect you to a job or internship. You can start with this list of UX professionals I have created. You can branch out from there. See what lists some of the people you follow have created. See what lists they’re on. This is an easy way to find interesting people to follow. Take it slowly, though. Give people time to follow you back. If you follow very many people (say, 300) but only 3 people follow you back, your account looks like  spam and may be closed down.

7. Ask & answer

Use the comments below to share your Twitter tips. Have you been using Twitter? Do you have a PLN already? Tell us how and why you’ve been using Twitter. Use the comments below to ask questions – anything about Twitter is fair game. And, if you see a question you can answer, please go ahead and do so. If you subscribe to the comments for this post you will be able to follow this conversation.

8. Where is this all going?

Geovon and I will help you learn how to use social media to promote yourself professionally and to connect with other professionals online. Here’s why:

You will work on it in lab on February 14. If you have additional questions that were not answered in lab, please ask them in the comments below (or by email).

Known as the pioneer of the user-friendly programming language, Visual Basic, Cooper is also recognized as the purveyor of user-centered design due to his landmark book, About Face 3: The Essentials of Interaction Design. If you haven’t read this book, you should. It’s a one-stop shop for exploring the fundamentals of user-centered design — fundamentals that will not only help you develop intuitive, user-friendly products, but to also speak intelligently with other designers (or your future managers ;) within industry.

Speaking of industry, if you’re looking for an awesome internship this summer, Cooper’s design firm is looking for a few good interns:

Our internship program is a 10-week paid position in San Francisco for current undergrad, graduate, or recently graduated students. We’re looking for both interaction and visual designers who have a mix of self-motivation, design skills, open-mindedness, curiosity, empathy, and thirst for knowledge.

This is an fantastic opportunity and, based on what I’ve seen in class and in our labs, I know you’d make excellent intern candidates. So, what are you waiting for? APPLY!

He talked about the design process they use in his group (and yes, all the steps were there: user research, personas, user stories, wireframes, prototypes, user testing) and answered some of your questions about online portfolios. As we complete the topic of user research, we, too will learn about the concepts he mentioned – so stay tuned!

Here is the blog post he mentioned – full of useful tips about how to get your career started and find a job in the usability/design space. Thank you so much, Patrick for taking the time to talk to us!!!

Before Patrick joined us, I tried to get you thinking about how to choose your research tool: When would you want to do surveys rather than interviews? When and why do focus groups? I also gave you some tips about these research methods that add to today’s reading. The slides I used are embedded below.

Did you enjoy having a virtual guest? What did you take away from the exchange? Please let me know in the comments!

Here is a post from UX Booth that gives practical advice about how to apply what we know about human memory to interface design.

What is your favorite tip? What other tips can you come up with? Do you have examples of interfaces that tax your memory (or do a good job not taxing it?) – save them for a Show & Tell!

P.S.

Have you taken Alex’s survey? Please remember to check your email for more info if you would like to help.

Dr. V

You will have a chance to apply these concepts in lab & assignments, as usual. The 2 assignments mentioned in the post are on Blackboard.

Questions about any of this? Please let me know in the comments below.

Dr. V