PRTN
Social media content design, website design and brand strategy
During my time working with Matter Nutrition, it grew from a start up into SME. The development of the expansion of their product line involved a design of a completely new digital platform called PRTN.
The high-quality meals from Matter Nutrition are specifically catered to each individual's needs and goals. With the industry segment becoming increasingly saturated, one of their main goals was to ensure that we were diversifying rather than offering more meal plan solutions by taking into account the consumer's lifestyle rather than just the food. In addition to healthy food, they wanted to offer an ecosystem of trained professionals, educational information, and community support.
​
As they grew from a start-up to an SME, they wanted to gain visual consistency across all of their platforms, expand their product line, and rethink their consumer experience. I applied their original brand identity system to keep their social media platforms and brand image consistent and relevant.
Main takeaways
-
Build work that scales and flexes across a variety of audiences, devices, platforms.
-
Importance of brand consistency and how to achieve it.
-
Exploring revenue opportunities within and outside the business.
-
User testing doesn't end after development. Design is a constant iteration of improving the experience for the end user. Always find ways to listen and respond to your user's feedback.
We first set up PRTN with a set of brand standards that differentiated them from Matter while still staying related to each other.
Below are a few slides from that document
Social media posts:
Designing a new platform
I started pulling user interface inspiration from popular food delivery and meal prep apps to study how they guide users through complicated journeys.
To start the project off, we built an IA to create a blue-print of the app's infrastructure, navigation, and key features such as buttons and icons.
I initially started designing an app, however, after re-evaluating our goals we decided to design a web-app instead. It made more sense since we had a very short timeline to execute the project, and web-apps are usually quicker and more cost-effective to build. Furthermore, web-apps function in-browser and are easily accessible. I redesigned the flow and overall design with this change in mind to adapt it to a web-app design.
Range of meal options
Nutritional information when hovered over
This bar keeps track of how many meals are selected and the total cost of the
selected meals.
Product details
Progress bar that indicates the user where they are in the process of placing an order
Settings
Incentive program - this section displays the discount the user can receive based on how many meals they have already bought in
the past
I created a system that allowed users to custom-create their meals to fit their own lifestyle and taste. Based on what ingredients and portions they choose, the bars on the right display the nutritional information of their meal.
Profile page
Since there was a wide range of meal options available for users to pick from, I added sections for the user's most ordered meals and favorited meals so it is easy to access and add to cart. I also added a section that gives the status of their deliveries and an option for them to re-order past deliveries.
Schedule
