There are a lot of design trend analyses on the Internet every year, but most of the time they only analyze the surface and do not go deep. Trends change almost every year. How can we see the essence through the phenomenon? I think one way is to try to extend the timeline, look at the trend evolution from a higher dimension, and analyze whether it is necessary to follow the trend to design through the brand positioning of your own products. Apple’s design has always been a trendsetter in the design field. This article looks at the changing design trends horizontally by reviewing the design evolution of the 10 most classic apps in the App Store. A short blog post was published on Apple’s website, marking the arrival of one of the most important design opportunities in recent history. “I’ll just say this: we want native third-party apps on the iPhone, and we plan to have the SDK available to developers in February,” Steve Jobs wrote. Less than a year later, on a quiet Thursday morning, the App Store opened up to iPhone users with more than 500 apps. Few modern innovations have done more to change the way we live and interact with the world around us than iPhone apps. The developers of the first 500 apps released at the launch event had a unique opportunity to shape the design direction and interaction strategies of the millions of apps created since then. To celebrate the App Store’s 10th anniversary, let’s examine the visual evolution of 10 original App Store apps. 1. Application For this article, I’m focusing on the notable visual changes to apps that were available for download on day one and continue to be updated today. While many of these apps also have iPad versions, this article focuses on the changes to the iPhone versions. 1. iTunes Remote Apple set the standard for other developers by releasing some of its own software on the App Store. The first two apps developed were Texas Hold'em and Remote, a simple app for controlling the playback of an iTunes library on a Mac or Apple TV over Wi-Fi. In 2011, the Texas Hold'em app was removed from the App Store, but Remote is still updated. From the beginning, Remote's design was heavily influenced by the look and feel of the iPod app for iPhone (now called Music). In fact, the current Play icon was essentially identical in appearance. Version 2.0 brought a redesigned icon by Louie Mantia. The two apps began to diverge with iOS 6, when the Music app was completely redesigned and featured a volume slider that dynamically responded to your movements on the iPhone. Remote kept a more conservative look, and the icon was once again updated to match the style of iTunes 11 on the Mac. The first major redesign of Remote was done on iOS 7. In contrast to the pure white theme of the Music app, Remote had a dark blurred background, colored with the colors of the album artwork. In 2016, Apple released the Apple TV Remote app for the 4th generation Apple TV, a logical iteration that seemed to replace Remote. Not long after, Remote was renamed iTunes Remote. Although the app is still available for download, it has been almost unupdated for a long time since then. It was not until June of this year that it was completely redesigned and adapted for iPhone X. This update to iTunes Remote returns to a more conservative visual look, reminiscent of the iOS 11 Music app, but abandons the large title and card design in favor of traditional navigation. iTunes Remote uses blue to match the updated icon, rather than the original dark color scheme. 2. Facebook In stark contrast to iTunes Remote’s modest changes, the Facebook app has been redesigned with increasing frequency over the past decade. A complete history of Facebook’s visual updates would fill an entire book, so I’ve picked out the eight most significant ones here. Facebook's updates on the iPhone actually began before the App Store existed. The app originally launched as one of the first web apps for the iPhone in October 2007. Version 1.0 in the App Store is now almost unrecognizable as Facebook, except for the iconic blue navigation bar. Even the icon lacks the iconic white signature "f". The app's message stream is essentially a decorated table view with five tabs: Home, Profile, Friends, Chat, and Inbox. Version 2.0 is based on the same concept, but with two new layers of navigation below the main title bar. Facebook first introduced a 3×3 grid of icons to help with the app's growing navigation in version 3.0 in July 2009. Early screenshots showed this iconography, but the design was never released in a public version. In October 2011, Facebook 4.0 pioneered the navigation "hamburger menu". In the following years, the popularity of this application accelerated the innovation of design elements in various applications and websites. After version 4.0, Facebook's design schedule became more challenging. Facebook's appearance began to iterate faster and was often rolled out gradually, rather than all at once in the main version. In April 2013, Facebook tried "Chat Heads" in the iOS app. The avatars could pop up and move independently, and open the chat window directly when clicked. The new style of iOS 7 required a redesign of the navigation bar. Tab bar icons are still regularly repositioned and redesigned between updates. Some of Facebook's design challenges come from the scale of its operations. Unlike many small apps, Facebook must provide a consistent experience for its customers on a large number of platforms, not just on iOS. The August 2017 update was an attempt to unify the design of the information flow on iOS, Android, and the web, and its comment style also looks more like a Messenger conversation. 3. Things Things was originally developed as a task management tool for Mac, but the final version 1.0 was released on iOS. Culture Code, the author of the app, pointed out at the press conference that the initial version was completed in one month - a time that sounds impossible to complete. The two key issues with version 1.0 and the Mac version were that there was no way to sync and that tags could not be used. Despite the initial stress, the basic architecture of the app has survived to this day. An excellent Flickr album documents the early design stages of the app. The first major update was the release of version 2.0 in August 2012, with a new look and some personalized icon design. In September 2014, Things 2.5 updated the UI again, giving it a flatter look and lighter colors. Things 3 was originally planned to be a redesign, but development took longer than expected. Things 3, released in May 2017, was the most significant revision of the app to date. Almost every icon and UI element was redesigned, leaving only the underlying layout. In the updated launch video, Cultured Code specifically emphasized how animations were used to give the app a whole new feel. In 2017, the redesigned Things won an Apple Design Award. 4. OmniFocus Even in its infancy, the App Store has been flooded with task management apps. Things and OmniFocus from The Omni Group have been available on the App Store since day one. While both apps offer similar functionality, they have each taken their own unique design direction over the past decade. OmniFocus for iPhone initially featured a simple table view and custom icon navigation, winning an Apple Design Award in 2008. In June 2010, the Omni Group redesigned the interface and app icon to support the iPhone 4's retina display. One of the biggest changes to the app was the addition of a forecast mode in June 2011. The glossy date picker below the navigation bar became a defining UI element until it was redesigned in 2013 for iOS 7 and dropped the glossy texture. The new flat interface relies heavily on text color to perceive hierarchy. The spring 2015 update gave the Thines iPhone version a darker app icon with softer corners. Since 2012, each icon has included an Easter egg that even longtime users may not know about. Zooming in on the icon, you’ll notice that the texture in the original icon is actually made up of tiny repeats of the Omni logo. The most recent major update was OmniFocus 3.0, released in May. While many of the changes are related to functional logic, large titles and optimization for iPhone X still make the UI look brand new. 5. Evernote Evernote’s stylistic iterations perfectly capture many of the major software design trends from 2008. The note-taking and organization tool was originally developed as a desktop app before the App Store, and it sported its iconic elephant logo before launching on the iPhone. Like many early iPhone apps, Evernote 1.0 relied heavily on iPhone UIKit and realistic icons. The 2011 version redesigned the tab bar and optimized the "All Notes" view to be chronological. When Evernote added support for the larger screen of the iPhone 5 in 2012, the app still used the default iOS UI elements. The navigation bar and buttons automatically read the iOS 6 UI components. In November 2012, Evernote 5 was released. The app was redesigned from scratch and was a typical example of the rich texture and theme design of the era. The embossed icons, paper textures and shadows gave the app a sense of space. The app's icon removed the outdated glossy texture, but retained the metallic sheen. In a blog post, Evernote said: "We don't usually do a full redesign. In fact, it only happens at least every few years." Although they didn't know it at the time, Evernote was redesigned just one year later when iOS 7 was released at WWDC in 2013. The subsequent Evernote 5 also won the Apple Design Award. Evernote fully embraces the design trends of iOS 7. Every texture, shadow, and bevel has been replaced. A bright left-to-right gradient bar is applied to the navigation bar, matching the colors used on the new text icons. An update earlier in 2017 softened the design with a softer icon, a light navigation bar, note cards with subtle shadows, and a black tab bar. The font and tab bar icons were also updated. 6. eBay eBay’s design is arguably the most striking of the 10 apps on this list. Although Apple highlighted it at WWDC 2008, the original version of eBay for iPhone was pretty crude compared to today’s polished experience. By November 2009, the entire app had been rethought with a more consistent grey UI. eBay 2.0, released a year later, set the stage for how the app would be designed in the coming years. Although eBay had previously offered a standalone selling app, the feature was now baked into the mainstream experience. The app's main interface was also updated to finally feel like a true iOS design. Over several updates throughout 2013, eBay created new user experiences while maintaining the basic ones. Each change reflected the rapidly evolving software design tastes of the era. This constant iteration meant that eBay’s look and feel shifted fairly smoothly when the app was redesigned for iOS 7. Using a familiar color palette and navigation hierarchy helped preserve users’ memories. In September 2015, eBay 4.0 broke the mold. Most of the app's functionality was placed in the hamburger menu, leaving only three tabs at the top: "Activities, Shopping, and Sales," but this design didn't last long. By May 2016, eBay had almost completely restored the app's organizational structure, and today's layout is closer to the design launched in 2010. 7. Twitterrific Craig Hockenberry and The Iconfactory built the first Twitter client for the iPhone before the App Store was even launched. Thanks to jailbreak software developed by the Apple enthusiast community, developers had months of experience writing apps by the time Apple provided official tools. Twitterrific 1.0 borrowed a lot of design elements from the jailbroken version, and from the perspective of ordinary users, it was very dazzling. It won an Apple Design Award in 2008, and Twitterrific was also one of the first apps to use a dark theme, which is still popular today. But Twitterrific's design iterations reflect the history of Twitter as a service more than design trends. Each update reflects the changes in the characteristics and functions of the Twitter platform. In the early days, these features usually required third parties to innovate on their own. In 2012, Twitterrific 5.0 moved all navigation to the top of the interface and used completely custom UI elements, and a similar layout continues to this day. Just as attractive as the design of the app is its icon. In addition to being the first Twitter app to use a bird icon, Twitterrific is also one of the few iOS apps that looks more modern while retaining a richly detailed icon. The app's mascot, Ollie, has barely changed in the upgrade to iOS 7 and looks just as fresh now as it did in 2012. 8. Instapaper An app designed for reading puts content on top of chrome, so Instapaper’s design was naturally limited from the start. In fact, some of the most obvious visual changes came from changes to iOS itself. Both iOS 6 and 7 changed the navigation bar and button styles, giving the app two “free” visual updates. Of course, it would be inaccurate to say that the app hasn’t evolved. Instapaper started out as a free download on the App Store. Soon after, a paid version called Instapaper Pro was released. Fall 2011 saw the launch of a new icon designed by Dribbble co-founder Dan Cedarholm, a much-improved reading experience, and deeper UI elements. The icon later appeared on a WWDC slideshow about great images. In April 2013, Betaworks purchased Instapaper from founder Marco Arment, setting the app on a different path. The first major update under Betaworks' guidance was released in September 2013, coinciding with the iOS 7 update. Pinterest acquired Instapaper in August 2016, at which time the company promised that the app would continue to be updated. Under current ownership, Instapaper has maintained a fairly consistent visual look even after an update to support the iPhone X's Super Retina display. 9. PCalc The story of PCalc begins more than a decade before the App Store launched. Developer James Thomson released the initial version for the Mac in 1992, and its development continues to this day. PCalc launched on iOS from the beginning with a completely custom interface, offering a growing selection of themes and customization options. There are too many to highlight here, so I'm going to pick just a few milestones to illustrate. The first version of PCalc for the iPhone was ported from a widget on the Mac dashboard, but it was well integrated with the classic iPhone UI. The highlighted buttons and dark blue LCD panel matched the app's icon. In December 2008, a popular theme called Twilight was added to PCalc, which was somewhat similar to the default calculator app on iOS. It is still an option in the app today. PCalc has adopted a new default theme called "Samurai" and matching icons, adapting to the flat style of iOS 7. Some classic themes are still available in the application settings. PCalc's icon was updated again in March 2016. Since the release of iOS 10.3, Apple has allowed third-party applications to dynamically change their application icons without submitting new versions to the store. PCalc began to take full advantage of this feature in May 2017, launching a wide variety of alternate icons for you to choose from, and more have been added in subsequent updates. After 10 years of development, PCalc has pushed the practical limitations of the iPhone calculator app, and recent updates have enjoyed some creative freedoms, such as AR calculator mode. Support for iPhone X displays adds rounded corners to the Samurai theme. 10. Yelp Like Facebook, Yelp’s iPhone interface has changed significantly over the years, but its brand identity remains recognizable thanks to its consistent navigation bar colors. The app has grown in popularity thanks to its deep integration with Apple Maps. In August 2009, Yelp brought a rudimentary augmented reality interface to the iPhone version for locating nearby businesses. While it was a novelty at the time, the feature feels prescient today given the rise of ARKit apps. In January 2010, a 9-grid layout of shortcut icons was introduced on the new Yelp homepage. The same basic interface was refined in style until the entire app was redesigned in October 2013, giving it a flatter look and a more prominent "Nearby" tab. Yelp’s latest update enriches simple location-based results by showing content that’s relevant to you. This approach to information discovery through a comprehensive approach is a trend in UX design that has seen great success with the iOS 11 redesign of the App Store. 2. Icon Comparing all 10 highlighted app icon iterations reveals the unique path each has chosen to modernize. Some icons have remained fairly consistent over the past decade with only minor changes, while others have been redesigned every few years. Looking at the timeline, it becomes increasingly clear that the industry is keeping up with design trends. When the App Store first launched, glossy icons ruled the roost. Icons had gloss applied by default, and developers had to specifically disable the effect in Xcode to remove it. As iOS apps matured, most eventually lost the gloss and adopted very distinct, personalized designs. As we all know, iOS 7 redefined the standard of a good icon. With Apple's new icon set, highly textured and 3D-rendered works often looked out of place, and some clashed with the updated corner radius. As designers and developers gradually set new standards for icon design, details and more restrained colors slowly returned to many icons. 3. Personality Early iPhone apps plunged headfirst into an unknown world. With no set rules for how apps should look or work other than Apple’s own built-in apps, designers and developers had complete freedom to experiment. Still, many early apps looked and felt very similar as users and developers learned best practices hand in hand. Early feedback, trial, and error quickly shaped the evolution of each app. Within a few years, most apps found their niche and developed a unique style and personality. As hardware performance improved, design differentiation gradually shifted from static graphics to dynamic graphics and animated interfaces. The introduction of homogenous interface guidelines in iOS 7 has designers and developers starting from scratch, and many apps have begun to value the user experience, not just the visuals. Thoughtful information synthesis and predictive information design are often used to help surface new and interesting content that might otherwise be overlooked. Intelligent workflows simplify common operations and help reduce the time to complete tasks. The importance of good design goes beyond the visual level, which has led to the prevalence of user experience design in recent years. IV. The next 10 years In 2008, it was impossible to accurately predict how the App Store would evolve. Innovation is born of change, and the tastes and habits of iPhone users shape the types of apps developers choose to create. The same is true for the future, and upcoming iPhones and new versions of iOS are sure to change the app landscape in unforeseen ways. A new design trend could take the world by storm tomorrow. Even 10 years from now, the future is still exciting. |
<<: Use this free Sketch plugin to help you perfectly restore the Android interface!
>>: Discussion on building iOS engineering framework elegantly and quickly
Ms. Wang, 30 years old, has recently had frequent...
Taking advantage of the movie craze during the su...
Expert of this article: Wang Qian, attending phys...
In 2021, China's washing machine market achie...
Even if Google is reorganized into a subsidiary o...
There is no doubt that short videos are a good tr...
Recently, Shenzhou XII astronauts Nie Haisheng, L...
Why am I me and you are you? This is a philosophi...
According to German newspaper Bild am Sonntag, Vo...
Recently, the Russian army released a video of it...
Content at a glance: Dopamine is an important neu...
The "dark horse" of motivational videos...
"Persimmons cannot be eaten with fish, shrim...
People often ask: "What good marketing metho...
Although there are still more than four months le...