Skip to content

Latest commit

 

History

History
87 lines (56 loc) · 6.02 KB

240930_Skeuomorphism.md

File metadata and controls

87 lines (56 loc) · 6.02 KB

Preface

I've always been curious and interested of graphical user interfaces. I find it fascinating designing interfaces that are the point of contact and connexion of humans with their machines.

Introduction

Some Dictionary

GUI: Graphical User Interface UI: User Interface UX: User Experience

A small bit of History

In a small research lab down in Palo Alto, was an all-in-one desktop computer prototype that amazed anyone who had the chance to see it. The few who had the chance to meet this machine, took the main idea and ran with it to create a new generation of personal computers. That computer was the Xerox Alto, imagined at Xerox's PARC, and considered by many the first computer to feature a GUI, a Graphical User Interface, that almost turned the world upside down. Using common language, the portrait monitor displays text, small icons and allowed the use of multiple programs at the same time, in what was called the Desktop, just like the one at work, with items on it. The Alto is the first computer to use a WYSIWYG, What You See Is What You Get, text editor and bitmap display, meaning that you could print exactly what was displayed on the screen. Steve Jobs and Bill Gates both went to see this marvel and went on to copy the idea for their respective software, with Apple unveiling the Lisa in 1983 and the Macintosh in 1984. As for Microsoft, the first version of the Windows OS, operating system, was announced in 1983 as a GUI add-on for MS-DOS, but later came out as a standalone OS in 1985 and was licensed by PC manufacturers, mainly IBM.

In 1988, Apple filed a lawsuit against Microsoft and Hewlett-Packard for using visual GUI elements similar to Apple's Lisa and Macintosh OSs. Seeing this lawsuit, Xerox also filed one against Apple alleging that the Macintosh's GUI was heavily based on the Xerox Alto's OS. After 4 years and an unsuccessful appeal to the Supreme Court, the United States Court of Appeals for the Ninth Circuit dismissed. Claiming that "Apple cannot get patent-like protection for the idea of a graphical user interface, or the idea of a desktop metaphor which concededly came from Xerox. It can, and did, put those ideas together creatively with animation, overlapping windows, and well-designed icons; but it licensed the visual displays which resulted."

From that point on, GUIs kind of became open-source, in a way that nobody could copyright the famous desktop metaphor.

What is Skeuomorphism?

Way before screens, Skeuomorphism traces its roots from material objects and movements like Art Nouveau, but it only used on computers starting from the 1980s. Skeuomorphism is considered to be the use of metaphors of real life to mimic the real-world objects represented.

Research Question

It's with that fascination into user interfaces that I wanted to revisit Skeuomorphism, maybe out of Nostalgia, but more importantly investigate the emotions of people who used these interfaces and what they think of them now. I'm also thinking about the future, as we're recently seeing a return to three dimension styling to user interfaces. So, what is the Role of Skeuomorphism through Materiality, Accessibility and Nostalgia?

Methodology

Mixing qualitative and quantitative surveys and interviews, I wanted to know how ordinary people think of Skeuomorphism in user interfaces. I started interviewing people for an hour, where we went back in time and used old technologies from more than ten years ago! Apart from that, I went on to post a survey on some Reddit groups to gather insights on people but also references.

The interviews I first conducted consisted of asking people about their knowledge of Skeuomorphism, explaining it, comparing it to Flat Design, asking their opinion on both design styles and finally enquire them about their ideas for future GUIs or UIs in general. The next step was to make them choose a device from the table, turn it on and use it until they want to go to another one. While they're using it, I'm asking questions and guiding them to open some apps like Calendar, Notes, Media Player, ... All while prompting them for reactions and emotions. The devices were composed of two laptops and three smartphones, displaying a range of what I call the spectrum of skeuomorphic GUIs.

Design Elements

The Spectrum of Skeuomorphic GUIs

Here's a visualisation of all kinds of Skeuomorphic GUIs, as I've discovered there are lots of different designs and views of the Skeuomorphic Design movement.

Visual

Glossy Elements, Textiles, Metal, Wood, Paper, ... Visually, Skeuomorphic GUIs stand out a lot.

Audio

Sound Effects recreating real world sounds, helps with immersion.

Motion

Movement and animations

Usability and Accessibility

Metaphors

In the 1980 and 1990s, metaphors were being discussed in Human Computer Interaction as a way of democratising computers by using words everyone knew, mainly in business environments; Desktop, Folder, File, Trash Bin, ... A reason for that was that computers were initially work equipment, but it's also words everyone gets the concept of.

Metaphors also benefit from mimeticism, as lots of icons and layouts mimic their real life counterparts.

Affordances

"See that door handle? How do you know you have to pull it?" "Do you see the button on the blind's remote? How do you know you have to press it?"

After explaining the concept of Affordances to the people I interviewed, many attested, without me asking, that phones and computers they use today have lost some affordances in their respective user interfaces.

Nostalgia

Simpler Times

We tend to think that "Before, things were always better".

Legacy

How does Skeuomorphism's legacy influence today's UI design.

An Unrealised Future

How Gen Z sees Skeuomorphism.

Conclusion

What's Next?

text

Practical Project

I don't know yet. :(


References

  1. Alan F. Blackwell. 2006. The reification of metaphor as a design tool. ACM Trans. Comput.-Hum. Interact. 13, 4 (December 2006), 490–530. https://doi.org/10.1145/1188816.1188820