10.1 / Homepage Animation
Animation
The home page animations have
been designed to transition the user
to relevant content with ease and
comfort. Each of the widgets on
the page have an active and inactive
state. In the active state, the widget
is open and allows the user to enter
and select data relevant to their travel
needs. In the collapsed state, the
widgets will give a summary of the
information the traveler has already
entered.
Module location & spacing
Book travel
Once the Book Travel widget is
expanded, the user is allowed to
search for a flight, by specifying the
departure and arrival dates, selecting
a cabin class, and choosing who the
travelers will be. In this widget, there
are also options to search for hotels,
rent a car, select a cruise or view
vacation packages. In most cases,
this will be the active widget when
arriving at the home page.
Book travel
MileagePlus
Once the MileagePlus widget is
expanded, the user is allowed to
either sign in or join with a new
account. Once signed in, the widget
will display the members number,
mileage balance, travel bank,
upgrades, segments, and premier
dollars. From this widget you will also
be able to see the full account.
MileagePlus
Flight status
Once the Flight Status widget
is expanded, the user is allowed
to enter either flight number and date
or departing and destination cities
to view the desired flight details.
Once entered, the widget will display
flight numbers, if the flight is on time,
weather, terminals, gates,
and plane type. The user will also be
able to view and select the upgrade
list, standby list, seat map and list
of amenities for the flight. In the
collapsed state the widget will list
if the flight is on time or delayed.
Flight status
My trips
Once the My Trips widget is
expanded, the user is allowed to
enter either the confirmation number
of their flight to see flight details
or the confirmation number of their
rental car agreement to view rental
details. Once entered, a summation
of both will be displayed in the
widget. When collapsed, if the
traveler has a saved itinerary,
the number of upcoming trips
will be displayed.
My trips
Check in
Once the Check In widget is
expanded, the user is allowed to
enter their specific travel information
and check in for their flight. Once
checked in, the user will be able
to see a summary of their booked
flights, current weather, travelers
involved, and notifications pertaining
to their travel. When collapsed, if the
traveler has a saved itinerary, it will be
displayed in summation.
Check in
System alerts
When there is a System Alert,
the alert widget will appear in the
upper right portion of the module
grid. If there is more than one alert
or additional information is needed,
the alert module will double in width
but remain the same size in height.
The proper icon will appear in the top
right corner of the widget for quick
reference as to what the
alert messaging pertains to.
System alerts
Homepage grid
The home page modules are set up
to fit within a grid with a 940 pixel
width. All tiles will have an active and
inactive state. Each tile when active
will have a set size of 380 pixels
wide by 376 pixels tall. Active tiles
will allow the user to input data in
order to gain access to their travel
information. All inactive tiles will be
set to a size of 188 pixels by 188
pixels. Inactive tiles will show a very
brief summary of the information
contained within.
Homepage grid
