1
Design from my POV (brain) Doesn’t Require a Muse Information is the seed from which design grows Inspiration happens Design isn’t Surface More than a thin layer on top More than making something pretty Aesthetics are important, just not the most important Design is Communication Drives the message Design is the Glue Between People and Content The Power of Limitations (Box of 64) Limitations generate creativity Limitations create focus Examples Style Guide Layout Results of Research Absence creates stress Blank canvas syndrome Process - A la cart tornado (map) There is no magic bullet You gotta pick and choose Use what works for you Iterate - Do it again Problem Definition What kind of problem? New or existing Content Workflow Graphic design What are the goals? What are you trying to achieve and for whom? Think, write, reflect Identify possible solutions What is the strategy? Research Information Analytics? Who are the users? What are users trying to accomplish? Go talk to people Concept Visual Hierarchy Size Layout Spacing Typography Sketch Wireframes Expresses intent Design Look-and-feel Style boards Color Tone Common elements Mockups Photo Graphics Implementation Code HTML/CSS Templates Frameworks Javascript Accessibility Responsive design It’s really about adjusting the design to the size of screen and/or device Break points There is no fold Evaluation Accessibility Usability Responsive Break Points Go talk to people! Communication and Collaboration (decoder ring) Yes and… Designing together is like Jazz Fosters openness Awesome with iterations Listening Not just the words, but the picture that you paint Good for team work Use Your Words Providing a safe zone for conversation Comfortable Bridge to concepts Provide Examples Cant explain it? Show me a picture. Sketch Don’t have a picture or one that works? Sketch it. Feedback Be specific Give it to me straight Compliment sandwich

Session Outline: Demystifying Web-based Design for Non-Designers and the Art of Good Collaboration

Embed Size (px)

Citation preview

Page 1: Session Outline: Demystifying Web-based Design for Non-Designers and the Art of Good Collaboration

Design from my POV (brain)Doesn’t Require a Muse

Information is the seed from which design growsInspiration happens

Design isn’t SurfaceMore than a thin layer on topMore than making something prettyAesthetics are important, just not the most important

Design is CommunicationDrives the messageDesign is the Glue Between People and Content

The Power of Limitations (Box of 64)Limitations generate creativityLimitations create focusExamples

Style GuideLayoutResults of Research

Absence creates stressBlank canvas syndrome

Process - A la cart tornado (map)There is no magic bullet

You gotta pick and chooseUse what works for youIterate - Do it again

Problem DefinitionWhat kind of problem?

New or existingContentWorkflowGraphic design

What are the goals?What are you trying to achieve and for whom?

Think, write, reflect Identify possible solutions

What is the strategy?Research

InformationAnalytics?Who are the users?What are users trying to accomplish?

Go talk to peopleConcept

Visual HierarchySizeLayoutSpacingTypography

SketchWireframes

Expresses intentDesign

Look-and-feelStyle boards

ColorToneCommon elements

MockupsPhotoGraphics

ImplementationCode

HTML/CSSTemplatesFrameworksJavascriptAccessibility

Responsive designIt’s really about adjusting the design to the size of screen and/or deviceBreak pointsThere is no fold

EvaluationAccessibilityUsabilityResponsiveBreak PointsGo talk to people!

Communication and Collaboration (decoder ring)Yes and…

Designing together is like JazzFosters openness Awesome with iterations

ListeningNot just the words, but the picture that you paintGood for team work

Use Your WordsProviding a safe zone for conversationComfortableBridge to concepts

Provide ExamplesCant explain it? Show me a picture.

SketchDon’t have a picture or one that works? Sketch it.

FeedbackBe specificGive it to me straightCompliment sandwich