01Initial Sketches Brainstorming
01Functionality
Scenario A – Closer Look
PRIMARY USER GOAL
2
Provide a simplistic process when booking a flight that is consistent throughout and can utilize as navigating forward and backward in the process.
User has the Ability to Modify Search with Ease
User Has the Ability to Interact with the Process
User Has the Ability to Interact with the Process
FLIGHT
FLIGHT
Departing City to Arrival City
Select Departing Flight
SECONDARY USER GOAL
ITINERARY
Restructure the layouts so the user can view the flights and pricing more visually.
1
3
Simplify Content on Index Page of Booking a Flight.
Departure City
User Has the Ability to Interact with the Process
FLIGHT
Arrival City
DEPART
Travel Time
Depart Airport Arrive in City
Flight #000
$000
0:00 AM 0:00 AM
Depart Airport Arrive in City
Flight #000
$000
Arrive
Flight #
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
Name
D.O.B
SEX
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
Address
City
State
RETURN
MAR 23
INFORMATION
Exp Date
Card Number
Arrival Date
Zip Code
PAYMENT
Select Returning Flight Departure Date
0:00 AM 0:00 AM
Depart
Depart
Arrive
Flight #
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
CDV
Travel Time
One Way
Round Trip Departure City or Airport Code Arrival City or Airport Code
SUN M
T
W
TH
F
Submit
SAT
1 Adult 0 Seniors 65 +
STEP 3: FLIGHT SUMMARY Flight Itinerary and Payment Information
Advanced Search
Ease of Calendar Availability
STEP 1: PROVIDE FLIGHT DETAILS Departure & Arrival Cities, Number of Travelers, Travel Dates
STEP 2: SELECT FLIGHTS Departure & Arrival, Have the Ability to Modify Flight Search
Note: Layout Exemplifies Better Flight and Pricing Visibility for User
FLIGHT Congrats Payment Complete ITINERARY DEPART
RETURN
MAR 23
Step 2
Step 3
0:00 AM 0:00 AM
Depart Airport Arrive in City
Flight #000
$000
0:00 AM 0:00 AM
Depart Airport Arrive in City
Flight #000
$000
Accomplish
Step 1 Step 2
Step 3
Message Indicating Payment Complete Ability to Print Page
Note: Pricing is Dominant for User
01Visual Narrative Scenario B
In their office, on the keyboard types in next business trip dates on Delta.com
Business Traveler PRIMARY USER GOAL: EASE OF USE
When the traveler is on the page to select flights; they would be very satisfied to have the availability to modify the initial flight information.
FLIGHT Select Departing Flight
FLIGHT Round Trip
One Way
Multi Way
SUN M
T
W
TH
F
SAT
Select Departing Flight
Departure City Arrival City
1 Adult
0 Seniors
Departure City
Arrival City
Optional: Multi City
Depart A Depart
Arrive
Flight #
0:00 AM
0:00 AM
000
Travel Time
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
rrive
F
light #
Travel Time
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
0:00 AM
0:00 AM
000
0h 00m
$000
$000
$000
$000
$000
$000
Select Returning Flight Depart A
rrive
F
light #
Travel Time
h
Has the ability to modify the search. Can modify the flight dates without having to start the process all over again.
scenario development
SUN
SUN M
T
M
W
T
TH
W
F
TH
F
SAT
SAT
Needs to modify travel dates
02 User Flow Flow Chart
Flowchart of the Virtual User Solution
index phase 1
select flights phase 2
review flight info
receipt
phase 3
select seats PLEASE NOTE:
The following ten pages exemplify the layouts the participants interacted with. Once I structured each layout of the high fidelity prototype, I formed an interactive pdf to allow the testing participants to interact with the prototype as if it was a live website. I created text fields for the users to type in their flight information along with interactive radio buttons to allow them to indicate their preference of choice for flight selections.
02 Prototype Low Fidelity
WORKING PAPER PROTOTYPES
It was nice to get the rough design off the screen and into hand to provide a closer look.
02 Prototype Low Fidelity
RESPONSIVE WEBSITE
The revised website will be responsive due to the target users using different sizes of devices, from monitor, netbook, to tablet.
02 Prototypes Working
CONTACT
Round Trip One Way Multi
Leaving From
Departure City or Airport Code
Departure Date
1 Adult
Arrival Date
0 Seniors 65 +
Going To
Arrival City or Airport Code
LOREM IPSUM LOREM IPSUM: ea consectetur adipisicing elit, sed do eiusmod tempor incididunt ut do labore et dolore magna aliqua. Ut enim ad minim veniam, quis ex ea nostrud exercitation ullamco Ut laboris nisi ut aliquip ex ea ex ea commodo consequat. LOREM IPSUM: irure dolor in reprehenderit in Ut voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non sit sit proident, sunt in culpa qui officia deserunt mollit anim id est non laborum Lorem ipsum dolor sit amet, consectetur LOREM IPSUM: elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
CONCEPTUAL DEVELOPMENT
DIGITAL DEVELOPMENT
Screenshot of conceptual layout.
Screenshot of digital layout.