Comment on page

Concept of designing an app

The idea of app structure

An app is a well-organized set of screens.
When building an app in Starion, imagine that you are designing a storybook. Each screen in a mobile app is like a page in a storybook. It's where you see and interact with different information or functions. For example, one screen could be where you read the news, another where you check your messages, and yet another where you play games.
By flipping pages, you go to the page you want in the storybook. In the app, it's navigation. You use buttons, menus, or gestures to navigate through the app, just like you use your hands to flip through the pages of a book.
Therefore, when you develop a mobile app, you design the app pages and the navigation elements.
Image source:

From tables to app pages

In the introduction to data, the data table plays an essential role in the app development. Next, explore how we turn your table into a mobile app.
Imagine you have a data table of products in your store, where each row represents a different item, and each column has specific information about that item such as name, description, and price.

Rows to collection page

The collection page is like the entrance of the store, where you see a list of all products in the store. In our app, it's a page that shows entries of all rows from your data table.

A row to detail page

When you pick a product from the shelf, you want to see more details. In our app, the detail page is like checking a product from the collection page. It shows you all the specific information about one item from one row in your data table.

Using the form page to add data

A form page in the app is where you can add new information. It's like filling a new product in your store. You can input details, and when you're done, it becomes a new entry in your data table.
So, in simple terms, turning a data table into an app is like turning your product spreadsheet into a user-friendly product management app. There should be a collection page that lists all your items, a detail page that shows you the specifics of one item, and a form page that lets you add new items to your store. It's like making your data more accessible and interactive.

Actions to interact

Designing actions in an app extends beyond mere page navigation on a menu bar. There are various types of actions in an app that enhance user interaction and engagement such as buttons, gestures, and toggle switches. By incorporating these various types of actions, app designers create a dynamic and engaging user experience that goes beyond simple page navigation, providing users with intuitive ways to interact with content and perform tasks within the app.
Starion offers you a library of pre-defined actions as well as pre-built elements like buttons to trigger the action that you can easily integrate into your apps. These actions can cover common functionalities like navigation, data handling, and more. In this way, we are aiming to accelerate your development process and reduce the need for manual coding for you.

A quick guide to get started

Based on the concept of how a table can turn into a mobile app, let's go with the flow by learning to design the 3 pages: Collection page -> Detail page -> Form page.
For in-depth instructions, refer to our comprehensive articles below:
In each of these articles, we will provide a comprehensive walkthrough of the design process for each page. This includes a deep dive into layout considerations and a detailed exploration of the key elements involved.

In addition

As you delve deeper into app design, consider incorporating additional features to enhance the user experience. Two critical elements to consider are the authentication page and product tour.
Authentication pages, including login and sign-up screens, play a pivotal role in user interaction. These pages are the initial touchpoints for users and must be intuitive and secure.
The product tour is a valuable tool to guide users onboarding through the app's key features and functionalities, especially before they sign up. These tours provide a glimpse into the app's value and capabilities.