Versions Compared

Old Version 52

changes.mady.by.user Sarah Y Cheng

Saved on

compared with

New Version 53

changes.mady.by.user Sarah Y Cheng

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Prototype

Storyboard

Learnability

Efficiency

Safety

Timeline Screen

View Screen          Edit Screen
     BLA

Timeline Screen
At the top of the timeline screen is a map
with dots at all of the locations of the visible
posts below. The map will automatically
resize to encompass them all with as much
detail as possible. There is an arrow across
the screen showing the direction of travel,
using the locations of the visible posts as
points to fit a curve for the arrow to follow.

At the bottom of the timeline screen is a list
of posts from the earliest at the top to the
latest at the bottom. Only a few (in the
drawing, four) posts are visible in the list at
a time. By default the list shows the most
recent posts. Posts are separated by
headings with the month and year
corresponding to the posts under the
heading. The line for each post is
designated by a date and time, as well as
the first few words (if any) and a small icon
to indicate the presence of a picture (if any).
This bottom section is vertically scrollable
by swiping a finger up to see later entries
and down to see earlier ones. At the
bottom of the list is a button to create a
new entry. This will bring the user to the
edit screen with the current time and
location filled in by default.

The user may press and hold a finger on an
entry to see the options to share, edit, or
delete the entry. Just tapping once on an
entry will bring the user to the view screen
for that entry.

View/Edit Screen
The view screen shows the user first the
time and location of the post, then any
pictures, then any contacts, and finally any
text in the post. This screen is scrollable in
the same manner as the list in the timeline
screen. The user can get to the edit screen
by pressing and holding on the screen or
by using the phone's menu button.

The edit screen looks similar to the view
screen, with the addition of a few buttons
and visual cues which let the user know she
can edit the post. The time and location are
underlined, there are buttons to add photos
and contacts, and the textbox has a border
and a cursor. In addition, there is a "save"
button in the lower right hand corner, which
will save any changes and bring the user
back to the timeline screen. To delete a
photo or contact from the post, the user
must press and hold over the item they
wish to remove and select "delete".

BLA

BLA

BLA

Design 3

Prototype

Storyboard

Learnability

Efficiency

Safety

Timeline Screen                                 View Screen
                     

Edit - Text Tab               Edit - Photos Tab            Edit - Contacts Tab                                   

                                                                                                                                               

The timeline screen in this
design shows posts in
chronological order along
horizontal axis. Each post is
represented by a thumbnail of
the first photo in the post.
Ideally, the display of the
timeline will scale and adjust
to the density of posts, so that
there will not be large gaps
between posts.
                                     
Tapping any individual post
will bring you to the view
screen. To share this post,
the user will tap his phone's
menu button and select "share".
To edit this post, the user will
also tap his phone's menu
button and select "edit." This
will bring you to the edit screen.       
                                     
Tapping "New Post"  on the
timeline will also bring you to
the edit screen.

The edit screen contains
three tabs, for editing a text
description, adding photos,
and adding contacts.

The + sign in the photos tab
will bring you to your phone's
camera interface. The + sign
in the contacts tab will bring
you to your phone's contacts
interface.
                                                       
Tapping SAVE on any tab will
bring you back to your updated
timeline.

Pros:
- The "New Post" box 
on the timeline screen
indicates where the new
post will be if you create it.
It teaches the user that
all his posts will be added
to his timeline upon
creation.

- Internal consistency- the
left and right buttons in
the timeline, view, and edit
screens have the same
appearance and
functionality. The - and +
signs are also consistent
across screens.

- Design is simple - it has
a small but efficient set of
buttons, and the edit mode
is neatly organized into
three tabs. 
                             
Cons
- The "SAVE" button might
cause the user to believe
that you must save after
every edit, instead of doing
so only once at the very
end.
                                                    
- It might not be easy for
users to learn to use their
phone's menu button for
sharing and editing
purposes.

Pros:
- You can quickly view a
recent post by tapping on its
thumbnail in the timeline.

- Saving a post immediately
brings you back to the
timeline.

- The - and + signs provide
quick ways of adding/deleting
entries.

Cons:
- If your timeline is very long,
it will be slow to find a specific
post from long ago (you can
only keep tapping the left
arrow).
                                                        
- Editing can take longer
because you need to switch
between tabs.

Pros:
- Every mistake that you might
make in a post is easily corrected
by going to the edit screen.
                                                         
- Every mistake is visible and
easily detected on the timeline
screen or view screen.

- Accidental deletions will be addressed
using an undo system.