BEAN TREE STORIES
CLIENT School Project
ROLE Concept, Research, Visual Design
DURATION March – April 2018
Bean Tree Stories is an ipad app that helps to build lasting connections between consumers and their coffee through interactive immersive story telling.
Overview
There is growing interest in the entire coffee process from bean to cup in much the same way as we appreciate the finer points of wine, tea or chocolate.
The app takes the user on a journey through illustrated and animated representations of the countries where their coffee comes from and allows them to interact with special elements within them to learn more.
Goals
Based on the preliminary research results I was able to establish 4 primary goals from this project. The goals focused primarily on visual design due to project requirements and I took this opportunity to dive deeper into the visual design process and improve my workflow and my technical vocabulary.
To leave a lasting impact on the user and take them on an immersive journey.
A visually engaging design solution
Help users in appreciating and connecting with their coffee much via through this journey.
Be a source of knowledge imparted through an engaging experience.
Mood & Style
The direction uses painterly illustrations with clean minimal graphical elements. The interplay between white space and vibrant illustrations helps create engaging and easy to scan visuals.
Visual Elements
I attempted to address the goals I had set for this project through my visual design solution. I focused on the overall visual design as well as some surface level UI details.
Engaging painterly visuals
An illustration palette inspired by storybooks to add to the narrative nature of the project.
Smart story cards
UI elements driven by storytelling through a stepper based interaction that unfolds the story.
Interactive narration
Narrative and immersive UI to help carry the storytelling nature of the application.
Story sorting
Allowing users to sort through interactive elements on the screen.
Prototype
I began visualizing the experience through a series of concept animated user interactions in After Effects.
Immersive destination visualization
Articles sorted by tags to improve and speed up content access. This would also improve and make the search experience efficient.
Tag-Based content sorting
Articles sorted by tags to improve and speed up content access. This would also improve and make the search experience efficient.
Story visualization
Articles sorted by tags to improve and speed up content access. This would also improve and make the search experience efficient.
Final screens
Thank you!
Next Project –
