Adapting Tabbed UI for Mobile App 2023 July 19_2

Uploaded on Sep 18, 2023 / 1 view / 9 impressions / 0 comments

alpha01803

More from this user

Description

00:00:00 Host Dave McCormick, VP of Product at Alpha Software, discusses the process of adapting a tabbed UI interface for mobile use. He explains that while the tab UI interface is great for web applications, it is not very responsive on mobile devices due to the smaller screen sizes. The goal is to create a new version of the tab UI as a UX component that can be easily reused. Dave reviews the steps from the previous week, including enabling the security framework and creating system tables. He also mentions the various UX components that were built, such as the reset password feature.

00:05:00 Dave explains how he adapted a tabbed UI interface for a mobile app. He demonstrates how to add buttons that open different components, organizing them into frames. He also points out a log-out button that triggers a JavaScript function to log the user out of the application. Dave then runs the app and shows how the tab UI looks on a browser. However, he notes that the tab UI wouldn't be ideal for mobile devices due to limited screen space. To address this, he introduces a new UX called the master UX, which incorporates a menu to save space for navigation. He demonstrates how the master UX allows users to access various components and how the layout is more mobile-friendly, with readable content even on smaller screens.

00:10:00 Dave explains how to build a new UX for a tabbed UI interface on a mobile app. He starts by introducing the concept of panel cards and panel navigators, which allow users to navigate between different sections of the app. Dave demonstrates how to create and customize panel cards and panel navigators, including adding a navigation bar to the interface. He also explains how to use the menu builder to add items to the navigation bar and how to hook up JavaScript code to handle interactions with the interface. Overall, Dave provides a step-by-step guide on building a tabbed UI for a mobile app.

Tags

  • No tags