Your SlideShare is downloading. ×
0
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
SparxUp-UI by Andreas Fendri
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

SparxUp-UI by Andreas Fendri

652

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
652
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Hi! Startups :)
  • 2. Andreas Fendri
    User Interface Designer for Yahoo! Koprol
    k - @wandre
    t - @andreasfendri
    w – andreasfendri.com
  • 3. lets talk about
    User Interface Design
  • 4. So, What is User Interface Design?
    the design of apps, websites, etc, with the focus on the user's experience and interaction.
    What’s the primary goal?
    to make the user's interaction as simple and efficient as possible, in terms of accomplishing user goals—what is often calledUSER-CENTERED DESIGN.
  • 5. Visual
    Design
    functionality
  • 6. Five Attributes Usability Aspects
    Easy to learn
    Efficient to use
    Easy to remember
    Few errors
    Pleasant to use
    Jacob Nielsen, Useit.com
  • 7. The Spectrum of UX Design
  • 8.
  • 9. Information Architecture in Functional Wireframes
    Functional wireframes simply assert the information that will
    be displayed on any given page and nothing more.
    - NishantKothary (MIX Online)
  • 10. Wireframing
    1. Sketching / Paper Prototyping
    sketch paper, post-it, mechanic pen, color fine liner, etc
    2. Diagramming Software
    e.gOmniGraffle (Mac), Balsamiq, Axure
    3. HTML Wireframes
    Knowledge in HTML & CSS, takes longer, high details
  • 11. Designer as IA?
    DESIGN
    IA
    IA + Design
  • 12. Iterative in UI Design
  • 13. Suggestions
    Clear & Appealing Call to Action
    Progressive Disclosure
    Optimize active whitespace
    Technical case: Mega Drop Down Menu
  • 14. Good in UI, Good in IA
  • 15. Reuters Mega Drop Down
  • 16. References
    uxmag.com , uxmyths.comuxbooth,
    Inspirations: house of buttons, wireframes gallery (both on tumblr)
    Wikipedia keywords/topics: UI, UX, UxD (User Interaction Design), Iterative Design
  • 17. Mobile Interface
  • 18. Thanks :)

×