In 2019, when businesses move at a breakneck speed, even with huge IT support, building or making changes in an enterprise-app takes several months.

I was a part of an ambitious project which aimed at bringing this development time down from months to just minutes.

Quick Note: Appify was previously known as Turbo Systems.

Journey of transformation

When we started the project, stakeholders were reluctant to have any kind of UX process, but as of today, Appify hosts an in-house design team.

Platform also received $8M Series-A funding.

This is a journey of how our work transformed Appify from no-UX organization to a UX-driven company...

Hero image for Turbo

My Role

I led the UX of Appify platform for a duration of 10 months. I collaborated with 2 project managers, engineering team, 2 designers, and executive leadership to deliver hi-fi mockups, wireframes, flows & prototypes and visual designs.

Image: Table list of features
My background in software development helped me understand end-to-end architechture and deliver designs with ready-to-go market attributes.

The platform was launched globally on January 5th 2019.

Image: Working with the team
How it started

Thrown into disarray

The project started on a haphazard note. Things were not streamlined and we faced multiple logistical challenges...

Question icon

No UX process in place

Initially clients expected us to deliver beautified individual screens. They were reluctant to spend time in any UX activities.

Code icon

Several technical constraints

Turbo was built on top of existing enterprise database systems. Thus, there were some critical technical constraints to consider.

Sandglass icon

Tight delivery deadlines

Dev team was fully setup at the client side. This made delivery timelines extremely short as idle resources costed money.

Being a start-up and engineering team dependent on our designs, we had to dive into mockups immediately...

Embracing uncertainity

To overcome the odds, I employed strategies that helped me gain critical insights into users and business roadmap, while working on initial mocks.

Image: Mockups
Some initial mocks I worked on

Understanding our users

I met with product owner multiple times and read elaborate research documentation about users to empathize with them.

Based on research, I created 2 personas to develop a common understanding of our users with business stakeholders.

Users personas

Adopting lean UX

Given the fast-paced nature of the project, I decided to adopt lean UX that emphasized rapid prototyping, validation and testing.

Lean UX Process
I followed for lean UX to adopt to fast-paced nature of the project

Understanding business roadmap

I met company's CEO to get a complete understanding of business roadmap.

Based on this meeting I drafted a detailed IA. It helped us prioritize modules and plan sprints.

information Architecture
information Architecture
Multi-level Information Architecture for Appify Studio

Involving developers in the process

I often discussed my mocks with developers at the client location to get understanding of feasiblity of my designs.

Early feedback from the engineering team helped me understand viablity of my design concepts.

I used whiteboards as a tool to collaborate with developers
wireframes image
High, medium, low fidelity wireframes during various stages of the project

Pioneering a design system

Lead UI designer crafted the first design system for Appify. I often used elements from it directly to create hi-fi prototypes.

Design system
Design system in collaboration with Dhilip Ganeshan
On one hand the design system was helping us create designs faster, but on the other hand it was taking significant maintainence effort...

We realised that design systems are helpful for products after they reach certain maturity. However, it completely transformed the way I design WFs. Since then, I use component based design– helps me prototype and iterate on modifications much faster.

When 24 hours are not enough

Reaching a deadlock

4 months into the project and our team was working round the clock. Due to complex nature of this platform, we were lagging behind the schedule.

With just one month remaining in the launch, we were in a deadlock situation.

The War Room

To overcome the deadlock, we had to expedite the communication and decision making at every level.

Thus, we decided to host 2 week war room where engineering team, marketing, sales and management, everyone came together in single room and got involved in the design process.

War room pics
We were able to complete 5 major features of the platform in 10 days which led to on-time release of the product.

As a result, the management understood the value of design process, and extended contract for 6 more months with our design studio.

And this is what we created

Introducing Appify

World’s first cloud platform to rapidly build gorgeous enterprise apps in minutes, without writing a single line of code.

It seamlessly integrates with 140+ database systems so no need for data migration. Your data stays safe where it is.

For App Administrators

The App Studio

Appify's Studio is a web platform for app administrators to build or modify enterprise apps at lightning speed.

App Administrator

App admin persona
As app admins are neither developers nor designers– we shouldn't bother them with unnecessary tasks of writing the code or creating the UI...

Just drag-n-drop & Appify does the rest

App admin persona
Checklist concept design in collaboration with Dhilip Ganeshan

We used simple drag and drop architecture, so they just drag the elements they need to create workflows, checklists, maps and more.

App Studio

The Expression Builder

App admins need to configure business logic into workflows. This is core to any enterprise app. However, these expressions can sometimes be quite complicated.

Sales workflow example

How do we enable IT admins to create complex business logic in a simple, efficient and intuitive way, without having them to code?

Goals for the Expression Builder

I started by drafting high-level goals for this module. This was critical to ensure my designs accomplished their purpose and remained useful to the users.

1. Efficient: Create complex conditions quickly, with ease, and with least effort.
2. Intuitive: Interactions should be evident, have minimum learning curve.
3. Clean: Layout should make the expression visually easy to grasp.

Competitor Analysis

I looked at diverse portfolio of products with similar features to understand interface patterns.

I decided to go with the triad structure because of simplicity and intuitiveness.

Early Prototype

Based on the research and requirements, I create a low-fi prototype to get early feedback from internal users, and senior designers in the studio.

Expression Builder WFs
I found, the triad structure worked well, but box inside box didn't have sufficient contrast and couldn't be scaled to multiple nested levels.

Iterate and Refine

I iterated multiple times to discover limitations, new users requirements. With every iteration, I increased fidelity of my designs.

Expression Builder WFs

I discovered that distinct colors for field, operator & value improved readability and indents were helpful in differentiating nested conditions.

Deeper than Interface

I noticed that competitor products used all operators for each field. Users had to figure out relevant operators themselves. This increased selection times and chances of error.

Having a comprehensive list of operators and their relevant operands, increased efficiency, reduced chances of error and improved overall experience.


Behavior Driven Approach

Worked with dev team to implement Behavioral Driven approach for the logical structure, so logic is easily traslated into everyday language for admins.

Logic Breakdown

Usability Testing

I conducted usability testing with a clickthrough prototype with the internal users to discover usability issues in the designs.

Issues discovered

  • Cluttered view: With nested conditions the view became cluttered easily.
  • Re-create conditions: Cumbersome to create same conditions multiple times.
  • Rigid structure: Stucture did not allow them to make customizations easily.

Final Designs

Triad Structure for Simplicity

Field, operator, value structure is used across many products, is simple to understand, intuitive and requires no learning curve.

Triad structure

Color Coding for Visual Clarity

Distinct colors for field, operator and value help to add visual segregation between elements and improve readability.

Color coding the elements

Grouping and Hover for Efficiency

Having a ability to visually abstract the conditions under group will reduce visual clutter and hover to move will help to create complex expressions with ease.

Grouping and hover interaction

Ensuring Accessibility

Testing out my colors for various visual impairments helped me ensure that my design is accessible to everyone.

Color accessibility of the elements

Final Evaluation

I conducted usability testing with a prototype with 3 internal users by giving benchmark tasks. Main findings from the evaluation:

  1. Intuitive Interactions: Users were able to figure out functions of various elements within the interface.
  2. Visually Clear: Users understood the expression, the structure and the interactions.
  3. Enhancing Efficiency: They expressed suggestion to duplicate expressions for making the workflow more efficient.

For App Users

The Roadster

Appify's Roadster is the mobile app created by the admin using The App Studio.

On-field Employees

App user persona
In short, we were not designing for ‘the’ user. Their profiles and tasks vary greatly. We followed universal design principles as we were designing for the world...

Structure for infinite permutations

In Studio, admin can practically create infinite combinations of components. Thus, we created a universal stucture which could handle those permutations.

IA Roadster App

Navigational components

These were critical part of the app. They accomodated scalable and fixed sections depending on the admin’s configuration.

Navigation Components
I chose bottom navigation for fixed sections and vertical side panel for custom sections to keep it scalable.

Prototype, Prototype, Prototype

Having a seamless navigation strcture was core to this app. Thus, I ended up creating multiple prototypes for navigation.

Accessibility button for universal functions

One of the navigational approaches involved novel interation in the side panel.

Getting Expert Feedback

Expert Feedback Sessions

As I created a novel interaction for the side panel, I decided to get feedback from the senior UX designers in our design studio.
Based on their feedback, I decided to use standard interactions as the new approach required significant learning curve for low tech-savvy people.

Final design of the iOS app
The Impact

Product Launch 🎊

Appify Website

Appify was launched globally in January 2019, and as of today is serving a global customer base spanning 6 metropolitan states across US, Denmark, New Zealand and Canada.

Customers on Map

Customers testimonial

When Appify started, stakeholders were reluctant to have any kind of UX process. However I'm happy to report, today Appify hosts an in-house design team. This is one of the unseen impact of our commitment towards designing a great user experience, and the one I'm most proud of.

What I learned

  • Empathize with users, but also with stakeholders: Initially as a designer, I only empathized with the users. However, I learnt that it is equally important to empathize with the stakeholders as well, because in a company there are many practical contraints of resources, finance to implement a design. This helped me create designs which balance user as well as stakeholder needs.

  • Take as much early feedback as possible: During my initial days, I shied away from feedback due to fear of being judged. But I realised how critical it is to take early feedback, not just from users but also from fellow designers, developers, product owners. Everyone analyses design from a different prespective which exposes me to completely new way of seeing my designs.

  • Learn from diverse teams: I was often the centerpiece of collaboration. I realized the importance of expanding my knowledge in adjacent domains. While working with the diverse teams, I learnt about marketing, product management, sales etc which made me a far effective designer.
Recommended next for you

Reimagining Product Trial Experience