Your SlideShare is downloading. ×
Isdp
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Isdp

105
views

Published on


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

  • Be the first to like this

No Downloads
Views
Total Views
105
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
  • As a constantly connected culture, we deal with a nonstop flow of information, some of it important and relevant, most of it not. We are constantly evaluating, filtering and, of course, creating content, and it all gets pretty exhausting. In addition, much of our content consumption has moved to devices with small screens, thus exacerbating that feeling of overload. Becoming overwhelmed is all too easy, and a reduction of clutter in a user interface (UI) can create a little visual zen.
  • As a constantly connected culture, we deal with a nonstop flow of information, some of it important and relevant, most of it not. We are constantly evaluating, filtering and, of course, creating content, and it all gets pretty exhausting. In addition, much of our content consumption has moved to devices with small screens, thus exacerbating that feeling of overload. Becoming overwhelmed is all too easy, and a reduction of clutter in a user interface (UI) can create a little visual zen.
  • As a constantly connected culture, we deal with a nonstop flow of information, some of it important and relevant, most of it not. We are constantly evaluating, filtering and, of course, creating content, and it all gets pretty exhausting. In addition, much of our content consumption has moved to devices with small screens, thus exacerbating that feeling of overload. Becoming overwhelmed is all too easy, and a reduction of clutter in a user interface (UI) can create a little visual zen.
  • As a constantly connected culture, we deal with a nonstop flow of information, some of it important and relevant, most of it not. We are constantly evaluating, filtering and, of course, creating content, and it all gets pretty exhausting. In addition, much of our content consumption has moved to devices with small screens, thus exacerbating that feeling of overload. Becoming overwhelmed is all too easy, and a reduction of clutter in a user interface (UI) can create a little visual zen.
  • Whereas traditional software developers tend to load their products with a glut of features to justify the high price tags, this shift towards focused micro-apps favors simplicity over feature set. Simpler apps mean simpler interfaces.
  • Whereas traditional software developers tend to load their products with a glut of features to justify the high price tags, this shift towards focused micro-apps favors simplicity over feature set. Simpler apps mean simpler interfaces.
  • As smartphone and tablet adoption has rapidly penetrated all user demographics, concern about the obviousness of controls has reduced. Whereas we once feared that users might miss a button if it didn’t pop off the screen, we are now willing to explore subtler interactions. Windows 8 and Chrome for Android even support touch commands that start off screen, without any visual indicator.
  • Most software will be limited by the platform on which it runs. Screen dimensions and pixel density are the confining factors of hardware. A minimal interface demands a very limited design palette, which means that every element needs to sing. Typographic scale and font weight will largely determine both the aesthetics and usability of a flat design. If your target devices can’t handle that level of nuance, you’re out of luck. As screen size and pixel density continue to increase on mobile devices, thinner and smaller type can be presented with better clarity. Of course, support for @font-face has also boosted the appeal of minimal typographic-focused designs.
  • One could certainly argue that flat UIs lend themselves to it more easily than many other styles. The other advantage of minimal design is the reduction in page weight and loading time.
  • Transcript

    • 1. iSDP 2014 GUI & INTERACTION DESIGN Version 1.0 – 18 Dec 2013 By : Mohd Syaheezam Asyraq Mohd Akhmal Manaf Ahmad Sahidi
    • 2. CURRENT ISDP
    • 3. ICON LIBRARY
    • 4. UI EVOLUTION WEB 2.0 EARLY DAYS (1995 – 2003) Menu all very clickable (2003 – 2010) MATURE UI (2010 – Menu all hyper clickable Design communicates - - shadow, bubbles, glares, Drop shadow skeumorphism Flat design interactivity 2014
    • 5. BIG PLAYER 2013 - MICROSOFT - GOOGLE - APPLE
    • 6. M i c r o s o f t : I t ’s H i p To B e S q u a r e    Authentically digital Live tiles Horizontal scrolling
    • 7. Google: Holding The Cards    Card-based design Overall layout very clean and easy to digest Textual information is organized per size and color and in order of importance
    • 8. Google Embraces Flat Design
    • 9. Apple: In With The Neue    Simpler icons, fresh type treatment and an overall flatter environment Overall layout very clean and easy to digest Lighter and breathable layout
    • 10. In the guidelines published by Apple for iOS7, “the UI helps users understand and interact with the content, not compete with it”.
    • 11. FLAT AND THIN WHY?
    • 12. I N F O R M AT I O N O V E R L O A D   Information overload a reduction of clutter in a user interface (UI) http://www.geckoboard.com/
    • 13. SIMPLICITY IS GOLDEN  Simpler apps mean simpler interfaces. http://www.geckoboard.com/ Beautiful and minimal: The Blue weather app by Oak.
    • 14. CONTENT IS KING, AGAIN   a return to a focus on content. focus on what things do, rather than what they will look like Beautiful and minimal: The Blue weather app by Oak.
    • 15. TECHNOLOGICAL LITERACY  Windows 8 & Chrome for Android support touch commands that start off screen, without any visual indicator. Beautiful and minimal: The Blue weather app by Oak.
    • 16. TECHNOLOGY’S INFLUENCE    Less assets in general (e.g background images) Screen dimension & pixel density factor Resolution independence (svg + icon fonts) Beautiful and minimal: The Blue weather app by Oak.
    • 17. RESPONSIVE DESIGN   Fast control Easier theming of interfaces Beautiful and minimal: The Blue weather app by Oak.
    • 18. FLAT DESIGN CONCEPT SHOWCASE
    • 19.  http://www.snowbird.com/
    • 20.  Clyph Calendar
    • 21.  http://www.oweather.net/
    • 22.  What Apps Concept
    • 23.  Dashboard widgets
    • 24.  Dashboard widgets
    • 25.  Dashboard widgets
    • 26. SAMPLE IMPLEMENTATION
    • 27. CONCEPT OPTION
    • 28. OPTION 1
    • 29. OPTION 2
    • 30. OPTION 3