Server-Driven UI

What is Server-Driven UI and How is Robinhood — a FinTech Startup Valued at Over $10 Billion — Using it?

By Read Dive 7 months ago
Rate this post

The traditional process of adding new features and upgrading the app’s user interface is lengthy. In today’s fast-paced world, organizations must quickly launch an application, and add options and various functionalities. Developers are required to make changes and test them across different devices, operating software, etc.

Server-driven UI is the solution for the above challenges. With the help of SDUI, outcomes about the app’s look and display are made on the server side and then sent to the app.

Businesses can change the application’s user interface, and introduce new features more quickly. The applications launch quickly, keeping it engaging and relevant to the users.

What is Server-driven UI?

Server-driven UI is a more flexible solution for app development. SDUI depends on the server to order the app’s UI to make changes on the server side, which gets reflected on the client’s side.

SDUI verdicts about the app’s appearance and displays are seen on the server side and then set to the app. The responsibility is transferred from the application to the server. Hence businesses can introduce new features at a faster pace than earlier.

The core fundamental of SDUI surrounds the server dictating the UI presentation to the client. The server transmits data and UI layout instructions to the client, who then renders the UI following these instructions. This process does not require the client to manually update the changes every time. In most circumstances, the common language used is JSON.

When we say that the server should be able to control the app’s UI and workflow, we mean that the server should be able to send all of these app-building components in a way that the app understands.

In short, the server creates a set of JSON that contains the whole specification of an app and then syncs it to the mobile, where the modules are rendered and the screen is displayed to users.

How Server-driven UI is Beneficial?

The advantages vary from user to user and depend on individual problems of different perspectives. Here are some of the similar benefits of SDUI to know:

  • Quicker updates and delivery

Traditionally, updating an app takes time. It has to go through various phases, such as store dependency, phased rollouts, and the last user downloading the new version. Server-driven UI can make it possible in a single day without the requirement of a user to download and install a new version.

  • Reusability of Code

Server-driven UI supports code reusability. Hence, the development process only needs to be done once. The code then be assigned to various platforms.

  • Security

Server-driven UI permits the server to certify information before sending it to the mobile applications. It ensures the data is trustable and secured against attacks. This process becomes necessary when dealing with sensitive information, such as financial transactions and personal information.

  • Friendly Analysis

You can carry out A/B tests efficiently. It means you can test different versions of UI with various user groups without the need to update your mobile app.

  • Reduce Developmental Time

Since developers can rely on servers to generate UI, they can concentrate on building the server-side code without worrying about the client side. It reduces the developmental time and allows to delivery of products faster.

Robinhood

Robinhood is a financial service company founded by Vlad Tenev and Baiju Bhatt in 2013. It is headquartered in California and is a FINRA-regulated broker-dealer, registered with the U.S. Securities and Exchange Commission.

The company offers commission-free trading of equities, exchange-traded funds, and cryptocurrencies, as well as individual retirement plans. Robinhood’s original product was commission-free trading, which was a disruptive fintech app development player in the brokerage business, assisting youthful investors in entering the market.

Because of its clean design and straightforward trading experience, the platform soon found a home with young, tech-savvy traders.

As of December 31, 2022, Robinhood has more than 11.4 million monthly active users and $62 billion in assets under custody. The app is popular among young, first-time investors, and it is known to deliberately target younger investors.

How does Robinhood use server-driven UI to its Advantage?

Robinhood believed in the single idea that its financial markets should be accessible to all. The company wanted to change how it displayed information to its customers.

Problem Statement

The company wanted to change how they display information to the customers. The traditional approach they used to build frontend UI was slow. Any changes made in iOS or Android were required to release a new version of the app. This combination resulted in a long-driven process involving multiple developers, only to make minute changes in UI.

How They Solve?

Robinhood used SDUI, which allows them to make UI changes without modifying client-side code and having to re-release the app. Server-driven UI also promotes the reuse of the core design system components across platforms, allowing them to save more time.

Let’s walk through how they solved this by creating an SDUI on their crypto page.

The crypto detail page is a native screen that includes a section configuring the position of any crypto one owns. With the help of SDUI, they can change the structure of the screen, without the need to release a new app.

The pricing information is also consistently shown across all platforms, without being dependent on client-side calculations.

What Were the Requirements?

Easily Operated

The company believed that to provide the best developer experience they would have to define components directly in the code. While on the backend, they use an existing API gateway and leverage the Pydantic library with Mypy for static type checking.

Safety

The SDUI platform is automated, which means team members can add the components themself. They generated a JSON schema for all subclasses of UI components using schema_json. When a component gets a new update, the new schema is compared to the existing one to ensure backward compatibility.

In addition to it, they need to manage their instabilities between separate frontend platforms. To reduce instabilities, the developers generate client-side types that symbolize components. It significantly reduces the chances of error and checks that all fields have the same name on all platforms.

Native Composability

Rendering a UIComponent model on a screen requires a translation from each subclass of UIComponent to a client-side representation of a view. The deployment varies across frontend platforms, transforming to the View model on iOS, composable on Android, and React component on the web.

As mentioned, SDUI gives the capability, to make structural changes to the UI without releasing new application updates. In the case of the crypto detail page, it allows the engineers to embed extra information into this section which was not included in the original design.

Final Thoughts

The world of fintech is regularly evolving, and it’s necessary to stay ahead of the game. One innovative approach that’s gaining traction is server-driven user interfaces.

This is important in the super competitive fintech industry, where keeping users happy is the name of the game.

Just look at Robinhood — their success is a testament to the power of these cutting-edge technologies. By incorporating fintech software development, startups can unlock a lot of benefits, from satisfied users to greater growth potential.

Tags: ,