PUML App Wireframes and Interface Design
I was responsible for...
- User Experience Design
- Wireframes
- Low Fidelity Prototype
- User Interface Design
- High Fidelity Prototype
I was asked to develop wireframes, prototypes and finished designs for a fitness app that exchanges the user's health data for bitcoin rewards.
What’s a Rich Text element?
Sunheading
Another subheading
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
Static and dynamic content editing
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!
- This is an example bullet point text,
- Here
- And here
- Also this line as well.
How to customize formatting for each rich text
Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
And here is a really important quote that I'll want to highlight.
• • •
Project objectives...
I was given the task of realising the ideas of a new project utilising cryptocurrencies to motivate people to be more active.
My objective was to design the experience for a complex app with an easy and enjoyable experience that users wanted to come back for.
• • •
I was responsible for...
- User Experience Design
- Wireframes
- Low Fidelity Prototype
- User Interface Design
- High Fidelity Prototype
• • •
Project details...
Onboarding
There was a four step onboarding process for the PUML app.
As the user's security was a priority, we also allowed the user to secure their data with a four digit code to keep login quick, as well as secure
Challenges
Challenges is where the user can discover, enter and follow challenges. A challenge can be hosted by their local gym, or they can join challenges from other sponsors. Once they enter a challenge, the app hooks into their health profile via a third party health app. This then allows them to compete for PUML tokens, by either reaching a data goal, or being within a top position, which they can track via a live leaderboard.
Marketplace
The PUML Marketplace give users access to items and promotions which they can redeem using their PUML tokens.
• • •
Applications Used
Applications Used
Sketch for UX exploration and final UI design
Abstract for sketch design file management and version control
InVision for low fidelity prototyping
Principle for high fidelity prototyping
InVision Inspect to assist developers during handover
Slack for team communications