Design 1

Launch App
(Home Screen)

a

This is the entry point of the application, and is the first screen that the user faces when it is first launched. This is termed the Home Screen.

At the top of the screen is an Action Bar, and this is persistent across all views in the application. It provides navigational access to other views and application functions via the icons which are present. Beginning from the left, we have the Friends icon, the Events icon and the Notifications icon. We will outline each of their usage in the following task and sketches. The Home Screen comprises of 2 main portions: the search bar at the top and the map view below.

Map View: By having this screen as a default screen, the user (Alice) is able to view a map view of the location, in this case it is the layout of MIT. Her position on the screen is indicated by a Pink dot, whilst those representing her friends' locations are Blue dots. Tapping on a friend's dot will reveal the friend's name.
Search Bar: The search bar allows for Alice to easily find a user's location on the map by entering his or her name. The view camera will pan over and center about the specified friend. Alice may easily pan the view camera back to her location by tapping the Locate button location on the right of the search box.

Listing Friends.

b

Alice wants to view the list of friends that she has using this app, and also approved her. She taps on the Friends Icon on the Action Bar, and it pops and overlaying dialogue. It currently shows two of her friends, Boris and Christine which are sorted alphabetically. Alice wants to search for for Bob to add to this list, and taps the icon with the `+'-plus sign on the top right of the dialog.

Searching for Bob.

c, d

The app dismisses the dialog box, and presents the user with the Add Friend screen. An icon with a left-arrow is the Back Button, which dismisses the page and brings the user back to the previous page (the Home Screen in this case.) should she change her mind.

The soft-keyboard automatically pops up and the prompt gives focus to the Search Bar upon loading this view. As Alice begins typing the letters 'B' and 'o', the application fill the spaces in between the search bar and the soft keyboard with suggested people she might be looking for based on the directory listing database. 

For each person listed within the list that is already an approved friend in Alice's list, a small icon with the word "friend" is present in the cell. Each cell can be tapped to reveal a user's profile, as indicated by the '>'-arrows located at the right edge. 

Alice sees `Bob' in the list, and wants to find out if he is the person she wants to add. She taps on the cell in order to view his profile.

Viewing Bob's profile and sending an "Add Request" to Bob.

e, f

The app brings up the Information View. It lists Bob's name, email-address, office and any other profile information as already available on his public MIT directory listing. Alice knows that this is the Bob she is looking for, and taps on the Send Friend Request button to confirm her intent to send a request to this particular Bob to add as a friend in Discover.Me.

The app brings Alice back to the Home Screen. Alice taps on the Friends Icon on the Action Bar to bring up the dialog, and now sees that Bob has been tentatively added to the list of friends. An icon with the graphic and text stating "pending" indicates that Bob has not yet accepted the request. As such, Alice is unable to view Bob on Map View.

Receiving confirmation from Bob through a Notification.

g

After Bob's approval of Alice's request, Alice is notified by a counter on the Notifications icon in the Action Bar. Alice taps on the icon to bring up the Notifications dialog, and there she sees that Bob had accepted her request. She dismisses the dialog.

Viewing location of all approved friends.

h

This reveals the Home Screen once again. The Map View shows an additional _Blue-_dot, which corresponds to the newly-added Bob's location (Building 19). Alice notices that both Christine (Building 20) and Bob(Building 19) are located relatively close to her (Building 20). She decides that it could possibly be a good time to arrange a meeting for all three of them for a cup of coffee. She taps on the Events Icon in the Action Bar.

Viewing listed events.

i

The app launches the Events List dialog. Alice notices that she has no scheduled events from the dialog that pops up. She taps on the "+"-plus icon to create a new event.

Creating an event for friends - Bob, Christine and Alice herself.

j

The Create New Event view is brought up. It provides text boxes for Alice to fill up, corresponding to the details of the event she wants to organize right now. The Title is a self-defined title which best describes the event. The Location text box is used to define the location of the event. The Time section indicates the Start Time, End Time and Time-Zone of the event. The Participants text box lists the participants of the event and the Comments text box is a free-entry text for an additional information the organizer might want to add.

Alice types in "Coffee" as the title of the event. The timing automatically defaults to the nearest half-hour based on the current time and time-zone which Alice, the user, is at. Alice is also automatically added as the first participant of the event. 

Alice decides to pick a location for the event, and taps on the Compass Icon located on the right edge of the Location text box.

Selecting a location for the event.

k

This brings Alice to the Map View, but it is in the mode which allows her to tap on a location to select a location for the event she is creating. A small semi-transparent note instructs her on how to select a location. Alice decides that Building 24 is a good location that is close to all three of them. She also really likes the coffee there. She taps on Building 24 on the screen to indicate her choice.

Confirming the location for the event.

l

A Pin Icon animates and drops on the point Alice tapped. White Lines are drawn to between a participant and the pin location to indicate that he/she is invited. It thus shows that Alice, Bob and Christine are all invited to participate in the event. 

At the bottom of the screen, a confirmation menu pops up. It states in text: Location: Building 24, MIT which corresponds to the location of the pin and where Alice tapped. Alice knows that this is correct and thus taps the Confirm button to accept the location.

Selecting participants for the event.

m

The Select Participants view is brought up. It presents the list of friends that Alice has (corresponding the to Friend's List). Check-boxes are located on the left of each cell containing the friend's name. There is a search bar located at the top to enable Alice to search for people by typing, or she can make use of the fast-alphabetical scroll-bar located on the right of the screen.

Alice doesn't have many friends, and she can see both Bob and Christine in the list. She checks the boxes corresponding to the both of them. Hovering Text located at the bottom of the screen reflect the number of people chosen. Alice is happy with her selection and taps the Done button.

Reviewing and sending the event to friends - Bob and Christine.

n

Alice is returned back to the Create New Event screen. The information which she has provided is now reflected in the screen. She is happy with her selection and taps the Done button to confirm that she wants to create the event and invite the selected participants to it.

Viewing the created event

o

The screen is dismissed and Alice is returned to the Home Screen. A non-blocking semi-transparent overlay notifies Alice that the invite has been successfully sent out to the users. Alice taps on the Events Icon to bring up the Events List again. It is now populated with her recently created event, giving a summary of the title, date, time and location of the event. Alice may tap on the event to make changes to it, but she does not have any reason to do so right now. She awaits the acceptance of the invite from both Bob and Christine.

Receiving notification of an event.

p

On Bob and Christine's side, they receive a Notification in their app, which once against is indicated on the counter above the Notifications Icon. Tapping on the icon brings up the Notifications dialog once again. 

On Bob's screen, he can see two notifications on the dialog. The new, one is highlighted with a slight shade and has a dot, which indicates that the notification is unread. Unread in this definition corresponds to notifications which were only not present since the last time Alice was in the Notifications Dialog and corresponds with the counter above the icon.

Viewing the event details and accepting the invitation.

q

On their respective phones and apps, Bob and Alice tap on the cell in the Notifications dialog. This brings up the View Event screen, which is similar to the Map View. At the top, the title of the event "Coffee" is listed, as well as the participants invited as indicated by dots on the screen. The pin corresponds to the location.

Bob thinks it's a great idea to meet up, and he is happy with the location and time, and he taps on the Accept button at the bottom of the screen.
Christine, however, would like to meet up for the event too, but has something on at 2:00PM. She decides to respond to the invitation by Proposing a Change and tapping on the Propose Change button.

Proposing a change to the event.

r

Proposing a change of time for the event.

s, t

Receiving a notification for a proposed change to the event.

u

Reviewing proposed changes to event

v

Accepting and re-sending the invitation

w