App Development Portfolio
Fall 2022
For this project, I decided to dive and experiment with XCode. It was my first time using Xcode however, I quickly began getting the hang of it and absolutely loved it. My favorite aspect of Xcode was having the design right next to the code. It felt like such an interactive and convenient feature.
Without a doubt, I plan to continue experimenting with Xcode after this course. I believe there is still a lot to learn and it is also such a great way to get my creative ideas out there.
Below are some of my favorite projects:
LyfeStyle Application
An app that helps you keep track of your healthy lifestyle
Fall 2022
Project Overview: When creating LyfeStyle, my goal was to create an application that was simple, minimalistic, and informative. I wanted to create an app that I would personally download if it was on the App Store. To create LyfeStyle, I used Xcode and got inspiration from two apps — Fitness App and MyFitnessPal.
Fitness App (inspo #1):
MyFitnessPal (inspo #2):
The Challenge: As I was planning LyfeStyle, I was thinking of the multiple apps I use on an everyday basis. My goal was to create an application in which I could use multiple features from various apps, in one! Switching from one application to the other gets irritating and confusing at times. Also, being a consumer and paying for multiple premiums on multiple applications is not ideal. This could all be easily avoidable by joining features into one app — LyfeStyle!
The Solution: To solve this challenge, I analyzed the two apps I mentioned above (Fitness App and MyFitnessPal) to see how I could combine the two. I began writing down what both of these apps had differently and similarly. I then used this graph to lead me in the direction of creating each of the icon’s purpose on LyfeStyle.
differences/similarities between Fitness App and MyFitnessPal:
For the actual layout and design of the application, I took out the old pencil and paper. I began doodling what I imagined my application to look like. Personally, having a visual drawing helps me tremendously when designing. In a way, I see this similarly to creating prototypes and wireframes — except they’re in doodle form! Also, it’s always so breathtaking to see your pencil and paper design become a reality on the big screen!
Doodle for main, login, and sign-up page:
Doodle for dashboard and meals page:
Another point I want to mention is the color scheme I chose for LyfeStyle. As you can see, I decided to go with shades of green along with black, white, and beige. The reason I chose green is that the psychology behind green is typically said to be calming, have new beginnings, and be related to health. I do not typically see applications that are related to healthy lifestyles with the color green — usually, I see them with the color blue. I wanted to create something different with a meaning behind it!
LyfeStyle App green shades:
To navigate from one page to another, I decided to create a navigation bar with system images (shown below.) I knew I wanted to create something like this from the very beginning. The reason being is that I wanted a simple and clean feel to the application.
The navigation bar explained (left to right):
Star — goal setting
Heart list — To-do list
House — Dashboard
Fork and Knife — Meals
Human — Profile
The navigation bar on LyfeStyle:
Planning of the navigation bar prior to building on Xcode:
I also added a dashboard page in which users would share updates and photos/videos to share with followers. In this view, I added a heart animation. We spent a great deal of time learning how to create and incorporate animations into our projects — so this was a great feature! The heart animation is simply a black heart, however, when clicked, it turns red.
Heart animation (black to red):
Moving onto two other views on the LyfeStyle App, the to-do list, and goal-setting pages. To create these pages I used Canva. My main goal was to create something aesthetically pleasing and simple. I chose colors that went along with my application and illustrated the “zen” feeling. On a full-functioning app, I would like these pages to be interactive with the user — meaning they could add and remove goals and to-dos.
Results: Overall, this project was definitely fun! This project was mentally challenging in multiple ways. It challenged me to go out of my comfort zone and attempt new things on Xcode. For example, I knew I wanted a certain layout so I played with the software until I got things lined up as I wanted. Doing so allowed me to learn how exactly to create certain layouts in a more timely manner for next time.
I am very happy with my end result. Looking back at my drawings from when I was planning my application to actually having it fully designed on Xcode is such an accomplishing feeling.
I hope you enjoyed reading my process in building LyfeStyle as much as I loved building it!
