As an OS, Spectrum was designed with 13 native apps. This project was an exploration of design principles and mobile design systems.
In a group of 6 students, my role was lead designer and brand director. We designed Spectrum in Autumn 2017 in class about mobile design.
Visual & UI Design
Oct–Dec 2017 (10 weeks)
We wanted to explore designing systems, with the framework of designing a mobile OS. As part of that, we wanted to learn about design languages and design principles to unite an overall design.
Design systems enable us to build better products faster by making design reusable—reusability makes scale possible. They also reduce overall design/technical debt.
To better understand the mobile market, we took a look at current popular mobile operating systems–their design languages and distinct interactions as examples.
After auditing design patterns across these platforms, something that we took away from examining other OS designs was a pattern of exhaustion around apps with endless scrolling and too many notifications.
Discussing with my team, we decided to focus on designing a mobile OS that could give control back to the user by working against mindless browsing.
We settled on the three following principles to guide our OS design for mindful usage.
Spectrum is transparent and honest. Appearance is deeply intertwined with function.
Spectrum promises user control and freedom, allowing you to experience your own unique interface.
Spectrum promotes efficiency, allowing users to complete tasks in a fast and productive manner.
Inspired by Microsoft's Tiles and Apple's Widgets, we envisioned our own design system with widgets. Widgets are a way to stay informed and interact with apps at a glance.
Allow users to customize the size and arrangement of widgets
Shorten the journey
Limit widget info and interactions to the most necessary and relevant
Widgets are an efficient way to interact with and get at-a-glance, timely info from apps, all without having to enter the app itself. Users can add, organize, and customize different widgets for different purposes.
Widgets are the cornerstone feature of Spectrum because they represent our design principles–sincerity, personalization, efficiency–wrapped up into a neat concept.
Due to the fast-paced nature of the class, we quickly moved past ideation and sketching and jumped right into design. We only started off with low-fidelity wireframes of user flows through some native apps. Overall, we completed all app designs over 3 sprints focused on communication, productivity, and informational apps.
Introducing Spectrum, the mobile OS designed around sincerity, personalization, and efficiency. We created a total of 13 native apps, which include essential functions such as text messaging, calling, calendar, calculator, and more.
To condense the large amount of screens we have for each app, I've selected 5 apps that I personally contributed towards, with their best screens to showcase.
To my group members: Gina Lee, Kristy Chen, Jing Wen Pan, Yilin Jin, May Zhao
To Brian Fling, for roasting our designs each week for the greater good.
In addition, a team of designers reviewed our design along with other OS designs from the class. Spectrum scored the highest in class!