Thursday 4 July 2019

Creating a mobile app with APEX - Part 1: Introduction and design


Coming back from my 5 month sabbatical in South East Asia I am refreshed and ready to resume blogging ;-). 

The first task is have assigned to myself is to write a series of blogposts about mobile development with APEX 18.1 (and up). Since this version support for mobile applications is included in the Universal Theme which makes it even easier to develop small screen applications.

I have a number of personal productivity apps like registering expenses and keeping track of working hours. These apps are (of course) built using APEX and targeted for large screen/keyboard use. 

In a series of blogposts I will describe the process of building a client smartphone app for an existing time registration application. 

The report and data entry screen for the desktop app is shown below:







I want to have access this data also on my phone. I also want to enter a new activity or change existing activities.
The desktop pages are not suitable for use on a smartphone. They take up to much screen space or when zoomed the text is too small and the text boxes can not be handled. 

I want to have access this data also on my phone. I also want to enter a new activity or change existing activities.
The design of forms and especially reports needs to take into account the small size of the screen. I have the need to have an overview of activities and a form page to enter or edit an activity. 

Using the mockup tool Balsamiq the layout of the pages is created:


The Activities page will serve as the Home page. It shows a list of all the activities for one week. The activities are grouped by day, ordered by time. The days are ordered descending, meaning the most recent day is shown on top.  
The date picker at the top of the screen is default set to today. Another week can be accessed by changing the date by entering another date, using the date picker or the arrows to move to the previous or next week. 
Each activity is shown as a list item with project name and location as main text and time and description as details. 

The Activity page can be used to enter a new activity or update an existing one. 
The projects can be chosen from a list. 
The date can be entered using the date picker. 
The time fields can be entered using the format HH24:MI. 
The location will be implemented with Autocomplete functionality. 

19 comments:

Neha Uppal said...
This comment has been removed by the author.
wikisol said...
This comment has been removed by a blog administrator.
Unknown said...
This comment has been removed by a blog administrator.
Unknown said...
This comment has been removed by a blog administrator.
topxlisting said...
This comment has been removed by a blog administrator.
Mobile app Development said...
This comment has been removed by a blog administrator.
topxlisting said...
This comment has been removed by a blog administrator.
Anonymous said...

how to make it as android downloadable app from playstore?

Dick Dral said...

This post describes the creation of a web application that is available through the browser on you phone.
You can use Phonegap to create an app referring to this web application.

Anonymous said...


Very interesting and well detailed!

Can I still use Phonegap to publish in the store?

Dick Dral said...

Yes you can.

Anonymous said...


It is written in the Adobe community that it is no longer supported.
I tried to install it but it doesn't start from my pc window.

Maybe it really can't be used anymore?

Dick Dral said...

I cannot tell you, I did not look into that.

Anonymous said...
This comment has been removed by the author.
Anonymous said...

asds

Hire Web and Mobile App Developer said...

Thanks for sharing this informative on Creating a mobile app with APEX in detail. If you have any requirement to Hire Mobile Mockup Designer for your mobile app design project. Please visit us.

CMOLDS Mobile App Development Company in Dubai said...

CMOLDS is the leading mobile apps development company in Dubai, dedicated to crafting cutting-edge solutions that redefine digital experiences and elevate businesses to unparalleled heights.

mobilezmarket said...

Embark on a transformative journey into mobile app development with APEX as we kick off our comprehensive series. In Part 1, we delve into the fundamentals, exploring the introduction and design phase of creating a mobile app using APEX.

dany8 said...

Creating a mobile app with APEX offers a streamlined approach to app development, focusing on efficient design and user experience. The introduction and design phase sets the foundation for building a functional and engaging app. https://talmee.com/ located in Manchester, is a leading Software company specializing in mobile app development, AI-driven solutions, and intuitive web design.