• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Logical design for developers
 

Logical design for developers

on

  • 760 views

Slides for Logical Design for Developers, Design isn't a 4 letter word. For 360|Flex conference in Denver of 2011

Slides for Logical Design for Developers, Design isn't a 4 letter word. For 360|Flex conference in Denver of 2011

Statistics

Views

Total Views
760
Views on SlideShare
760
Embed Views
0

Actions

Likes
1
Downloads
23
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Logical design for developers Logical design for developers Presentation Transcript

  • LOGICAL DESIGN FOR DEVS Design isn’t a four letter word Denver 2011
  • Dee Sadler Adobe Community Professional Adobe UG Manager Adobe Certified Expert / Instructor Adobe Influencer Program and... am a UI strategist for SprintDreamweaver and Fireworks CS5 videos for Total Training presenter @DeeSadler
  • Don’t make design too hard It is important to understand the audience, who will consume the data. What do they expect?
  • Technical skill is mastery of complexity,while creativity is mastery of simplicity.— Christopher Zeeman
  • Design is justa processwith rules,patterns andconventions
  • Design can be logicalFibonacci Golden Ratio Spiral Golden Rectangle
  • In Fact, Design has Acronyms too UI / UXUI is what the user sees and controlsUX is what the user feels (wait times,steps in a process, shifts in attention)
  • 5 major areas of design1.Typography2.Color3.Whitespace4.Imagery5.Grids
  • Good design is partially creativity and innovation,but primarily knowledge and awareness.— Chuck Green
  • Typographyto Serif or Sans Serif
  • Typography isnt just about the font. It reflects the tone.
  • Type andWhitespace From alistapart.com
  • Know your audience
  • Color, contrast, spacing, line-height, weight
  • Having small touches of color makes it morecolorful than having the whole thing in color.— Dieter Rams
  • Color
  • Fireworks Photoshop Illustrator
  • Kuler.adobe.com
  • Kuler.adobe.com
  • Design is intelligence made visible.— Alina Wheeler
  • Whitespace
  • http://pttrns.com
  • Space draws the eye
  • How does you user use your site/application?
  • Imagery
  • Rule of 3rdsThe rule states that an image should be imagined asdivided into nine equal parts by two equally-spacedhorizontal lines and two equally-spaced vertical lines,and that important compositional elements shouldbe placed along these lines or their intersections
  • SuggestionsAvoid animation.Choose images with a strong foreground element.Compress your imagery but not too much!Use faces, people are naturally drawn to them.Avoid clipart illustrations
  • Cropping images
  • I believe that a good user interface is carefully targetedtowards its audience, with the right mixture ofsimplicity, elegance and innovation.— Robert Peloschek
  • Grids/wireframing/ prototyping
  • Also a widget for OSXhttp://goldenratiocalculator.com/
  • For Images
  • Grids
  • 960.gs blueprint.comhttp://designbygrid.com/ Fireworks:New FromTemplate>Grids
  • Wireframes Balsamiq Axure Fireworks OmmnigraffleEightShapes for InDesign iMockups for iPad SketchyPad for iPadKeynottopia for Keynote many, many more
  • Controls V1.1Date July 2010 Option 1Sun Mon Tue Wed Thu Fri Sat Search 1 2 3 4 Option 1 5 6 7 8 9 10 11 Option 212 13 14 15 16 17 1819 20 21 22 23 24 25 ✓ Option 326 27 28 30 31 Option 4 Label Label Option 5✓ Label Label123 MenuLabelTextBox * Required List Option 1 Item 1Text Area Option 2 Item 2 ✓ Option 3 Item 3 Item 4 Option 4 Item 5 Option 5
  • Fireworks Android template
  • Working in Fireworks Auto Shape Auto Shape altered
  • Pages/Master Pages
  • Annotations Extensionhttp://www.3revolutions.com/public/portfolio/fireworks/index.php? dir=00.Annotation%20Command%20Panel
  • "Everything is design. Everything!"— Paul Rand
  • Rules are made to be broken
  • All links will be available if you email me.dee@aboxofpixels.com 360|Flex in title