An Exercise Redesigning the Langify App for Shopify (Part 1)
Part one of my three week design sprint
As an exercise in personal and professional development, I am redesigning the Langify app using UX research methods including interviewing, affinity mapping, and usability testing. This article documents week one in this three week design sprint.
What is Langify?
Langify is a Shopify app that allows a merchant to translate their Shopify store into multiple languages. With a multilingual web store, the merchant can expand their customer base by tapping into new markets that speak a different language than their own.
During my time as Shopify Web Manager at Baked2GO Advanced Bakery in Montreal, Quebec, I was responsible for using Langify to make our web store fluently bilingual in French and English. But after 8 months of experience using Langify, I realized that there were some glaring UX issues with the product, its usability, and its information architecture. As a designer and UX researcher myself, I set out to learn if other users felt the same way and what could be done to improve Langify.
Why am I doing this project?
I’m constantly on the lookout for new opportunities to improve my design skills. For the past few months I’ve been closely following the Shopify UX page and continue to be inspired by their entrepreneurial approach to design, research, and business strategy. I would love to join the Shopify UX or Product teams one day and I decided to initiate this project to further develop my design skills and boost my experience as a researcher.
The idea for this project came from imagining I was in the place of a UX Researcher at Shopify and asking myself, “What type of research would I do with merchants who use the Shopify platform to run their businesses?”. By redesigning the Langify product and engaging in UX methods that a Shopify design team uses, I’ll be able to hit the ground running once I (hopefully) have the fortune of joining Shopify.
More specifically, in this Langify project my focus is on improving my information architecture (IA) skills as well as developing my grit, hustle, and make-sh*t-happen attitude.
Speaking with Langify’s developer
To start, I wanted to know what common issues existed already with Langify. But reading the app FAQs and support documentation could only get me so far. At the end of April (the beginning of this design sprint), I reached out to Johannes Hodde, the creator, developer, support team, and magician behind Langify. He was generous enough to let me conduct an interview with him to understand his perspective as Langify’s founder. Since Johannes deals with all of Langify’s support requests (including mine when I translated at Baked2GO), I knew he would be able to tell me a lot about common issues that his users requested help with.
Speaking to Johannes caught me up to speed and set the foundation for my research process. He explained to me the story behind why he made Langify, how the app design evolved over time, what were the top support requests he received, and what were the metrics he tracked closely to measure his success with Langify.
With this sturdy base of knowledge acquired, my next step was to go out and gather user data from Shopify merchants in the field.
Gathering survey data through Reddit
My first idea was to collect qualitative user data via a survey. I built my survey following the Survey Lean Canvas method, a tool I picked up while running research efforts at my e-commerce startup Venndor.
- The first step of creating the survey was establishing what I wanted to learn. I narrowed my research goals down to three things: Langify’s features, information architecture (IA), and usability.
- Next I had to figure out how to reach research subjects. On Reddit, the subreddits r/ecommerce and r/shopify are both very active, and a quick search term of “Langify” generated several results in the two subreddits over the past few months. So I chose Reddit as my Medium.
- Next, I brainstormed as many research questions I could think of and grouped these questions based on how they related to the three main learnings of features, IA, and usability.
- Within each group, I reduced, refined, and rewrote my 30 questions until I was satisfied with 7 of them. This was done in order to get the most out of each question.
- Finally, I reordered the questions with the goal of “telling a story” in my survey. Keeping this notion in mind helped me make the survey follow a logical and flowing progression.
I posed my survey on both subreddits and after a few days, the results were… disappointing. My posts weren’t getting much traction and I only managed to gather 3 responses in 5 days. I knew I had to take my strategy further and start actively reaching out to merchants directly.
Finding merchants to interview via Google Maps
The most time intensive and difficult part of the data-gathering process was finding merchants that used Langify in the first place. Since I didn’t have access to the contact information list of Langify’s user base, I had to be a bit more creative and resourceful with my strategy of acquiring research subjects. Here’s what I did:
- I opened Google Maps, focused on Montreal, and zoomed in to the maximum amount. I searched for streets and neighbourhoods that I knew to be particularly dense in independent boutiques and businesses, which were likely to use a platform like Shopify to host their online store (if they had one). Below is a photo of the trendy Avenue Laurier in the Plateau/Mile-End neighbourhoods of Montreal.
2. If a shop had an online store, I clicked the link checked if their website: 1) was hosted through Shopify, and 2) had a bilingual “English/French” button in the top menu. Generally it’s pretty easy to tell if a store uses Shopify, as a Shopify store’s URL structure will generally be: “www.example.com/collections/collectionName/products/productName”.
3. If there was a bilingual option in the menu, I right-clicked the page, went to “View Source”, and examined the HTML code to see what translation script their site was using. Then I searched the source code (using Cmd-F) for “langify” to verify the Langify script was present and BOOM! — I added the shop to my contact list.
4. I went back to step 1 and repeated the process over and over.
All in all, I gathered a list of just over 20 Langify-using merchants and contacted each one of them. Of the ~20 I reached out to, 10 agreed to speak with me. Of those 10, 4 answered my questions over email and 6 let me interview them over the phone (after some persistence on my end).
For the interviews, I chose to build a structured script in order to keep the interview experience running smoothly and efficiently. The script mostly borrowed questions from the survey I had built previously, with a few tweaks made for conversational clarity.
Some of the merchants I interviewed include:
- Les Coconuts, the makers of luxury, all natural skin care products.
- Jet-Setter, a one-stop travel gear destination for luggage, backpacks, packing aides, bags, and travel accessories.
- Amsellem, a multi-generational family business that makes high quality charcuterie, cured meats, and beef sausages.
Now that the data collection stage is complete, my course of action for next week is:
- Perform affinity mapping with my research data to group common problems, issues, pain points, and ideas
- Run card sorting with more research participants to improve Langify’s information architecture
- Develop a low fidelity mockup that I can use to engage in usability testing with merchants and research volunteers