Saving Products Project
At Edited we created a new feature called Boards where users can save multiple items within the app to a board so they can arrange and view them quickly later on and perform analysis and get insights. In the platform we already had a way of saving products, but we found from speaking to users, looking on Fullstory and at Mixpanel data that very few users were saving products as it was undiscoverable and the user experience was not intuitive. The problem we needed to solve was to make saving products more intuitive and discoverable, but we also needed a global way where users could save multiple different items such as charts, images, articles and products from different parts of the app which we didn’t have. In order to save products in the app users used to have to click on the “My Clipboard” tab in the top right to open a drawer then click products to add to the clipboard and then save them to a new board. We found this was not intuitive and users didn’t know what the clipboard was and there were a lot of other usability issues we needed to address like three clicks to save an item, and problems saving to multiple boards.
Saving Products Currently
MVP Approach
We felt we could make a small change to see if it had a big impact.
By adding a save button to the product, this would then open the clipboard and add the product to it, using the current UX we already have.
We would then test this to see if we had an increase in the number of users saving products, due to the save button being placed on the item you are directly saving.
This method would let us know if users wanted to save products and if there was a solid use case to develop the rest of the feature. Example below.
Now unfortunately we didn't have any A/B testing capability as this would have been a great candidate for an A/B test.
So what we did was tracked the metrics of saving products up to 6 months before and we noticed that the amount of saved product was pretty flat with no big spikes.
We released this new way of saving products and recorded the metrics for 2 weeks in Mixpanel to measure the success and you can see the results below.
Old Way
10th Jun - 20th June
Products saved - 131
Total users saving items - 8
Total boards created - 7
Total users creating boards - 5
New Way
24th Jun - 4th Jul
Products saved - 249
Total users saving items - 55
Total boards created - 31
Total users creating boards - 20
Overall Results
Products saved - +90% increase
Total Users saving items - +587% increase
Total Boards created - +342% increase
Total users creating boards - +300% increase
As you can see the results of the tests were really successful and made a huge impact on the user experience as we had a massive 587% increase of users saving items in two weeks.
We learned that users wanted to save products but the user interface was preventing them from achieving this. We also learned as a general UX principle that buttons or actions should be placed near the item they relate to otherwise the user will get confused, give up or become frustrated.
Next steps
Now based on these results we then continued to design and research a way to save not only products, but charts, images and articles from different sections of the app into a board.
After researching and speaking to users, we soon realised that users expected and wanted the following when saving items:
- Save button to be easily discoverable
- Save a product with few clicks
- To be able to save products to existing boards
- Ability to create a new board and save to it
Saving Products: Proposed Version
When designing a way to save multiple different items from around the app, we discovered multiple flows hat needed to be catered for:
- The first time a user saves an item
- One click save
- Saving to a new board
Figma prototype
https://www.figma.com/proto/CbIaTa4wsj17BQV4gFHKHEwm/Saving-Products-V2?node-id=2%3A217&viewport=252%2C41%2C0.1627371609210968&scaling=min-zoom
Figma Design file
This contains all master components and user flows.
https://www.figma.com/file/CbIaTa4wsj17BQV4gFHKHEwm/Saving-Products-V2?node-id=34%3A218
User Testing
We tested this prototype with staff internally to make sure that they could save a product for all three scenarios with ease. We documented our findings when getting them to use the prototype and made a few iterations based on common problems and feedback.
One issue was that we originally had a plus icon appear on hover to save a product and people were not sure what it meant on its own as it caused some confusion as to what its purpose was. So we decided to add the word ‘save’ instead which, when testing again, we saw everyone understood what it meant immediately when they were using the prototype. See image below.
After speaking to people internally in the business, we then spoke to some real users and asked them to use the prototype over a zoom call while watched and asked questions. The customers we spoke to were users who had previously saved products within the app using the current method. We got the users email addresses from mixpanel and asked the Edited account managers to email them to ask if they would be open to testing an improvement to the way you save items within the app.
When showing the users the prototype we quickly realised that everyone said it was so much easier to use and much more intuitive.
One user said the problem with the current way of saving product is “I have to retrain myself how to do it each time I log in to the app” which to us really hit home how difficult the current implementation was.
Development approach
After all the research and user testing, we felt that we were in a good place to start the development of the feature, but we needed to break it down so we could release in small deployments.
We decided that we would release the new way of saving items for products first, this was because if we released this new way of saving items for charts, images or articles then this would be different to the way users save products, creating an inconsistent and confusing user experience which we wanted to avoid.
We decided to roll it out by prioritising which areas we thought would have the biggest impact.
Project Tags
Companies
EDITED
- Technology