Look at Pictures
This module has undergone some minor changes since its first draft. I
had done some research on browsing application before getting started
and that research paid off. I have kept the layout the same, allowing
for the user to select a contact in a variety of ways. A few minor changes
came about to the fonts and background color of the application. I changed
the word "Browse" to be more user-friendly and have thus called
it "Look at Pictures" to appeal to the computer layman user.
Also, instead of labeling the buttons "Next" and "Prev",
I put right and left arrow pictures to appeal to the sense of basic user
cognitive abilities. Unfortunately, I don't have screenshots of
the mid development process; however I have the early low fidelity prototype
of my design early in the design phase. (Refer to fig.1)
Figure 1. Low fidelity prototype of browse feature.
Send an Email Card
This module has undergone only a few changes as well. The few changes
included using a bigger font and changing the background color of the
application from grey to white.
A few words about the features - I have used quite a few of the eight
golden rules to design the interface. For example, I have used images
wherever possible to avoid the users to read unnecessarily when images
would suffice. There are helpful message boxes that guide the user whenever
they do anything incorrect. The users always have the option to cancel
the task, or go back to a previous screen. The users are also given feedback
of their actions. I used the same control for browse as I did for the
"Look at Pictures" module in order to be consistent with the different
components. As stated above, I unfortunately don't have screenshots of
the mid development process. Refer to fig.2 to see
a low fidelity prototype of the "Send an e-card" feature.
Figure 2. Low fidelity prototype of e-card feature.
Make a Phone Call
The original designs for the "Make a phone call" section are
vastly different from the final version. The first thing to note is that
title of the section has changed from "Dial Out" to "Make
a phone call". While dial out seems to be more of a high level term,
the alternate name, Make a phone call, is clearly self-explanatory and
more suited to our target audience. The first designs separated the names
and pictures of the people in the album, which seems to clearly defeat
the whole purpose of using pictures as a visual aid. The final design
has incorporated the pictures with the names of people and their relationship
to the user. The prompts have also been changed from start with "Choose"
instead of "Select", which seems to be a more tech-oriented
approach. The alignment and color scheme have also been slighted modified.
Below are two of the screens from the low-fidelity prototype. The third
is the final version of the screen for making a phone call.
Figure 3. Phone Call Screen 1.
Figure 4. Phone Call Screen 2.
Figure 5. Final screen for phone calls.
As with the phone call section, the pictures have now been incorporated
with the people's names and their relationship to the user. The
title of the section has also been changed from "Search" to
"Communication Diary" which seems to better explain the purpose
of the section. The button colors have been changed from turquoise to
light gray so as to closely match the Windows theme some users might already
be familiar with. The prompts have also been modified to better accommodate
our target audience. The help button has been removed because time did
not permit for its implementation. Below are two screens from the low
fidelity prototype and the final screen from our design.
Figure 6. Search Screen 1.
Figure 7. Search Screen 2.
Figure 8. Communication Diary Screen.