Spyras
Spyras is a respiratory analytics company providing a breathing platform for multiple markets including the medical, sports and consumer sectors. I worked as the lead product design engineer and head of product design at Spyras and have branded, designed and implemented the front end of the mobile, web and online dash-boarding platforms.
The mobile app connects to a breath sensing wearable device via Bluetooth. I was also the designer and engineer of the smart sensing module physical infrastructure and have a patent for the device.
For more information about Spyras please visit the website: spyras.com
Users can put on their mask, clip on their device and make breathing recordings. The design displays the user's live breathing pattern visually and provides key insights about their respiratory health, pollution, mask protection performance and usage.
The Spyras platform is designed to exist on many devices for versatile use. Sport and pollution protection users have the app on their mobile and smart watch. Businesses with employees wearing masks can use their online dash boarding view to track mask filter efficiencies and mask use. Sports coaches and clinicians can use the smart tablet to see key breathing stats and summaries of their athletes and patients.
The application is designed with the key real-time breathing capabilities displayed throughout. The soft component style of the interface and wave references bring the breathing visual through to the user. The pops of electric blue allow key messages to be portrayed to the user about their breathing stats and holds a sporty and fun style that contributes to a dominant brand identity.
There are adaptive design methods throughout the app with simplistic scrolling carousels that display the user's stats clearly.
The modular dash-board style home page brings versatility to upcoming updates and the addition of more features when unlocked.
Many of my design assets for UX/UI products are hand drawn and brought to life digitally. I designed, prototyped and built the front end of the mobile app to cater for all screen sizes and tablet devices.
The app includes tutorial animations and artistic animations throughout to make specific features pop out of the screen.
The flow of the app is such that, as soon as the user connects their device, they can quick-start a recording. When that recording ends their breathing stats pop up for them to explore further. Users can also see what the air pollution was during their activity and view more insights into air pollution particles.
The Spyras app started as a very basic reporting app with dark colours. As the company's goals evolved the design and app structure built new objectives. The design of the app was a continuously evolving aglie process. Market and user research was conducted and evaluated with clients in the space for new feature identification or user flow structuring. Many concepts for the design flow, interactions and branding features where developed into prototypes and pitched internally. Ideas where formalised with review meetings. New features where released in milestones. Each feature was researched, designed and developed into a testing mode. This was tested internally and with external users and clients, reviewed and adapted, then tested again before release.
UX breakdown example for 1 of the 4 different users profiles
After the first full release of the app further assets were created to work with the device capabilities. I designed and developed the front end code for the in app animated breathing exercises and a breathing game. The main breathing exercise was a real time animation for triangular breathing that counts cycles and engages a simple timed start stop.
The second main release of the app included a redesign for athletes. The home screen and stats screen were made to direct users to start sessions more easily with a quick start mode engaged by movement. With a soft, sporty and graphical stats screen, users can see a key stat comparison of personal bests and performance at the end of sessions. A breathing token collection incentive system was also developed. The more the user uses the device the more statistical features become available and their token balance will increase to allow them to spend tokens and unlock even more features.
There are three versions of the Spyras dashboard that have been developed: The home user with key overall breathing, activity, speed, distance and location stats. The clinician dashboard built and designed for doctors with patients that have respiratory conditions or patients in pre-operative respiratory treatment plans. Doctors can track treatment plan sessions and the progress of their patients during the plan. The final dashboard design is for businesses that have many employees wearing masks on a frequent basis and in environments where filter efficiency is of great importance. These businesses can see the filter usage and efficiency of the mask during use so that mask filters can be replaced at the correct moment and protect more workers.
As the lead product designer and design engineer at Spyras, I was also worked on branding and worked on the product video assets and website design.
I have designed, wire-framed and implemented ready for market the UX/ UI of the mobile applications. I also engineered and designed the physical patented smart device that pairs with the app. A visual overview of the device design can be seen below.
