Students
- Brooklyn | Github | Project 1 - CPH 2019 | P2 - Sanded Studio Five
- Charlie | Github | P1 - Charlie Miller | Project two - parasite
- Sam P | Github | P1 - Dust of Snow | P2 - Zippo
- Cailin | Github | P1 - Narrative | Project 2
- Sam T-O | Github | Oxmore | P2 - Portfolio
- Kacie | Github | P1 - Changing Perspective | Project Two - this is tea
- Josh | Github | Project two - Portfolio
- Audrey | Github | P1 - Halloween | Project Two - Emma
- Mattieu | Github | Project One | Project Two
- Rosemary | Github | P1 - Tom Kha | P2 - Dream Bike
DUE MONDAY, March 1811:59PM
DELIVERABLES
WIREFRAMES
With clear explanation of basic interaction design decisions
IMMERSIVE SITE
Site should contain a home/summary page, about page, purchase page and a demo/gallery page.
PEER SITE LAUNCH CHECKLIST
Comprehensive list of essential web considerations. Will be provided prior to site launch.
PRESENTATION
A clear and concise explanation of your site.
GRADE BREAKDOWN
- 15% Process
- 15% Concept/Project Goals
- 20% Technical
- 20% User Experience
- 20% Information Architecture/ Aesthetics
- 10% Presentation
PROJECT OBJECTIVES
Quite often the focus of Interaction Design is held completely in the digital realm. We usually think of interactions in terms of clicks and drags, swipes and pinches. But long before we had computers and web sites, designers built chairs, doorknobs, lamps, dishwashers, bikes, everything; and all of these things had a “User Interface” that was meant to be used by humans.
Our second project in this class builds on the concepts and interactions that we explored in the first, and applies them to the character and affordances of a non-digital product. In addition to showcasing the features and qualities of the product, the site must feature interactions that highlight the way the product is used or what the product does. To minimize the time necessary to create content and branding, it is suggested that a well-established and branded product is chosen.
Sites will feature at least four pages: Home/Summary, About/Details, Purchase, and Demo/Gallery. All pages should include some non-standard interaction (something other than a normal click). The depth and complexity of these interactions don’t all need to be made with JS/jQuery, but this is another good opportunity to experiment, so don’t hold back too much.
CRITERIA
As we progress through this project, make sure to post any screenshots, photos, diagrams, etc. that are part of your process to the Basecamp.
RESEARCH/PROCESS
- Thorough look at how other designers are working in similar fields
- Understand how the product itself uses design to showcase its brand and reach users
- Divergent research process that considers various user experiences, navigation formats and aesthetic approaches to the problem (at least three directions of each)
- Complete UX workflow (content analysis, wire frames, style boards, design comps)
DESIGN
- Well-developed site structure/information architecture
- Intuitive navigation system that allows people to explore the content in clear and understandable way
- Appropriate design decisions, including color, typography, composition, hierarchy, imagery, etc. suitable to the site’s content
- Clear presentation of design, both visually and verbally, in class and on Basecamp
DEVELOPMENT
- HTML/CSS/JS should be clean and well organized
- All pages should link to all other pages
- HTML/CSS should validate
- Site should conform to all requirements of site launch list, such as working links, all images have ‘alt’ attribute, all pages have proper title tag, etc.