Not Signed-In
Which clippings match 'UI' keyword pg.1 of 1
29 OCTOBER 2013

Skeuomorphism has fallen out of favour in recent years

"Skeuomorphism has fallen out of favour in recent years, and is almost regarded as a dirty word by many in the design community. Apple this week announced a radical revision to the approach at its annual developer conference in California and its new mobile operating system will ditch real world visual metaphors in favour of a stripped–back minimalist approach. ... The podcast app recently lost its reel–to–reel tape deck look, a reference which would have been lost on many younger smartphone users. Not everyone will be pleased with the decision though, and some regret the decline of the skeuomorph."

(Sam Judah, 3 June 2013, BBC News Magazine)

1

TAGS

Apple OS • binder • clipboard • de-facto symbol • desktop metaphor • envelope • golden compass • GUIinterface designinterface metaphor • jotting paper • leather-bound desk blotter • mimesismimicry • mobile operating system • nostalgic yearningoffice metaphorold-world equivalentsreal world objectsreal world visual metaphor • red wax seal • representational systemsresemblancescissorsskeuomorphskeuomorphic designskeuomorphismsoftware programme • sticky notes • trash canUIvisual metaphor • Windows 7

CONTRIBUTOR

Simon Perkins
21 OCTOBER 2013

3 Design Layouts: Gutenberg Diagram, Z-Pattern, and F-Pattern

"Several layout patterns are often recommended to take advantage of how people scan or read through a design. 3 of the more common are the Gutenberg diagram, the z–pattern layout, and the f–pattern layout. ... While patterns like the Gutenberg diagram, the z–pattern, and the f–pattern layout suggest that there is a natural path the eye will take through a design, the reality is they refer only to designs dominated by large blocks of text with little to no hierarchy. ... Instead of trying to force your design into one of the patterns described, decide instead what information you want the viewer to see and through a series of focal points and design flow lead their eyes through your hierarchy of information. That's really the only pattern you need to use."

(Steven Bradley, 7 February 2011)

1

2

TAGS

design for the screen • F-layout design • F-pattern • Gutenberg diagram • layoutlayout designlayout patternslayoutspage layoutpage layout designpage layout patternUIviewing experiencevisual communicationvisual screen designweb designweb layoutweb page layoutsweb pages • Z-layout design • Z-pattern

CONTRIBUTOR

Simon Perkins
11 MAY 2012

Luke Wroblewski on: Multi-device Layout Patterns

"Through fluid grids and media query adjustments, responsive design enables Web page layouts to adapt to a variety of screen sizes. As more designers embrace this technique, we're not only seeing a lot of innovation but the emergence of clear patterns as well. I cataloged what seem to be the most popular of these patterns for adaptable multi–device layouts."

(Luke Wroblewski, 14 March 2012, via Christopher Allwood)

1

TAGS

adapt to screen sizes • adaptable multi-device layout • adaptive layoutBBC • column • column drop • columnscommunication design • design for large screen • design for mobiledesign for the screendesign innovationFacebook • Five Simple Steps • fluid grids • Food Sense (website) • Google (GOOG)grid systemHCI • image layout • information architectureinteraction designinterface designlayout • layout adjustments • layout designlayout patterns • layout shifter • layouts • Luke Wroblewski • margins • media query adjustments • mobile design • Modernizr • mostly fluid • multi device • multi-column layout • multi-devicemulti-device adaptation • multi-device layout patterns • multiple screen sizes • NUI • off canvas • optimised for mobilepage layoutpage layout pattern • Path (app) • responsive design • responsive design layout patterns • responsive web design • screen size • screen sizesscreen space • single column layout • small screen • small screen sizes • small screens • stacking • stacking columns • The Boston Globe • tiny tweaks • Trent Walton • UIusabilityvisual communicationvisual screen designweb designweb page layoutsweb pageswebsite

CONTRIBUTOR

Simon Perkins
18 MARCH 2011

The first graphical user interface using the desktop as a metaphor

"In 1973, the first graphical user interface was built at PARC, using the desktop as a metaphor. The UI introduced windows, icons, menus, file management, and tool palettes. Looking back at the first screenshots of this first GUI, the designs feel familiar even now. In 1974 PARC developed a What–You–See–Is–What–You–Get cut & paste interface, and in 1975 the demonstrated pop–up menus. The desktop concept was pushed quite a bit further by 1981 in the commercial Xerox Star PC interface, which was an important influence for the PC UI's created at Microsoft, Apple, NeXT, and Sun Microsystems in the 80's and 90's."

(Mike Kruzeniski, 17 February 2011)

1

CONTRIBUTOR

Simon Perkins
24 SEPTEMBER 2010

The jQuery Project

"jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.

jQuery UI provides abstractions for low–level interaction and animation, advanced effects and high–level, themeable widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications."

(John Resig)

1

TAGS

abstractionAJAXcodedesign for the screen • document traversing • event handling • HTMLICTinnovationinteraction • interactive web applications • JavaScript • JavaScript Library • John Resig • jQuery • jQuery Project • programming • rapid web development • solutiontechnologyUIusabilityweb applicationweb design

CONTRIBUTOR

Simon Perkins
Sign-In

Sign-In to Folksonomy

Can't access your account?

New to Folksonomy?

Sign-Up or learn more.