Project 5: Portfolio Site
Develop a design manifesto projecting a personal stance on design for an audience of peer designers
- identify a personal belief relative to design and generate a conceptually driven outcome
- translate through both a visual and verbal tone of voice
Work in this class to date has explored attention, design values, and manifesto precedents. Building atop of this, you will draft your own manifesto which intended for not only your class, but your design generation. It should be contemporary in its relevance to the audience. You have full control over the content, it’s structure, and the message and should aim for a final visual execution that is meaningful to the overall whole (not just a style picked and applied).
Project Parameters
- Word choice, structure, cadence and pacing are all carefully edited to reflect an identified tone of voice that is to be projected
- An argument articulating a perspective on contemporary graphic design or visual culture.
- Visual outcome driven by both the overall verbal message and tone of voice
- 18 x 24” OR 24 x 36”
- Typographic only
- Color as appropriate to your message
- Final printed on heavier stock (not bond/thin paper)
- Step 1: Compose
Start by considering the text you will be designing around. Take some time to think through and compose your thoughts on digital and interaction design, and respond to the following questions. You should shoot for having a couple of sentences (at least) for each response.- How do you define “Interaction Design”?
- What are the differences between designing for say, a print product, and a digital product?
- When was the last time you saw digital design in the world that surprised you?
- What does “UX and UI” mean to you (if anything)?
- What are you most interested in learning in this class?
- Step 2: Sketch
Based on our initial in-class critique, you will sketch some grid ideas that might be appropriate for your text. In Figma, create three (3) 1440 px wide frames. Design a distinct grid system for each. The particulars of each system are up to you, but consider the limits of the frame width, and the length of your text as constraining factors. - Step 3: Prototype
Start mocking up your text into each grid system. Try to keep things in black and white - we will determine the use of color later. You will select a typeface or variation for the header, subheader, and body text. Be creative and discover ways to adhere to, and break apart, each grid system. - Step 4: Code
Choose one of your grid systems to flesh out with html and css in Glitch. Introduce no more than two (2) colors to your design - be thoughtful in your use of color! You are also allowed to introduce three (3) images to your Homepage. Please also make a div for your future projects and exercises in this course.