Objective
Make a good yoga fitness app to help people live a healthy life. It must be very easy for users to start and control exercise routines and programs, download new programs, make exercise schedule and get notified accordingly. The app must have a brief yoga-pedia describing every asana or technique shown in the app.
Challenge
The most challenging in this project was the fact that in this case I was both the client and the contractor, as this project I can proudly call my own. My duties were — study market and competitors, make concepts, sketches, wireframes, UX, UI, branding and advertising materials, also I had two hired iOs developers to manage.
The other thing that influenced the project a lot was project status. As a private initiative, the project had no budget at the beginning and was mostly made in my free time, that stretched the development a lot. At some point the app has got pre-seed investment and became a full time job.
Solution
I started with some research and a lot of sketches. It was just the very end of skeuomorphic era so the app got it's look but was suspended because of a great lack of time. Some time later it was clear that the app must have new nice and clean contemporary UI to keep with the trend. The app got new vibrant color scheme resembling fruit colors to look fresh and happy, the interface got rid of useless functions, providing a fluid and convenient user-story in the new wireframe. I had to make videos for some UX concepts to show to developers and discuss the way to code it and get rough estimates. That radically shortened the time needed for coders to get into the problem. The UI was made pretty fast and, while the developers started their work and were converting PSDs into the real app, I had to take, retouch, resize and compress more that 600 photos which make 13 exercise sequences available in the app. To add the sequences to the app easily, we had to develop a stand-alone web-editor that allows uploading photos, arranging them in sequences, adding audio narration and exporting the optimized footage.
It took quite a time to make a landing page, at of the promotional materials, iTunes screens, FB ads, banners, mail templates, etc, that was the final phase before the successful release of v1.0 in April 2016.
The wireframes were made in Adobe Illustrator to use the files for actual UI later.
Oh, I miss skeuomorphic design. But what can you do, in sake of simplicity and fast development we had to go with flat design.
Several days of experiments and discussions with the developers cutting excess functions to fit the deadlines, and we have alpha-design to enhance and develop.
Flat doesn't mean dead, lets try to use simple elements and animations to make it look and feel pro-active and responsive but not too hard to implement.
It took sevral days to get branding done starting whith te icon. I was hesitating between two ideas — A hand in mudra or lotus position. Lotus won because, unlike hands, it can be simplified radically but still be recognizable.
Discussing the animations in the app. This video came extremely handy for developers letting them check for details in slow motion and make the actual in-app animations look and feel axactly the same.
The full set of icons used in the app and on the landing page
it took several weeks to finish the UI, counting about 20 iterations and noticable changes.
To make sure we have a pixel perfect app the developoers got all the screens for all the devices.
600+ photos easily organized into 13 yoga programs. Asana editor — irreplaceable tool considering future updartes.
