Sunday, April 15, 2012

Assignment: Taking Apart Facebook

In our last class, I told you that I'd ask you to create some high-fidelity wireframes using an artist's website. Instead, I want you to document the Facebook Timeline interface.

For Wednesday you should create at least one wireframe using a computer application of your choice (i.e., not drawn by hand). If you use a tool like Illustrator be sure to find a set of standardized symbols to represent things like images and buttons. I've posted some links to other tools here on our class blog.

The purpose of this exercise is to break down the components of a Facebook profile page. Label each component of the page and explain how it works or what its function is on the page. Use a friend's profile as your model, so you don't focus on editing tools.

Bring both soft copy (editable digital file) and hard copy (a printed page) to class. Consider your printing options when sizing your digital document.

Also, remember to include all the required elements of a wireframe on your document. As we discussed in our last class, important elements include:

  • Project Name
  • Page/Element Name (if applicable)
  • Version Number
  • Date Created
  • Created By
  • Date Last Revised
  • Revised By

Here are some examples of hand-sketched and computer-generated wireframes to inspire you:

Wednesday, April 4, 2012

Wednesday, March 28, 2012

Submit Post for March 28 (Article Comparison #3)

Please add a comment to this post with a direct link to your third Article Comparison. Use the standard format.

Wednesday, March 14, 2012

Wednesday, March 7, 2012

A Sample List of Data Elements

Below you'll find the sample list of data elements that I projected on the screen during our in-class exercise working on the jameskunen.com website. Again, this isn't an exhaustive list for the home page, or necessarily an ideal way to label the pieces, but it gives you some idea of the number of components found on an apparently simple page.



- page title (book title)
- page subtitle (author name)
- book description short
- book description long
- author image small
- author image copyright (caption)
- book excerpts
- book praise long
- book cover image large
- book cover image small
- book cover image medium
- video clip image
- video clip description
- video clip link
- Facebook image
- Facebook link description
- Facebook link
- audio clip description
- audio clip link
- Amazon book image
- Amazon book link
- copyright information
- website credit

Other pages



Possible page type distinctions

Page Type 1: Home
Page Type 2: Bio
Page Type 3: Strawberry, Reckless, How Can You
Page Type 4: StandardOp

Submit Post for March 7 (Article Comparison #2)

Please add a comment to this post with a direct link to your second Article Comparison. Use the same format as the first Article Comparison.