Duration | 2 Weeks
Team of 3
Client | Pininfarina of America is the USA subsidiary of Pininfarina which is headquartered in Italy. Since 1930, Pininfarina has followed their values of elegance, purity, and innovation to redefine the standard of design in their multidisciplinary portfolio across many industries. Today, the Italian design house is a global design icon and well known for their projects with a multitude of international brands such as Ferrari, Maserati, Airbus, and Coca Cola, to name a few.
Brief | While Pininfarina currently maintains a desktop website and e-commerce shop, they have yet to branch out into the mobile landscape. With full autonomy on the mobile app concept, we are challenged to build and design a a mobile app for Pininfarina of America. What will be the “Wow” factor that would entice design lovers to download the app?
Target Users | Design Lovers
So let’s get down to business.
But first, let’s talk with our Stakeholder.
We commenced our project with a stakeholder interview to clarify our understanding of the deliverables expected from the stakeholder and concluded with the following guidelines for our research and brainstorming . . .
and onto the research!
To find out about where users are currently getting creative inspiration, we surveyed 35 people on their source of inspirations, and how they use the content that inspire them.
Demographics:
▪ All respondents are working professionals across 15 industries
▪ 74% of respondents are between the ages of 26-45
We asked these users...
▪ Where do you find inspirational content?
▪ Which design apps/platform do you use?
▪ What do you think are the most important features when showcasing an innovative design product?
▪ What is the purpose of the design content you find?
Along with the surveys, we also conducted in-depth user interviews with five users who either worked in the design industry, or interacts with designers in their field of work.
The goal of the user interviews was to understand how these users engage with design on a digital platform.
Using the notes from our user interviews, we put together an affinity diagram where we organized and categorized the insights into common themes.
Affinity Diagram
We discovered that . . .
When design lovers search for new sources of inspiration, they seek designs that…
With this knowledge, we continued on to the Value Proposition Canvas which identifies the users’ currents frustrations and needs, and then states how the Pininfarina app would be able to address those needs.
Design lovers experience the following when it comes to personal inspiration and design platforms are:
PAINS — the frustrations
▪ Feeling a constant need to keep up with the latest design trends
▪ An exciting app with a ‘wow’ factors that entices them to keep coming back
GAINS — their desires/motivations
▪ Finding personal or professional inspiration through design
▪ Understanding of the process behind the creation of these designs
▪ Sharing design ideas with their inner circle or group
From Research to Ideation
At this point, we’ve completed our user research and analyzed our findings into the critical action items for the next steps.
Next, we set out to define the parameters of our brainstorming by clearly stating the MVP that we need to achieve, as well as the problems and jobs that need to be addressed. Throughout the brainstorming and conceptualization, we constantly referred to the statements, especially the MVP, to ensure we were staying on track with our goal.
USER PERSONA
To commence the beginning of the app ideation, we created a user persona whose journey will help us conceptualize the app’s features and user flows.
Meet our persona, Chris —
He’s a junior architect with a passion for all things design.
User Persona
In the next stage, we used a variation of the ‘Crazy 8s’ to individually brainstorm ideas for features and screens that we believe would address the users’ pains and gains, and be crucial to the app’s functionality.
Once we had all our ideas down on paper, we used the Moscow Method to categorize these features by priority. We agreed the "Must Have" features were critical for the functionality of our first prototype while subsequent features will be considered once our MVP had all the essential features.
And with the key features identified in our Moscow Method, we created the Site Map of the mobile app. In this stage, we defined the pages within our navigation bar and established the relationship between the screens.
Our mobile app navigation will consist of the following key screens:
Homepage
Search
Add Design — Add/upload a design to the app
Design Challenge — Selection of Challenges from both Pininfarina and the community
Profile — User and Account Settings
Pininfarina — About the Company, Pininfarina Projects and Process
With the Site Map defined, we put our ideas and visualizations down on paper and got our lo-fi wireframes.
Lo-fi Wireframe Sketches
Visual System
Screenshots from Pininfarina's website
As Pininfarina already maintains a desktop website, we were able to take inspiration from the recurring design and color schemes on the website. When building out our design system for mobile, we tried to stay true and consistent with the company’s design values.
The Pininfarina mobile app would inherit the same font and brand colors seen on the website. While we had complete freedom in determining the format and style of iconography, buttons, and other design assets, we made sure to keep the Style Guide aesthetics consistent with what we saw on the Pininfarina website.
Usability Testing and Iterations
First Round: Lo-fi Prototype Testing
Summary
Five users were presented with the lo-fi prototypes and asked to perform the tasks specified in each flow. The users’ interactions and results directed the first round of iterations which mostly centered around the wording on our content, and keeping language consistent throughout the app.
For example, ‘Brief’ and ‘Challenge’ were used interchangeably throughout the app to describe the design challenge used as guidelines for designs. This created confusion over its difference so we updated our flows to only use the term ‘Challenge’.
Second Round: Mid-fi Prototype Testing
Summary
Compared to our lo-fi testing, we saw smoother interactions and received a lot of feedback on desired features. Some of these we were able to implement, and some we saved for next steps.
Final Round: Hi-fi Prototype Testing
Summary
We conducted two concept test sessions where we walk our user through our prototype while they explain their perceived concept and functionality of a screen. The purpose of the concept testing is to help us understand the intuitiveness of the app’s layout and design without our guidance. This guided us through our final round of iterations which included minor but important details that would enhance the user experience.
Final Designs
Our prototype consists of three user flows, each of which depict separate but crucial events in the overall user experience on the app.
Flow 1
The user will identify a Pininfarina design challenge of their choice, and accept the challenge.
Flow 2
The user will view and save a design project that inspires them, and then navigate to where their saved designs are located.
Flow 3
The user will go through the process of uploading and publishing a new design.
KEY LEARNINGS
▪ Don’t assume interviewees know what you’re questions or brief is about. Give a clear explanation of what you are doing at the beginning.
▪ Constantly refer back to your MVP to ensure your product is consistent with the original goal- sometimes we almost let ourselves get carried away as we went down a rabbit hole of possibilities for existing ideas.
▪ Don’t get attached to an idea or keep trying to validate it- Augmented Reality was an idea brought up in the beginning of our ideation and the idea felt validated when it was brought up during the user interviews. For awhile, we tried to validate the need for AR in our app before we had to question the necessity of its role within the overall user experience.
FUTURE ROADMAPS
▪ Include an introduction/tutorial screen that briefly explains to new users how the app works.
▪ Build out second priority pages that weren’t included in our 3 flows within this project. These pages could be: About Pininfarina, Showcase of Pininfarina Projects, The Pininfarina Process, alternative uploading flows.
▪ Implement AR (Augmented Reality) into our app; this could be an AR modeling of Pininfarina’s works, or a rendering of user’s uploaded designs.
▪ Build another user profile that isn’t the user persona to show how a user can interact with another user on their profile. For example, they might be able to Follow, and Message the other user.
