In November 2021, we began web app development for Upside, a SaaS platform that allows setting up, monitoring, and managing employee benefits programs. The founder had a great vision for his product and needed help to bring his idea to life fast.

Our goal was to make a web app using a no-code web app development approach, and we did it in 2,5 months, turning the idea into a full-fledged product.

The project idea was to create a simple platform that allows companies to offer employees flexible spending accounts while maintaining complete oversight and control.

Upside platform needed to have the following parts:

1. Company admin tool.
2. Employee dashboard.
3. Upside admin.

The core values of the platform were easy to upload and use for employees, easy to control, and get a summary of expenses for admins.

To that end, we needed to complete the following tasks:

• Conduct user and competitor research;
• Prepare clear Figma wireframes and app development requirements;
• Create a vibrant and simple UI for the app flow;
• Develop, test, and release a web application.

First of all, we carried out thorough preparatory work – clarified the vision, and conducted strong user and competitor research. Then we went through several versions of Figma wireframes and prototypes.

A wireframe is a schematic visualization that helps you think and communicate about the structure of the app you are building. It illustrates an interface that focuses on functionalities available to intended behaviors and does not include any styling, color, or graphics.

A prototype is a model of your application that shows the screens and their relationships. It helps to understand how people will use the product.

The first versions of Upside wireframes were just papers visualizing our brain storms’ results.

‍

We used Figma, an online editor for interface design and prototyping, to collaborate fast and conveniently for the final versions of the Figma wireframes. The primary functions of the service are available for free.

One of the main goals of this stage of web app development was to find out the key functionality required for a minimum viable product (MVP). Our advice – focus on the critical features and implement the others in version 2.0. For example, we postponed to version 2 the ability to create and manage user groups, which allowed us to significantly simplify the logic and release the app faster.

After Figma wireframes, we wrote an app development requirements.

Software requirements specification (SRS) – a document that describes what the web app will do and the functionality Upside needs to fulfill all stakeholders’ (C-Level, HR team, Accounting Team, Office Manager, Employees, Freelancers, Contributors) needs.

App development requirements for Upside consisted of three units:

1. Project description – problem statement, business assumptions, user assumptions, business outcomes, user outcomes;
2. Research materials – competitor & user research, business goals and assumptions, user personas, user interviews, glossary, and all the other important information about the product;
3. Software requirements – high-level features, models, user stories, app analytics, security/privacy guidelines, design guidelines, project documentation, backlog

With over ten years of web app development experience, we know that a good UX significantly increases conversions.

App design encompasses the user interface (UI) and user experience (UX), which blend seamlessly for a smooth user experience.‍

UI design focuses on the overall style of the app (including the colors, fonts, and general look and feel), ‍

UX design relates to navigation, functionality, and usability.

First of all, we set up a color palette, and typography, and created minimalistic UI elements and illustrations.

The main challenge was implementing all the functionality in 2-3 months to get MVP, traction, and the first feedback from real users. That’s why we chose Bubble web app development.

No-code or zero-code platform is a tool for creating applications through graphical user interfaces and configuration without traditional writing code.

No-code was a wiser choice for a new idea like Upside. Bubble web app development made it possible to implement all the necessary features.

The main challenge was implementing all the functionality in 2-3 months to get MVP, traction, and the first feedback from real users. That’s why we chose Bubble web app development.

No-code or zero-code platform is a tool for creating applications through graphical user interfaces and configuration without traditional writing code.

No-code was a wiser choice for a new idea like Upside. Bubble web app development made it possible to implement all the necessary features.

That’s what we have done for Upside with Bubble web app development.

Users and companies

All users can sign-up with the email/password or with their Google account, log in/log out, and reset the password.

Admins can manage the company profile, and subscription, invite employees by email, and manage users (view all users, edit, deactivate, and delete them).

Programs and balances

Admins can create, edit, and delete the benefits program (name, budget, frequency, members, categories, and limits).

Users can view their available balance (sum of all unused balances from all my active programs) and active programs. When a user takes part in the program, a “Program Balance” is created. Users can see the dashboard (by period, category, and missing items), create, edit, delete a reimbursement, and request a category/perk from the company.

Team members can submit a suggestion or a request to their company admins for new programs/perks.