College + MTV Creative Jam was a design hackathon hosted by Adobe in Nov 2020. Participants were given 70 hours to build a mobile app prototype Adobe XD. It was my first time learning how to use Adobe XD.
My teammate Tosha Bapat and I were awarded as one of the 10 honorable mentions among 340 participating teams of college students from the US, Canada, and Australia.
Nov 11-14, 2020
User Journey Mapping,
The Challenge Brief
Music, pop culture, and historical events have served as landmarks to our life’s moments and childhood memories. Songs, movies and TV, and popular trends have strong connections to cultural milestones and sharing them helps us tell the stories related to interests and meaningful causes in our lives. Draw on that passion to empower individuals to do good and bring light to their favorite causes, from their mobile phone.
The challenge is to design a mobile app that empowers an individual to encourage advocacy among their network by sharing. Tie the sharing to a cultural event or historic movement important to them and give them tools encouraging donations, volunteerism, and action.
As we were only given 70 hours to work on the project, we wanted to make sure we can finish the app prototype comprehensively. We allocated time for conceptualization, defining UI elements and colors, building art boards, testing, and final refinement.
We understood it is important to empathize with our target users, so we identified three different personas, pinpointed their pains and gains, lifestyle, and core values.
User Journey Mapping + Defining Features
With the personas in mind, we started drafting the user journeys and defined what features are necessary for the MVP. We have set aside a list of features that we would add if we could finish building the prototype earlier than the set deadline.
It was my first time using Adobe XD. Before the hackathon started, Adobe hosted a short live tutorial session and taught participants the basics. The software is very user-friendly and intuitive. Adobe also provides a lot of free tutorials and UI kits online. It was easy for me to pick up this skill.
We named this app “EcoPop.” It is an app for environmentalists to share the causes they care about and encourage their network to take action. You can browse the interactive prototype here.
Interface for “Explore”
Users are able to filter interests in the arts and issues in environmentalism, then find movements created by the community to take actions upon, including donations, texting or calling government officials or policymakers, and creating arts. Users can also create their own movements.
Interface for “On This Day”
The daily prompt “On This Day – Year” is to trigger interests through the use of pop culture and trends. Users will be able to learn about the rationale and historical event behind an art piece or music. It empowers users to share what they find fascinating at any point through social media or other messaging apps. Users are able to track their impacts and all the movements they are/were involved in through their profile.
Interface for “Profile”
Users are able to track their impacts and all the movements they are/were involved in through their profile.
Completion & Award
We were so thrilled to finish the app on time, even it was just the MVP version. We ended up being awarded as one of the 10 honorable mentions among 340 participation teams from the US, Canada, and Australia!
1. Understanding the Brief or Root Problem is Crucial
During our conceptualization phase, we kept reading and debunking the challenge brief to ensure we are understanding the ask and requirements correctly. I’m glad that we took the time to think through and discuss the core/essence of the app, rather than jumping right in to build the prototype.
2. User Journeys Determine App Effectiveness
After reviewing other participants’ prototypes and looking back at our creative process, it’s obvious that curating a logical and thorough user journey across the app is the key to success. It doesn’t only make the user experience smoother but also forces you to consider what are the key features and functions of your app, thus guaranteeing the app’s effectiveness. The white-boarding process was definitely worth it.
3. Make Good Use of Existing UI Kits
I was amazed that there are so many existing UI kits, elements, and plug-ins available for free download. They honestly made any prototype way more consistent. It’s also extremely time-saving and extremely accessible for people who don’t have a solid design background.