30+ Recent Design Elements in Web Apps
Upcoming SlideShare
Loading in...5
×
 

30+ Recent Design Elements in Web Apps

on

  • 4,183 views

A summary for this great question that appeared on Quora: ...

A summary for this great question that appeared on Quora: http://www.quora.com/User-Interface-Design/What-are-the-best-UI-elements-controls-patterns-etc-that-have-cropped-up-in-modern-web-sites-and-web-apps-recently

Statistics

Views

Total Views
4,183
Views on SlideShare
4,019
Embed Views
164

Actions

Likes
38
Downloads
82
Comments
0

14 Embeds 164

https://twitter.com 54
http://www.linkedin.com 48
http://user-experience-specialist.blogspot.de 21
http://pinterest.com 14
http://www.i4u.com 10
http://user-experience-specialist.blogspot.co.il 3
http://user-experience-specialist.blogspot.in 3
http://dsherpas.com 3
http://user-experience-specialist.blogspot.ch 2
http://user-experience-specialist.blogspot.com 2
http://www.twylah.com 1
http://user-experience-specialist.blogspot.ru 1
http://user-experience-specialist.blogspot.cz 1
http://www.pinterest.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

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

    30+ Recent Design Elements in Web Apps 30+ Recent Design Elements in Web Apps Presentation Transcript

    • 30+ Recent Design Elementsin Web AppsAmi Rotter © 2012 MediaMind | A Division of DG | All rights reserved
    • http://www.quora.com/User-Interface-Design/What-are-the-best-UI-elements-controls-patterns-etc-that-have-cropped-up-in-modern-web-sites-and-web-apps-recently © 2012 MediaMind | A division of DG | All rights reserved
    • Sticky headers/sidebar content - critical elements stay fixed as you scroll down Google Plus © 2012 MediaMind | A division of DG | All rights reserved
    • Sticky headers/sidebar content - critical elements stay fixed as you scroll down http://pitch.csspiffle.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Pinterest Style Layouts http://pinterest.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Infinite scroll Google Image Search © 2012 MediaMind | A division of DG | All rights reserved
    • Circles © 2012 MediaMind | A division of DG | All rights reserved
    • Circles © 2012 MediaMind | A division of DG | All rights reserved
    • Responsive layouts http://mashable.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Responsive layouts © 2012 MediaMind | A division of DG | All rights reserved
    • Responsive layouts © 2012 MediaMind | A division of DG | All rights reserved
    • In-field labels © 2012 MediaMind | A division of DG | All rights reserved
    • In-field labels © 2012 MediaMind | A division of DG | All rights reserved
    • In-field labels © 2012 MediaMind | A division of DG | All rights reserved
    • Validation as you go © 2012 MediaMind | A division of DG | All rights reserved
    • Form elements that dont look like form elements, Conversational UIs © 2012 MediaMind | A division of DG | All rights reserved
    • More friendly, conversational language around form elements © 2012 MediaMind | A division of DG | All rights reserved
    • Conversational UIs http://sortfolio.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Conversational UIs, Bigger type sizes, hit areas, buttons and white space http://uxarchive.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Conversational UIs, Bigger type sizes, hit areas, buttons and white space https://ifttt.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Bigger type sizes, hit areas, buttons and white space https://new.myspace.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Bigger type sizes, hit areas, buttons and white space www.pluralis.com © 2012 MediaMind | A division of DG | All rights reserved
    • "Kiosk style" Bigger type sizes, hit areas, buttons and white spacehttps://ifttt.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • "Kiosk style" buttons - rather than present radio buttons options medium.com © 2012 MediaMind | A division of DG | All rights reserved
    • "Kiosk style" buttons - rather than present radio buttons options © 2012 MediaMind | A division of DG | All rights reserved
    • "Kiosk style" buttons- rather than presenting a list of checkbox options + largetypography https://new.myspace.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Auto save functionality Gmail.com © 2012 MediaMind | A division of DG | All rights reserved
    • Auto save functionality © 2012 MediaMind | A division of DG | All rights reserved
    • Auto save functionality http://www.quora.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Drag and Drop to Attach Files https://basecamp.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Drag and Drop to Attach Files, New features introduction layers © 2012 MediaMind | A division of DG | All rights reserved
    • New features introduction layers © 2012 MediaMind | A division of DG | All rights reserved
    • Skeuomorphic design elements © 2012 MediaMind | A division of DG | All rights reserved
    • Skeuomorphic design elements (+ Auto Save) © 2012 MediaMind | A division of DG | All rights reserved
    • Skeuomorphic design elements http://www.linkedin.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Skeuomorphic design elements © 2012 MediaMind | A division of DG | All rights reserved
    • Bauhaus, minimalist design © 2012 MediaMind | A division of DG | All rights reserved
    • Bauhaus, minimalist design © 2012 MediaMind | A division of DG | All rights reserved
    • Bauhaus, minimalist design © 2012 MediaMind | A division of DG | All rights reserved
    • Minimalist design + In-field labels + drag and drop files © 2012 MediaMind | A division of DG | All rights reserved
    • A move away from noticeable gradients and drop shadows Instead of… © 2012 MediaMind | A division of DG | All rights reserved
    • A move away from noticeable gradients and drop shadows http://dribbble.com/ididi © 2012 MediaMind | A division of DG | All rights reserved
    • Flat, monochromatic, small icons for common actions © 2012 MediaMind | A division of DG | All rights reserved
    • Flat, monochromatic, small icons for common actions http://dribbble.com/ididi © 2012 MediaMind | A division of DG | All rights reserved
    • Death of rounded corners? © 2012 MediaMind | A division of DG | All rights reserved
    • Combining data visualization www.decide.com © 2012 MediaMind | A division of DG | All rights reserved
    • Combining data visualization https://new.myspace.com © 2012 MediaMind | A division of DG | All rights reserved
    • Drawers and slide outs © 2012 MediaMind | A division of DG | All rights reserved
    • iPhone like notification © 2012 MediaMind | A division of DG | All rights reserved
    • More details on mouse over, "As you need it" functionality © 2012 MediaMind | A division of DG | All rights reserved
    • More details on mouse over + 3D effects http://tympanus.net/Tutorials/3DHoverEffects/index3.html © 2012 MediaMind | A division of DG | All rights reserved
    • More details on mouse over + 3D effects http://selection.datavisualization.ch/ © 2012 MediaMind | A division of DG | All rights reserved
    • Single page apps © 2012 MediaMind | A division of DG | All rights reserved
    • Fun or delightful elements © 2012 MediaMind | A division of DG | All rights reserved
    • Fun or delightful elements © 2012 MediaMind | A division of DG | All rights reserved
    • Fun or delightful elements http://photojojo.com © 2012 MediaMind | A division of DG | All rights reserved
    • Fun or delightful elements http://photojojo.com © 2012 MediaMind | A division of DG | All rights reserved
    • Fun or delightful elements- Tiny dancing Psy icon was added to the video page forGangnam Style http://www.youtube.com/ via Little Big Details http://photojojo.com © 2012 MediaMind | A division of DG | All rights reserved
    • Search boxes / Text Fields that "expand" on click http://www.businessinsider.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Search boxes / Text Fields that "expand" on click http://branch.com © 2012 MediaMind | A division of DG | All rights reserved
    • Large resizable Images © 2012 MediaMind | A division of DG | All rights reserved
    • Large resizable Images © 2012 MediaMind | A division of DG | All rights reserved
    • Immediate immersion vs. laborious registration processes (+ large images) https://medium.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Immediate immersion vs. laborious registration processes https://www.minutes.io/ © 2012 MediaMind | A division of DG | All rights reserved
    • Direct manipulation of objects https://www.minutes.io/ © 2012 MediaMind | A division of DG | All rights reserved
    • Web Fonts © 2012 MediaMind | A division of DG | All rights reserved
    • Increased focus on nice, readable typography © 2012 MediaMind | A division of DG | All rights reserved
    • Social- what my friends are doing http://www.teehanlax.com/work/ © 2012 MediaMind | A division of DG | All rights reserved
    • Urgency http://www.booking.com © 2012 MediaMind | A division of DG | All rights reserved
    • Autocomplete + Multi Select Controls1.2.3.4. © 2012 MediaMind | A division of DG | All rights reserved
    • Autocomplete © 2012 MediaMind | A division of DG | All rights reserved
    • The + that changes to an http://www.teehanlax.com/work/ © 2012 MediaMind | A division of DG | All rights reserved
    • Gamification- scoreboards http://gooodjob.com/ © 2012 MediaMind | A division of DG | All rights reserved
    • Gamification- Points, Credits, Badges, Etc http://www.quora.com © 2012 MediaMind | A division of DG | All rights reserved
    • Progress animations on buttons http://branch.com © 2012 MediaMind | A division of DG | All rights reserved
    • Thank You! © 2012 MediaMind | A division of DG | All rights reserved