04

Type Design II
DSD-3612-E
Philip DiBello

Tuesdays
03:20PM – 06:10PM
01/15/19 – 4/30/19

School of Visual Arts
209 East 23 Street
Room 304

Assignment 04
Website (tool)

You’re tasked to create a website that functions as a tool or experience for your user. Your main goal: design a tool for people. It’s main feature or functionality must be centered around an interactive component (user action & website response). You’re to deliver a prototype for your final project.

At minimum your final deliverable will be a working prototype in Invision. It’s also recommended to use Principle. Principle is an app that has the ability to create animated, interactive prototypes. You should have a minimum of 10 steps or screens to show the functionality of your website. These steps or screens should demonstrate the various states, hovers, clicks, responses, etc. that will respond to the user (for example, a button can have multiple states: normal, hover, pressed, visited, etc.).

Design your tool to do one thing well. Consider functionality and aesthetics as the main components of this assignment. Work in Sketch or Adobe Illustrator, you need to be designing for screens not print. Read through these guidelines if you need help. Invision makes a set of tools which speed up the design to prototype process called Craft, which is why Sketch is recommended.

Deliverables
1Invision or Principle Prototype
Suggested desktop width (1300px)
Suggested mobile width (375px)

Timeline

Week 8 — 3.12.19
Research & Sketches
Bring in at least two different ideas and corresponding research around the subject. The ideas must be designed in Illustrator or Sketch. Our conversation will be framed around the four criteria Andy mentions in his talk:
1. Is it specific?
2. Is it memorable?
3. Does it turn idea into form?
4. Does it benefit the user?

Research
Similar to how you accumulated research on your artist for the exhibition assignment, have some printed slides about what's driving your concept or subject. They can be mood board style, where you're citing visual references, or they can be text based and bullet pointed. These will help you explain your ideas and give you some support while explaining your concept. Don't worry about designing these, just have them to gather your thoughts and tell us what you're trying to achieve.

Animation
If you have any animations or interactions or other ideas you're thinking about bring your laptop or your movie files on a drive so we can project them.

Sketches
Please bring your website sketches printed on 8.5x11 paper. Print them out landscape, make sure to include the browser window for context. If your website scrolls then tile it together—


Week 8 — 3.19.19
Final Prototype
Have your final prototype ready to present. Incorporate animation and other interactive elements.

WATCH
Watch the above lecture by Andy Pressman. Write a 100 word summary and email it to me before class. Bring your summary to class printed for you to reference during crit.

BACKGROUND
The web combines three disciplines of graphic design into one medium; print, motion and interaction. It lives on our desktops and in our pockets. It can organize and manipulate data at will. It can calculate endless amounts of information instantly. It’s a living, breathing thing.

Websites can be utilitarian, performance, poignant, art, useful, generative, powerful, funny...

In recent years we’ve seen services that can seemingly do anything. Find you a taxi. Order you a pizza in one tap. Search the entierty of the internet and deliver results. What do we really need anymore? What do you want to see in the world?

Make that.