Lumos

Overview

Around a year back, a good friend of mine, Vidya Madhavan, who was in Stanford at the time reached out to me saying, "Pranjal! I wish to do a project about memes. I think memes have a lot of potential waiting to be exploited and we should get to it before Facebook launches a meme app of their own!" Being somewhat a meme veteran myself, I said, "aha! it's about time that I can account for all the time I wasted/spent seeing memes as 'research.'" Vidya brought in some other engineering friends of her who were in Microsoft at the time and we were all set to go and conquer the world, one meme at a time.

Product

Mobile App (Android + iOS)

Duration

4 months

My Role

Product Designer

Team

1 Senior Product Designer (Me), 1 Junior Product Designer, 5 Software Developers, 1 Product Manager

Finding the Problem

User Interviews

Though we had a decent idea of which direction we wanted to go, we were far from understanding what our users would actually need. To kick off the research and find insights about the Meme-y behavior of users I used one of the oldest tools out of my toolbox. I talked to the users. I posted on different social media channels to find users belonging to our target group. Memers responded to me in their own unique way.

My post in search of interview participants
Response from a user

For the interview my aim was to understand the mindset of users while interacting with MEMEs in general. I identified my target group as social media users who use Memes and GIFs in conversations. While preparing my interview guide, I divided my questions into four different topics

  • about their current use of memes and outlook towards different social media platforms
  • about how and where they found, browsed, and used memes
  • about their sharing behavior
  • and finally about how they used memes in conversations

While interviewing them, I asked them to remember about their most recent experiences when and where they came across memes in the last week, and took my conversation ahead from there. From time to time I asked them to open their phone and show me the context in which a particular MEME was used. I believe asking users about real experiences rather than their thoughts gives more useful insights about what they actually need rather than what they think they need. I got a lot of interesting feedback from a lot of users.

“Memes are very contextual. I have a meme slack channel in office, a WhatsApp group with friends, another group with college friends, and I always share different Memes with different people.”

Dae Young Kim

User Experience Designer

“I get all my news from Memes. When I want news I check out memes, when I want jokes, I check out the news.”

Sanyam Arya

Software Developer & Meme Enthusiast

Key Insights

To kick off the research and find insights about the Meme-y behavior of users I used one of the oldest tools out of my toolbox. I talked to the users. My aim was to understand the mindset of users while interacting with MEMEs in general. So I identified my target group as social media users who use Memes and GIFs in conversations.

  1. Need to create memes quickly: All the users I interviewed were using different platforms to create new memes. Though some were using other meme editor apps, most were not able to create what they wanted through other apps. Some users even used tools like paint, Instagram to create tools. This made me realize the need for a better-unified meme creator tool.
  2. Finding new and trending memes: The source of most memes for users were either Reddit, or other Meme apps. But they were not able to share memes on these platforms as their friends and family members were not on those platforms.
  3. Specific memes for specific people: One of the biggest use cases of memes was the ability to share memes within one’s social network. Memes usually are very contextual so people like sharing them with particular users. Like office memes with coworkers, college memes with your college friends, etc. Because of this, it became clear that there was a need to have groups on the platform through which users can share memes.
  4. Smartly store/collect memes: Another interesting thing that came up was that during interviews when I asked users to show me a particular meme, they took a lot of time in finding it. It seems that people store most memes as screenshots or in random places without storing it. It gave me the idea to create a kind of meme collection for users, a sharable link that they can show to other people as their ”meme resume.”

Competitive analysis

Well, to be honest, there are a lot of meme apps already out there and a LOT of social media giants in play. To be sure that our app would be a success, we had to study all these products and figure out what exactly the users liked and disliked about each one of them. After some preliminary research about the different types of apps out there, I categorized them into 2 main categories and 2 subcategories. The main categories were social media apps and meme-based apps. The subcategories were major players and emerging revolutionary startups. Then I analyzed companies in each category and subcategory based on user needs that align with our own user needs.

Category 1: Social Media major players

Instagram: Users on Instagram share and consume memes, but they coexist with other content. Instagram stories and editors allow users to create new content, but users prefer creating memes in other apps. The major source of memes is meme pages, which users follow and share. Users sometimes tag other friends to share the context with them or add comments, but this activity is limited.

Category 2: Social Media emerging players

TikTok: A video-sharing app in which users create and share short videos. Creating new videos is very easy and one of the most important features. Users can follow other content creators, so it becomes easy to find topics of interest. It is focused on community building, so users also have friends and family on the app and can share content directly with them. There is no direct way to create a group, hence the content shared is public.

Category 3: Meme App major players

Reddit: Definitely the top source of memes online. Users post tons of content in all formats – text, images, video. There are subreddits that are focused on more specific topics. There is good community engagement and people often engage in follow up conversations on different topics through comments. However, users here are mostly anonymous so there is no sense of personal or social groups of people that you know. Content shared is specific to the broad subreddit or the community in which it is shared and is meant for a large crowd. People don’t usually engage in one on one or small personal chats here.

9Gag: Another big source of memes. Users post image and video-based content. There are categories in which content is sorted, but no groups. Users are anonymous and share content publicly. Users do not engage in personal or social conversations with their private groups but do engage in conversations over the content shared through comments.

Category 4: Meme App emerging players

Whale: This Facebook backed startup focuses on community-based meme sharing. Only users from specific colleges can create accounts and then would be automatically added to their college group. It has the ability to create and share memes. Since users share common interests, the memes are also highly contextual and help in community building. However, creating new subgroups or bringing other users from outside that community is not possible.

Thinking of Solutions

User Personas

Based on the interviews, we were able to create 2 personas to represent our target audience.

Persona - Meme consumer

Persona - Meme creator

WhiteBoarding

Now more educated after the research phase and armed with great insights, I invited our PM and a couple of senior developers to put our heads together and do some virtual whiteboarding (multidisciplinary team has the best ideas). Our aim was to brainstorm different ideas and then prioritize and decide what we wanted to go ahead with. We spent a series of sessions to come up with some really interesting ideas and then decided what we are going to start building.

[some snippets from our initial brainstorming discussions]

User Flow

The whiteboarding gave way to some amazing ideas. I picked them up started planning the next steps. My immediate next step was to design a user flow map of how the user would go about using this product.

Design! Design! Design!

Wireframes

After the completion of the ideation phase, it was time to put some of those ideas to paper. So I went ahead and created some low fidelity wireframes to get a better idea of how I visualized some of the screens. Below, I've added some of the initial screens.

The Lumos Design System

Like the designer friend of Uncle Ben once said, with great design too comes great responsibility. And with great responsibility comes the requirement of a great design system. Tada! The Lumos design system is based on the principles of Atomic design, with colors, types, shapes, and effects building up the first stage or the Atoms. The elements of the second stage use those atoms to build molecules which were components and states. All the molecules only comprised of atoms. The third stage was made of more complex components that were made up of atoms and molecules. Finally, the last stage comprised of pages, which were combinations of multiple molecules.

Like the designer friend of Uncle Ben once said, with great design too comes great responsibility. And with great responsibility comes the requirement of a great design system.

High Fidelity Design

The MEME Feed

The meme feed provides users with recommended memes via swipe navigation. This helps us to record user's tastes and improve the feed results. The two tabs of "For You" and "Discover" give users options to go through app suggestions or discover memes themselves.

https://static.wixstatic.com/media/af50a2_dd1726194c09444e865b7f4c4460ee46~mv2.gif

Create New Memes

The meme editor of Lumos allows you to make memes by editing a meme template or create one from a blank canvas. It has different tools like text, image, draw, layout to help you add/edit media. Each tool has its own functions using which the user can create any meme.

https://static.wixstatic.com/media/af50a2_5b057e78a6fd48f6b689c8a9b0a5bcf8~mv2.gif

Save & Collect MEMES

Lumos allows you to either directly save a meme to your phone or save it in a "Collection." One can choose to create new Collections or save memes into old ones. Users can share whole Collections with other users or display them on their profiles. This helps users show off all their best-curated memes.

https://static.wixstatic.com/media/af50a2_1ed12eb5ce914b14b9b641f59bc69085~mv2.gif

Testing the Waters

Prototype

Building a prototype was very important to better visualize the interactions of users. I created a prototype in Figma for all the features which was quite helpful in getting quick feedback from other members of the team as well as the end users. I showed the prototype to a few users in order to get their thoughts and opinions and got some really useful points from them.

Usability Testing

Since we were working in an agile way, our testing was also happening by testing out independent user stories. The first story that we worked on was the creation of memes. For this I asked some of my friends who were moonlighting as my test subjects to find the 3 most recent memes that they had received and then asked them to recreate those memes using our own app. 11 out of 12 times they were able to recreate the meme perfectly giving us a success rate of 92%.

For testing the meme feed, our main objective was to understand if the users like the swipe navigation and are able to understand how it affects their recommendations. For this, we did usability testing by asking guided questions as they navigated the app. This gave us a lot of useful insights like the need for a strong feedback mechanism to communicate how swiping affected recommendations.

We tested the profile feature next. One of the big points from initial research was that users want to make connections with other real users, and so we were building the profile feature as the Memer’s resume. While testing it out I asked the testers to have their friends create and send out 3-5 memes depicting them. The responses on top of being insightful, were also hilarious, because who doesn’t like memes about their coworkers.

Beta Testing & Next Steps

Finally, we launched the app for a small community of users to get their feedback on the complete thing. Checking their actions and preferences helped us improve the experience further. After going through multiple iterations we have raised the new user retention rate to 40%. We are looking forward to a bigger release of this app with our aim to make the world a more Meme-ier place.