-
-
-
-
URL copied!
Gone are the days when designers used flashy illustration, animation, and ornamental elements to wow the user. Even though skeumorphism (i.e., creating 3D effects on a 2D surface) was very popular just a few years ago, designers now risk dating their websites or apps by using it.
Up until 2012, skeumorphism was the leading trend in digital design. Based on the Greek words “skeuos” (i.e., container or tool) and “morph” (i.e., shape), skeumorphism design took its cues from the physical world. Its primary focus was to make icons and other UI elements look “real.” Designers had to keep light and shadow in mind to prevent objects from looking fake.
Skeumorphism was one of Apple’s key design principles. Steve Jobs was able to successfully bridge the gap between new technology and non-techie users by providing elements that looked familiar, such as a 3D address book icon on the iPhone to represent a user’s Contacts list. This contextual approach enabled users of all levels to comfortably transition from the real world to the digital world.
However, digital interfaces are common now. Users don’t need UI elements to look like real world objects to understand them. Goodbye to complicated designs that are dominated by brushes, gradient drop shadow, strokes, light effects, etc. Now designers are creating UI elements with simple flat shapes and icons.
Microsoft and Apple have made this design popular during the last few years. Microsoft used flat design in Windows 8, and Apple also ditched skeuomorphism in iOS7. Below you can see a side-by-side comparison of Apple's iOS6 icons (skeumorphism) and iOS7 ions (flat design). The Contacts and Photos icons have become more symbolic, and the Clock has been stripped of its lighting gradient.
Below are the five principles of flat design and notes on how to achieve these goals:
-
Remove depth: Remove 3D elements from the UI, drop the depth, and remove all shadows, gradients, and strokes.
-
Use simple elements: “Flatten” icons and other elements by using simple shapes; ornamental elements are unnecessary clutter.
-
Focus on color: Use slightly desaturated colors to add beauty to a page instead of bleeding a user’s eyes with too much brightness.
-
Focus on typography: Use crisp and clear fonts that are chromatically placed with colors and shapes.
-
Embrace minimalism: Eliminate unnecessary elements and leave lots of empty space.
About the Author
Gopal Juneja is a senior engineer at GlobalLogic with over 13 years of experience in the technology field. He specializes in designing and developing UIs and is passionate about design.
Top Insights
Manchester City Scores Big with GlobalLogic
AI and MLBig Data & AnalyticsCloudDigital TransformationExperience DesignMobilitySecurityMediaTwitter users urged to trigger SARs against energy...
Big Data & AnalyticsDigital TransformationInnovationRetail After COVID-19: How Innovation is Powering the...
Digital TransformationInsightsConsumer and RetailTop Authors
Top Insights Categories
Let’s Work Together
Related Content
Unlock the Power of the Intelligent Healthcare Ecosystem
Welcome to the future of healthcare The healthcare industry is on the cusp of a revolutionary transformation. As we move beyond digital connectivity and data integration, the next decade will be defined by the emergence of the Intelligent Healthcare Ecosystem. This is more than a technological shift—it's a fundamental change in how we deliver, experience, … Continue reading How to Transition from Skeuomorphism to Flat Design →
Learn More
Leveraging SaMD Applications to Improve Patient Care and Reduce Costs
One of the most exciting developments in healthcare is the emergence of Software as a Medical Device (SaMD) as a more convenient and cost-effective means to deliver superior care to the tens of millions of people worldwide who suffer from various health conditions.
Learn More
View on payment industry modernisation: Drivers of change
The payment industry has been going through radical modernisation with multiple regulatory and infrastructure changes over the last five to ten years. The post-pandemic era has accelerated these efforts as consumer behaviour changed significantly during the COVID-19 outbreak. Consumers across the world expect real-time responses in all aspects of digital payment transactions and have adopted … Continue reading How to Transition from Skeuomorphism to Flat Design →
Learn More
The Rise of The Invisible Bank
Banks will power experiences, but everyone will ignore them. Inspiration for this blog title comes from Jerry Neumann, the author of the blog Reaction Wheel, who wrote in 2015 that ‘software eats the world and everybody ignores it’. Neumann also observed that ‘information and communications technology becomes ubiquitous but invisible’ – in other words, … Continue reading How to Transition from Skeuomorphism to Flat Design →
Learn More
GlobalLogic wins at the 2023 Analytics Institute Awards, Dublin
*This blog was updated on Friday 16th June. The team is excited to announce that GlobalLogic was named winners of the Emerging Technology Award at last night's Analytics Institute Awards! This prestigious award recognises organisations that have successfully employed new technologies such as IoT, Edge Computing, Machine Learning, or RPA. Our submission showcased the successful application of … Continue reading How to Transition from Skeuomorphism to Flat Design →
Learn More
MLOps Principles Part Two: Model Bias and Fairness
Welcome back to the second instalment of our two-part series – MLOps (Machine Learning Operations) Principles. If you missed part one, which focused on the importance of model monitoring, it can be found here. This blog explores the various forms that model bias can take, whilst delving into the challenges of detecting and mitigating bias, … Continue reading How to Transition from Skeuomorphism to Flat Design →
Learn More
Share this page:
-
-
-
-
URL copied!