Period:
INDUSTRY:
August - October 2018
Food
Blockchain
LOCATION:
COMPANY:
Sydney, Australia
MY ROLE:
User interaction
Visual design
Pic4 & KPMG
KPMG Origins is an iOS app that was designed in collaboration with Pic4 and their client KPMG.
The project objective was to allow KPMG clients to trace the source of a wine bottle in seconds using blockchain technology.
Pic4 and KPMG have been collaborating in similar projects to trace food sources however in this project they required the skills of an interaction designer to create a delightful experience for the end users.
Where does this wine bottle come from?
How do we authenticate food items?
KPMG clients will have to enter the code provided to unlock the app.
Place the phone camera in front of the bottle label to begin with the scanner.
Once the label is scanned it will appear a list of different cards related to the wine story, finer points, journey conditions and tracker.
Hit on the cards to see more details like descriptive paragraphs, multimedia, content, location tracker or temperature and humidity charts.
When I joined the project the team had already completed extensive research into food authentication and supply chain the supply chain between the winery and the end users. They had also developed a detailed wine journey map that provided a clear vision for the app content.
Regarding to the app structure their requirements were:
- Have the scan screen (for the bottle label) first.
- Organize the supply chain into different cards so it is easy to scroll and read the info/data.
- Have the live camera image as the app background so it will seem that the cards are floating in the room.
- Display multimedia elements on some cards.
- Display maps, locations and navigation routes on some cards.
- Display temperature, light and humidity variations depending on the location.
As a design requirement, the app content had to display the wine data provided by KPMG on different cards so the first design proposals to discuss with the development team and them were about the scrolling options to navigate between cards.
As a design requirement, the app content had to display the wine data provided by KPMG on various cards. The first design proposals to discuss included different scrolling options to navigate between cards.
On the other side, a key requirement for KPMG was to surprise their end users with the app interactions so I proposed to use shorter cards that you could unfold to discover new info. The cards would unfold on the vertical axis so we decided to use the vertical scrolling to keep consistency.
In order to obtain the best feedback we held a feedback meeting each Friday where we had the Pic4 and KPMG development teams and project leads to discuss the app design. I sent the proposals beforehand so we maximised the face to face time to hear each other's point of view. In those meeting I shared the UX and UI proposals to the project lead and developers using wireframes, user flows and prototypes.
Having the development team in the weekly meetings was critical for the decision making process as they were able to provide instant feedback on if the designs were possible to build allowing for budget and time restrictions.
I presented UX & UI proposals using wireframes, user flows and prototypes.
User flows gave the team a clear overview of the app design and the interaction between screens. They also helped the team understand which screens were ready and which ones required more design iterations.
KPMG were also able to use the app user flow to share with other teams and start conversations with them about the project and the business strategy.
I used pictures with short titles and descriptions to allow images to be the wine storytellers engaging and attracting users at a first glance.
All cards have a consistent visual style although a few variations were shown to avoid monotony while scrolling.
Once the client approved the design, I started working on the development specifications. These specifications saved us time in the development process as it gave the developers a clear understanding of the design minimizing confusions that could lead to bugs.
