Unit 15 – Mobile apps
(Training Department App)
About this project:
I have recently started working as a junior IT Application Developer in a medium sized company that
is based in Norwich. The company has many staff that is based in offices, who work with a range of
computer software including, office, internet and email applications. Following my research into
customised and integrated applications, my supervisor has asked me to develop an application for
the company training department. The training department produce a spreadsheet which lists the
courses they run each month, my application must allow users to select the training sessions they
wish to attend on a form, which is based on the spreadsheet. Whatever sessions the user picks, I will
have to design a solution that sends an email with the choices selected. I will be required to produce
2 effective designs for the customised and integrated application, that will meet the needs of the
training department, considering and evaluating the design decisions.
About my first design:
My first design is a very basic, but functional design. What I mean by functional is that it has all the
necessary functions and features that are required by the brief. The design itself is very minimalistic
and clean.
This is the home page, the page where each user will
be navigated once they open the app. I have made
use of consistent colour across all pages, a gentle
light blue with black and white text to make it easier
for the client to read and observe the application.
The home page consists of different panels for each
training session. I have used attributes and variables
to display information regarding the training session.
As you can see, the trainer is first, the name of the
session and other relevant information. I have made
use of images, that correspond to the type of
workout that is displayed. This makes it easier for
people and in some cases, it saves them time reading
what workout they are about to select. I Have made
use of checkboxes and various icons, to make the
overall look and feel of the app more user friendly. I
have used blue square, to follow the colour theme
and black icon. At the bottom, there is a footer with
a white button with black text. I have used rounded
button to improve the look of the app, due to the
page being square. I have used white background for
each page.
Checkbox – Selects the training session
Information button, when a session is selected, it
Booking button, redirects to the booking redirects to the information page, where useful
page when clicked, obtains information information about the workout is displayed.
from the selected items.
, This is the page, where a user will be redirected,
once they have selected the desired training sessions
and clicked the booking button. As you can see, the
design is very simple once again, and I have used
very similar colour structured. I have used a dark
grey background for the area where the information
about the sessions will be displayed and a light grey,
to fulfil the panel that holds the information. I have
used a similar button for the footer, with white and
black.
This is the page that will be displayed when a
booking is not confirmed, and you have not selected
any choices. It will display a red warning text, saying
“No training sessions selected”.
Navigates back to home.
Submit button, when the button is engaged, it uses
an email function that gathers all the information
about any selected courses including dates etc, and
sends them to the admin email.
y
This is what the page looks like when training
sessions are successfully booked. You can see the
structure when the sessions are added, and the
green “Thank you for your booking” alert that
appears at the bottom of the page. I have ensured to
use warning and success message, in order to make
it easy to understand for people when they have
booked their sessions. It also makes the application
look more professional.
This is the alert or warning label that I This is the success label that I created, to notify users
created, to notify when users have not when they have successfully selected a training
selected a training session, therefore they courses and when the booking is confirmed.
can not proceed to book.
, This is the information, the page where each user will
be navigated once they click the information icon.
This page is very simple and consist of a very similar
structure just like the previous pages. It is meant to
display information according to the selected
session, a bit more throughout explanation of what
the workouts are and what their aim is. I have used
simple scroll down fields and a panel to display the
sessions on the left.
Navigates back to the home page.
Explanation of the Code
This is used alongside with the OnAction property for a button, and
whenever the button is clicked this code is activated, navigating you to the Home2 screen. The Fade
is the transition style.
This is the email function, which is linked to a
button and whenever performed, it will send an email to me, including whatever courses have been
selected using the Concat function from listbox_1.selected items.
This displays the item from the checkbox. When you select a check box
it is added to a list box and the selecteditem.(Item) is used to pass the data over.
This is displaying the date that is obtained from the database.
(Training Department App)
About this project:
I have recently started working as a junior IT Application Developer in a medium sized company that
is based in Norwich. The company has many staff that is based in offices, who work with a range of
computer software including, office, internet and email applications. Following my research into
customised and integrated applications, my supervisor has asked me to develop an application for
the company training department. The training department produce a spreadsheet which lists the
courses they run each month, my application must allow users to select the training sessions they
wish to attend on a form, which is based on the spreadsheet. Whatever sessions the user picks, I will
have to design a solution that sends an email with the choices selected. I will be required to produce
2 effective designs for the customised and integrated application, that will meet the needs of the
training department, considering and evaluating the design decisions.
About my first design:
My first design is a very basic, but functional design. What I mean by functional is that it has all the
necessary functions and features that are required by the brief. The design itself is very minimalistic
and clean.
This is the home page, the page where each user will
be navigated once they open the app. I have made
use of consistent colour across all pages, a gentle
light blue with black and white text to make it easier
for the client to read and observe the application.
The home page consists of different panels for each
training session. I have used attributes and variables
to display information regarding the training session.
As you can see, the trainer is first, the name of the
session and other relevant information. I have made
use of images, that correspond to the type of
workout that is displayed. This makes it easier for
people and in some cases, it saves them time reading
what workout they are about to select. I Have made
use of checkboxes and various icons, to make the
overall look and feel of the app more user friendly. I
have used blue square, to follow the colour theme
and black icon. At the bottom, there is a footer with
a white button with black text. I have used rounded
button to improve the look of the app, due to the
page being square. I have used white background for
each page.
Checkbox – Selects the training session
Information button, when a session is selected, it
Booking button, redirects to the booking redirects to the information page, where useful
page when clicked, obtains information information about the workout is displayed.
from the selected items.
, This is the page, where a user will be redirected,
once they have selected the desired training sessions
and clicked the booking button. As you can see, the
design is very simple once again, and I have used
very similar colour structured. I have used a dark
grey background for the area where the information
about the sessions will be displayed and a light grey,
to fulfil the panel that holds the information. I have
used a similar button for the footer, with white and
black.
This is the page that will be displayed when a
booking is not confirmed, and you have not selected
any choices. It will display a red warning text, saying
“No training sessions selected”.
Navigates back to home.
Submit button, when the button is engaged, it uses
an email function that gathers all the information
about any selected courses including dates etc, and
sends them to the admin email.
y
This is what the page looks like when training
sessions are successfully booked. You can see the
structure when the sessions are added, and the
green “Thank you for your booking” alert that
appears at the bottom of the page. I have ensured to
use warning and success message, in order to make
it easy to understand for people when they have
booked their sessions. It also makes the application
look more professional.
This is the alert or warning label that I This is the success label that I created, to notify users
created, to notify when users have not when they have successfully selected a training
selected a training session, therefore they courses and when the booking is confirmed.
can not proceed to book.
, This is the information, the page where each user will
be navigated once they click the information icon.
This page is very simple and consist of a very similar
structure just like the previous pages. It is meant to
display information according to the selected
session, a bit more throughout explanation of what
the workouts are and what their aim is. I have used
simple scroll down fields and a panel to display the
sessions on the left.
Navigates back to the home page.
Explanation of the Code
This is used alongside with the OnAction property for a button, and
whenever the button is clicked this code is activated, navigating you to the Home2 screen. The Fade
is the transition style.
This is the email function, which is linked to a
button and whenever performed, it will send an email to me, including whatever courses have been
selected using the Concat function from listbox_1.selected items.
This displays the item from the checkbox. When you select a check box
it is added to a list box and the selecteditem.(Item) is used to pass the data over.
This is displaying the date that is obtained from the database.
