Introducing ‘Menu Utama’ on Tokopedia
Shop and Navigate Easily Through One-Click of a Button!
Have you ever searched for multiple products on Tokopedia and suddenly need to get back to the homepage, but you need to click the ‘back’ button multiple times? Or have you ever been in the middle of browsing for a new TV, but then remember you need to pay your bills? Once again you need to click the back button several times, get lost into some funnels, to reach your new destination?
Often, disturbances or inconsistencies in user’s navigation experience on mobile apps may create friction in the user’s browsing experience. Several frictions like the need to click the ‘back’ button multiple times to start a new browsing journey, or that the cart icon being placed differently on different pages — all of these challenges increase users’ decision-making time, and affect conversion.
Therefore, to stay true to one of Tokopedia’s 3 DNAs, Focus on Consumers, we are very excited to introduce a new feature that offers users’ a more consistent and easy-to-navigate experience on our platform!
Menu Utama: One Feature For Multiple Pain Points
We came up with one feature to solve all the pain points in one go, and we call it: Menu Utama.
Menu Utama is a hub on each main page of users browsing funnel across the app. Users can find the entry point to Menu Utama from hamburger menu on Homepage’ Top Navigation Bar. The feature allows users to jump between pages, as well as monitor important updates, such as transaction status or complaint status all within one click.
Among the many exciting things the feature can do, users can find the following:
Anatomy of Menu Utama
- Wallet
Menu Utama shows users’ membership badge and balance (OVO balance or Tokopedia Points) on the topmost section to mirror offline users’ behaviour, where they bring their wallet each time they go shopping.
Beneath the user’s personal information, users can utilize the Back to Home button to go back to their homepage anytime with one click.
2. User’s Activity
As users, we want each order to arrive as fast as possible and constantly check for that ‘shipped’ status.
Previously, users needed to access their order status from the Notification button or Account Page, and both of the button’s entry points are only available on the homepage. Menu Utama shows each of your active order status in one click, and it also provides an entry point to check your order history.
The pain points are similar to the other user’s activity such as wishlist, favorite shop, and review, once user browses the outside homepage, they will need to go back to the homepage to access it. Menu Utama brings these features closer, which enables users to use it more optimally.
3. Categories
Beneath the User’s Activity list, Menu Utama shows various categories, such as physical goods, digital goods, and fintech, which will allow them to browse more comfortably and stay updated on Tokopedia’s latest products.
4. Customer Service
Previously, Tokopedia’s customer service could only be accessed from the Account Page, and each update is sent directly to users’ notification feature. Meanwhile, these two entry points were only available if users accessed it from their homepage.
In the Menu Utama feature, customer service support namely Tokopedia Care and Complaints are featured. So users can check updates regarding their complaints anytime from any page.
Consistent Navigation Across App
More than compiling user’s favorite features under one menu, Tokopedia also improves its overall app navigation experiences by unifying header icons in almost all of Tokopedia browsing funnels.
The group of icons is broken down based on a hierarchy of urgency for each page. For example, the Menu Utama icon will be present on every page’s header as it’s more useful for users compared to the share icon since only certain pages in the app are able to be shared.
With all of these improvements, users will be able to understand the header function more easily and be able to more quickly navigate across the app.
Scale Up Tech Structure
From a technical standpoint, unifying the header for many pages also brings benefits. Now, the header is owned and centralized by a sole team, product-wise and code-wise.
Product-wise, one team acts as the main owner and gatekeeper in maintaining the uniformity and functionality of the header in those pages. No more icon styling or positioning differences.
While code-wise means the code ownership also falls under one team, then re-implemented into various pages. Any improvements (new features or bug fixes) on the header or Menu Utama can be done once and will be mirrored automatically on all corresponding pages, therefore significantly reduce the manhour needed to ship navigation-related features in the future.
After getting to know the anatomy and benefits of the new Menu Utama feature, we hope our users will find their shopping experience to be easier and enjoyable. We are very thankful for our 3 DNAs, especially Focus on Consumers, as it reminded us to always improve, innovate, and create in the best interest of our users.
Honorable mention for the amazing team working on this project:
- Design leader: Monika Halim, Aldrin Ferdian
- Product Leader: Harvey Tjiupek, Gabriella Amanda Kawilarang
- UX Designers: Yoga Tri Nugroho, Ignatius Gregory
- UI Designers: Santo Unsri, Theresia Tarisa
- Android Dev: Devara Fikry Akmal, Yoas Febrianus, Zulfikri Rahman,
- iOS Dev: Digital Khrisna, Ferlix Yanto Wang, Gavrila
- Web Developer: Ryan Wijalaksana, Miqdad Fawwaz, Muhammad Sibra, Giovanni, Salman Al Fariz
- Backend Dev: Angga Wiratama, Jonathan Ryadi, christian ade yanuar
- QA Engineers: fauzanofami luthfi
