MY FITNESS PAL
App design  data visualization   animation

I'm no stranger to packing on a few extra pounds each winter. In the frigid midwestern landscape, it's almost necessary to have a little extra insulation. But each spring as the weather thaws and the shorts come out, I always find myself picking up a calorie-tracking app to fit back into my summer gear. 

My favorite is My Fitness Pal, mostly because it's free. However with a free product comes a lot of downsides. Ugly UI, rampant ads, and sterile, unfriendly data visualization make the app fall short of it's affable name. With this app-redesign I set out to re-organize and fluff up the data that helps me get back on track to reaching my health goals. This project turns My Fitness Pal into My Fitness BFF.  
HOMEPAGE
This is the first page you see when you open the remodeled app. A visual timeline of your progress sits above a succinct look at your daily calorie intake, followed by a breakdown of your weekly calorie and macro goals. It serves as a digestible snapshot of your general progress without getting too complex for a quick look. 
DAILY NUTRITION LOG
This page takes a deeper look at your day-to-day progress. The daily calorie summary on the homepage is expanded to be more detailed and display individual meals and food items. Users can log foods, see their remaining calorie balance, and check on their macro goals. 
TRANSITION ANIMATION
Any app needs slick page transitions. This is a conceptualization of what that transition could look like for the user. 
Back to Top