Today in class we will continue to jam on either Anthropologie art direction for web, iPhone & iPad and/or take a stab at tomorrow’s apple.com homepage, result of tomorrow’s Apple Keynote, which is supposed to bring on the iPad 3.
Option 1:
Continue to jam on art direction for Antrhopologie and take your campaign to either the iPhone, or iPad through iOS.
Think about your campaign message and translating it to mobile.
Option 2:
Design a new index page for apple.com, guessing what it will look like tomorrow with the hopeful drop of the iPad 3 and other fun products.
After presenting our Anthropologie emails, I offered up one of two options to continue build.
1. Pivot - You have been hired away from Anthropologie by a competitor and will be designing/writing the same type of creative for them.
2. Campaign Page - Use your existing Anthropologie email to design a campaign/landing/information capture page. This would be a page that the email would take you to on-click.
Think… where am I going, what is the page supposed to do, what information needs to be collected? This can also be a contest style site where users are asked to upload photos to a feed, or post on social networks.
In class we discussed breaking down a sites functionality from ground up. We talked ways to get people interested in a website from Tumblr, to Instagram, to Twitter feeds.
The board was a mess, but we ended up with a simple site focused on updated feeds via Twitter/Tumblr/Instagram and Contact Info! Really the important stuff.
Check the board.
http://instagr.am/p/Hk-HPZHmp9/
In class we are jamming on creation of an email campaign using existing art direction. It was a toss up and we are moving forward designing for Antrhopologie.
Homework is to finish up the email campaigns. We will be presenting at the beginning of next class.
Word up.
In class we took it back to the old school and talked Photoshop in a really granular light. What are color profiles? How do they work on the web?
We also talked basic setup in Photoshop around the 960.gs system and how to get the page created correctly for web.
Keep jamming on those team project index pages.
Homework: Get as far as you can on your index page infusing elements from your Art Direction. Next week in class I will help teams convert what they got on the page to make elements for their full site.
In class we walked 1-10 through Dieter Ram’s Principles For Good Design with brief explanation of why they are still not only relevant, but more useful than ever as we expand into new interactive markets, like mobile.
Remember, these were created by Rams for Braun’s Industrial Design Department around product development. Apps on your phone are products that need to be developed.
Let’s polish up those design skills.
I personally think the best way to learn is to benchmark off some pre-existing excellent interactive sites on the web. That way we strip Art Direction from the students to focus exclusively on production of existing styles that are doing something really nice.
We picked in random and students jammed on duplicating the sites all the way down to the % of drop shadow.
I demoed recreation of DesktimeApp.com as the example.
We jammed on: Jeep.com, VictoriasSecret.com, Facebook.com, LinkedIn.com, OldSpice.com, 37signals.com, Etsy.com, MarthaStewart.com, Twitter.com, Target.com, & Pinterest.com.
Next week we will post the progress.
Tonight, Jon Buda is going to come through to talk about the process around making his product Desktime.
This week in class we will be auditing a very expensive newly launched website that doesn’t quite cut it. We will assess everything from usability to aesthetics.
We will also be doing a 120 minute in-class design copycat assignment. More on that on Tuesday.
CPS and the class would like to thank Nick Disabato for coming out to speak at our class tonight! Nick was also kind enough to give a digital copy of his book Cadence & Slang to all of the students in attendance, which was a very very nice gesture.
Thanks again Nick.
There are 2 pieces of homework from Class #5:
1. Finalize the functionality of ALL THE PIECES that need to be on the page for 2 main pages from your concept. You pick the pages. This may be your login page, a product page, a question page, or just a content page. Create a sketched wireframe (as a group).
2. Everyone on your team must try to create a PSD layout of 1 of your main pages. Essentially, this is Art Direction, but the goal of getting this all on to the page is to creatively solve problems as to how your product functions.
Names have been changed and overall concepts are starting to come together. Take a peek at the project pitches and inspirations.
Art School Book
Class #5 will open with a lecture by Nick Disabato (@nickd) (who you may know from either Cadence & Slang, or his new project Distance.)
Nick will be giving a lecture about deceptive UX techniques, that I heard him give last year before he presented it at the Web 2.0 conference.
After Nick, we will be breaking up into our project groups and presenting our decks to the class, myself and hopefully/possibly Nick.
After presentations, I will choose 1 teams deck to critique (the idea, not the deck itself) with the class.
Once every team has presented, we will start jamming on taking a wireframe and putting a design shell around it.
