PRODUCT DESIGNER & TINKERER
SKANDI APP DESIGN
FLEXIBLE APPROACH TO E-COMMERCE
Note: Please view on the desktop for an ideal experience.
INTRODUCTION
The next chapter of e-commerce.
Is being written. Right now.
Apptile is a design & technology startup dedicated to empowering e-commerce entrepreneurs to achieve their goals. With our cutting-edge no-code mobile app builder for e-commerce, we strive to help millions of entrepreneurs build strong brands and expand their businesses.
We are embarking on an unparalleled journey to completely transform the mobile shopping experience, by providing businesses of all sizes with the ultimate ability to effortlessly and proficiently create mobile apps, without the requirement of code, large teams, and huge funds, thereby assisting brands to flourish and triumph in the constantly changing digital sphere.
Disclaimer: To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. All information in this case study is my own and does not necessarily reflect the views of my employer.
ESTIMATED TIMELINE
We started in October, 22 with an aggressive target of launching our app in April, 2023
TARGET AUDIENCE
Product, Marketing and Sales teams of Direct to consumer brands (DTC).
KEY GOAL
Create an easy to use and fully customizable no-code mobile app builder for all kind of e-commerce businesses.
KICK OFF
THE PROBLEM
Create an industry-leading mobile app-building experience for businesses of all sizes without the need for coding or design experience.
Current mobile app builders face various limitations, including restricted customizations, design constraints, service-based approach, time-consuming processes, performance issues, slow updates, and poor user experience. These drawbacks hamper developers' ability to create unique, visually appealing apps tailored to user preferences. Dependence on external providers limits control over crucial functionalities, while slow updates hinder keeping up with evolving demands. Moreover, building apps using these builders can be time-consuming, and performance problems can arise. Inadequate user experience further detracts from app engagement. To overcome these limitations, improved mobile app builders must offer greater customization, flexibility, faster updates, and enhanced user experience.
WHY DOES IT MATTER
Because almost all of the traffic comes from mobile devices—yet the “mobile-friendly” website doesn't convert or retain customers as it should. Enter the Shopify mobile app builder.
Thanks to the internet, shopping has drastically evolved over the last 10 years and today’s shoppers have come to expect a remarkable shopping experience, no matter where they shop. However, not all companies have the time or financial means to engage an agency or hire a developer to build a mobile app.
TRAFFIC
VOLUME
91%
of all traffic comes from mobile devices
FUNNEL CONVERSION
2.3x
higher conversion rate vs mobile web
RETURN ON INVESTMENT
43x
average Return on Investment
MY ROLE
I led the design of the app-building experience between October 2022 and March 2023.
I collaborated with one other designer on the Dashboard, Integrations page, and Notifications.
In addition, I worked alongside 2 Product Managers, Content Strategist, and all the 3 co-founders (CPO+CTO+CEO). Some of the branding and visual design was outsourced to an agency.
The app launched globally in April, 2023.
How mobile apps drive e-commerce sale
Mobile apps drive more revenue for your store by retaining more customers with targeted push notifications, seamless live selling, and a terrific buyer experience among other features.
KICK OFF
BREAKING DOWN THE PROCESS
At the outset, we So far, owing to the complexity and cost of creating and maintaining mobile apps, this has been a prerogative of major brands only, Apptile wants to democratize world-class mobile apps, empowering businesses of all sizes to create personalized mobile-first experiences for their customers.
Apptile's no-code platform should enable the easy and quick creation of stunning mobile apps that integrate seamlessly with third-party services, empowering DTC merchants to build strong brands and drive meaningful growth by cultivating customer loyalty and increasing their lifetime value.
THE DISCOVERY
THE COMPETITIVE LANDSCAPE
With the help of our product managers, we carried out extensive research on our competitor's solution. I carried out a SWOT analysis to identify the strengths, weaknesses, opportunities, and threats of each platform. Through our User Research, we identified the dissatisfied customers of our competitors and worked closely with them to create a perfect experience. eg: Harney, Kimirica, Pilgrim, etc.
THESE WERE SOME MAJOR LEARNINGS OR POINTS I WANTED TO CALL OUT
Restricted customizations
The existing builders often impose limitations on customizations, restricting the ability to create unique and tailored experiences.
Design constraints
Design limitations within these builders can result in apps that lack visual appeal and fail to meet the aesthetic standards expected by users.
Service-based approach
The service-based approach of many app builders can lead to dependence on external providers, potentially resulting in limited control over critical app functionalities
Time-consuming processes
Another drawback is that building apps using these platforms can be a time-consuming process, often requiring extensive configuration and setup with lots of delays due to the service model.
Poor user experience
Last but not the least, the poor user experience offered by some of these builders can result in subpar apps that fail to engage and retain users effectively.
REFRAMING THE PROBLEM
A SERVICE FIRST APPROACH CAUSES PLATFORMS TO STINK
..How might we create a mobile app builder that provides extensive customizations, design flexibility, a self-service approach, efficient processes, optimal performance, timely updates, and exceptional user experience?
Most engagements require additional coordination efforts.
Digging into the data revealed some significant insights into the app design experience. Almost all engagements involved some extra coordination effort such as a video call to update the app design and additional efforts such as setting up the app store accounts or adding an integration.
Thus, a service-based approach can hinder the self-serve nature of a no-code mobile app builder by reducing user autonomy, customization options, and the ability to efficiently iterate and modify the app during the development process.
Design Flexibility
The mobile app builder platform differentiates from its competitors with its offering of a wide customisation range. User's can create a unique app design that matches their brand guidelines.
DESIGN STRATEGY
In the ever-evolving landscape of mobile app development, the need for a streamlined and user-friendly approach has never been more critical. Enter the tile-based design strategy, a groundbreaking concept that is transforming the way mobile apps are built.
The design strategy for our mobile app builder is to adopt a tile-based approach. By utilizing preconfigured, Lego-like blocks that can be easily dragged and dropped, developers can create mobile apps with unparalleled ease and flexibility. Each tile represents a specific functionality or feature, allowing users to assemble their apps in a modular and intuitive manner. This approach empowers users to customize their apps by selecting and arranging tiles that best suit their needs, without requiring complex coding or extensive design skills. The tile-based approach promotes a self-serve environment, enabling users to iterate, experiment, and rapidly prototype their apps. With this strategy, the app builder can offer extensive customizations, design flexibility, efficient workflows, optimal performance, and timely updates, while ensuring a superior user experience. By embracing the simplicity and versatility of tile-based building, our mobile app builder can revolutionize the development process and empower users to create exceptional mobile applications.
INTRODUCING TILES
Enter the Tiles, a groundbreaking concept that is transforming the way mobile apps are built. Lego-like pre-built building blocks of mobile apps.
With Tiles, anyone can harness the power of preconfigured, Lego-like blocks, which can be effortlessly dragged and dropped to create stunning mobile apps.This innovative approach not only simplifies the design and development process but also offers unparalleled customization options, design flexibility, and a self-serve environment. By embracing the tile-based design strategy, users can unlock their creativity, expedite prototyping, and deliver exceptional user experiences.
THE EXECUTION
THE MAGIC OF TEMPLATES: CREATING APPS MADE EASY
Imagine being able to create stunning mobile apps in a matter of moments. That's where templates come in. Templates are like ready-made app designs that have already been styled and set up using tiles. They contain everything you need to make an app, like screens and layouts. With a wide variety of templates to choose from, you can pick the one that matches your app's look and features. It's as simple as selecting a template and voila! Your app is ready to go. Templates also give you the freedom to customize your app further to make it truly yours. They serve as inspiration, helping you create apps that look amazing without all the hassle.
Fig: One of the many themes in the theme library
LIMITLESS CUSTOMIZATIONS
Apptile's mobile app builder offers users limitless customizations, providing them with the power to create beautiful and functional apps effortlessly and without any worry. The preconfigured building blocks, i.e., Tiles can be easily rearranged, modified, and combined to suit the user's unique vision and requirements. With an extensive library of tiles to choose from, users can select the specific functionalities, features, and design elements they need, such as buttons, banners, carousels, and more. This flexibility allows users to experiment with different layouts, color schemes, and interactions, enabling them to create visually stunning and engaging apps that align perfectly with their brand or personal style.
Fig: Design customizations in the mobile app builder
HOW WE GOT THERE
PERFECTING THE APP DESIGN EXPERIENCE
Three primary questions informed my design strategy:
-
How do you design for everyone, everywhere?
-
What contexts need to be considered?
-
What’s the perfect experience for app design?
Early on, it was important to understand the different factors that may influence the Merchant and the End-user experience. I mapped all the possible concepts and translated this into the spectrums and situations framework.
Fig: Spectrums and situations framework
Fig: Initial explorations for the mobile app flow
Fig: Notification flow in the mobile app builder
“Beautifully designed mobile apps at a fraction of the price”
WORKING BACKWARDS FROM PERFECT
By working backward, we were able to arrive at an optimal solution for mobile app creation. Instead of starting with a traditional approach and gradually adding features, our team began by envisioning the desired end result—an intuitive, user-friendly app builder. This reverse engineering approach allowed us to identify the pain points and limitations of existing solutions. By understanding these shortcomings, the team was able to focus on designing a system that addressed these issues head-on. All this was possible only by working closely with our users and getting feedback at every step of the process.
In summary, by working backward, our team gained valuable insights into the existing limitations of mobile app builders. This approach enabled us to reimagine the entire design and development process, leading to the adoption of a tile-based design strategy that offers unparalleled customization, flexibility, and ease of use.
FLEXIBLE FLOW-INFORMATION ARCHITECTURE
Existing platforms often struggle to provide a user experience that is intuitive, adaptable, and efficient. Users encounter difficulties in navigating through the app builder, locating desired components, and customizing their workflows. This rigid structure limits creativity, hampers productivity, and leads to frustration. Moreover, collaboration among team members becomes cumbersome, hindering effective communication and coordination. To address these issues we designed a flexible information architecture that allowed our users to customize their workflows based on their specific needs and preferences. They can easily access and manage their projects, switch between different app screens or sections, and adjust settings without any hassle. The flexibility in organizing and presenting information ensures that users have a smooth and seamless experience, reducing frustration and enhancing productivity.
Fig: App builder task flow diagram
Fig: Early wireframes of the App builder
Fig: App builder MVP(Left) vs. New UI(Right)
THE LAUNCH
THE MOST RADICAL DESIGN UPDATES IN THE MARKET
Three primary questions informed my design strategy:
-
How do you design for everyone, everywhere?
-
What contexts need to be considered?
-
What’s the perfect experience for app design?
Early on, it was important to understand the different factors that may influence the Merchant and the End-user experience. I mapped all the possible concepts and translated this into the spectrums and situations framework.
Fig: Mobile app builder walk around
THE IMPACT
POSITIVE RESULTS AND MUCH MORE TO DO
The design of the mobile app building platform had a positive very impact on the user experience, at the time of writing (1 month since launch). All the new users are able to complete the onboarding steps and use the mobile builder to build their app without any aid. This shows an early sign of success. However, some existing users continue to contact our CS team to ask for changes. I believe this to be a behavior change that will reveal over a longer period of time.
For confidentiality reasons, I have omitted the actual values for these metrics.
METRICS:
-
The requested changes on mobile apps before and after the platform launch decreased by 300%
-
Mobile app launch time increased by 84%
-
The conversion rate for app launches increased 3X
-
The repeat purchase rate shows a steady growth of 55%
Fin. That's all for now, Thankyou!