THE DEVELOPMENT PROCESS

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.


Communication Diary
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.