This project was based on a fictional app I created to help me play with animations and transitions more. The app was geared towards people who love to travel and take photos. Similar to Instagram, it allowed users to connect with other fellow travelers and share photos of their journeys.
The Idea Phase
The idea for the app came from my participation in the Daily UI Challenge. For this challenge, I needed to create a user profile.
What started out as a user profile spiraled into a mini project that would allow me to play around with animation and transitions in Adobe XD. Before heading to the computer, I sketched out my ideas so that I can give myself a good direction to start in.
Putting the Ideas into Action
For me, I enjoy laying everything out on the screen to get a better idea of what I am trying to do. Below you can see all the screens that were created for the app.
I tried to keep it simple by including a login screen, user profile, social feed, messages, and settings. All of the basics that any social media network needs to survive.
The Prototype: See How it Works!
When I first started exploring prototypes, I never really experimented with transitions and animations. I was stuck on dissolve and did not realize all the awesome stuff I could include in my projects.
Though the transitions and animations are simple in this prototype, I am very proud of how far I have come with using these tools. I even added a video as an intro to the app. Check out the prototype below!
The Takeaway
Even the most simple transition and/or animation can set your project apart from others. This project was just the beginning and I will continue to keep exploring the world of transitions and animations!