GR2
Scenario
Mother (passive user) wants to find pictures from her son's 6th birthday so the grandparents can view it. She is not sure where these picture are stored- if it is on a site, a camera, or anywhere. So she searches on the site for them. Once she gains access to it on the site, she distributes the picture (as well as maybe any other relevant ones) to the grandparents.
Goal: share a picture from son's 6th birthday
Tasks:
- Find the picture/determine if the desired picture is in fact on CoShare
- Share picture with grandparents
Individual Designs
Ken
...
| Wiki Markup |
|---|
{html}
{html} |
<DIV
...
class="hidable"
...
id="design1"></DIV><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<H4><A
...
name="GR2-FunDisplay"></A>Fun
...
Display</H4>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>This
...
design
...
tries
...
to
...
make
...
it
...
fun
...
for
...
users
...
to
...
scroll
...
through
...
and
...
find
...
media.
...
Items
...
are
...
displayed
...
in varying sizes in a mosaic like form. This yields some uncertainty as to where certain items are but it gives the user a fun and new way to browse files. </P>
<P mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>The
...
search
...
bar
...
is
...
there
...
to
...
find
...
a
...
specific
...
picture
...
or
...
event,
...
but
...
the
...
layout
...
is
...
meant
...
for
...
the
...
user
...
to
...
go
...
looking
...
for
...
one
...
thing
...
and
...
stumble
...
upon
...
several
...
others
...
in
...
the
...
process.
...
</P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>The
...
design
...
is
...
not
...
efficient
...
for
...
the
...
user.
...
The
...
layout
...
makes
...
it
...
fairly
...
easy
...
to
...
learn
...
how
...
to
...
use.</P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P> <IMG imagetext="20130308_011822.jpg
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/20130308_011822.jpg?version=1&modificationDate=1362724121000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/20130308_011822.jpg?version=1&modificationDate=1362724121000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<H4><A
...
name="GR2-EfficientDesign"></A>Efficient
...
Design</H4>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>This
...
design
...
allows
...
the
...
content
...
to
...
get
...
to
...
content
...
strictly
...
by
...
searching.</P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>The
...
search
...
results
...
page
...
not
...
only
...
displays
...
relavant
...
media,
...
but
...
it
...
also
...
displays
...
potential
...
people,
...
albums,
...
or
...
events
...
in a separate grouping. This gives the user easy access to the result type they wanted. It takes limited scrolling to find what you want in the results so it is efficient to get the result you want, and it only requires one page load. Search autocomplete aids the user in searching for relavant things. The user can search by person, event, date, or filename.</P>
<P mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>The
...
landing
...
page
...
also
...
presents
...
the
...
user
...
with
...
recent
...
activity
...
in
...
case
...
the
...
other
...
parent
...
recently
...
did
...
something
...
they
...
were
...
trying
...
to
...
do.</P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P> <IMG imagetext="20130308_011925.jpg
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/20130308_011925.jpg?version=1&modificationDate=1362724130000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/20130308_011925.jpg?version=1&modificationDate=1362724130000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<H4><A
...
name="GR2-LargeView"></A>Large
...
View</H4>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>The
...
larger
...
view
...
allows
...
users
...
with
...
poorer
...
eyesight
...
to
...
navigate
...
with
...
ease.
...
It
...
also
...
attempts
...
to
...
display
...
things
...
to
...
the
...
user
...
in
...
a
...
friendly
...
way.
...
The
...
user
...
will
...
be less intimidated by the overly sized interface because they won't
...
feel
...
like
...
they
...
are
...
missing
...
something.
...
</P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>It
...
sacrifices
...
some
...
efficiency
...
by
...
initially
...
displaying
...
media
...
to
...
the
...
user
...
one
...
item
...
at
...
a
...
time,
...
however
...
the
...
option
...
remains
...
to
...
see
...
a
...
grid
...
like
...
view
...
of
...
all
...
the
...
media.
...
</P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P>The
...
initial
...
search
...
for
...
something
...
can
...
be
...
made
...
by
...
person,
...
event,
...
or
...
date.
...
The
...
calendar
...
shows
...
users
...
which
...
dates
...
have files associated with them through color and mouse over pop ups. </P>
<P mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P><IMG
...
imagetext="20130308_011856.jpg
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/20130308_011856.jpg?version=1&modificationDate=1362724141000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/20130308_011856.jpg?version=1&modificationDate=1362724141000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR></P>
...
<H3><A
...
name="GR2-Joe"></A>Joe</H3>
...
<DIV
...
class="wysiwyg-macro"
...
macrohasbody="true"
...
macroname="html"
...
macrostarttag="</div>
...
<p>"
...
wikihasnewlineafterbody="false"
...
wikihasnewlinebeforebody="false"
...
wikihasprecedingnewline="true"
...
wikihastrailingnewline="false">
...
<DIV
...
class="wysiwyg-macro"
...
macrohasbody="true"
...
macroname="html"
...
macrostarttag="<p><br
...
/></p>
...
<DIV
...
class="
...
wysiwyg-macro>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H4><A
...
name="GR2-TinyScreen"></A>Tiny
...
Screen</H4><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>This
...
design
...
tried
...
to
...
tackle
...
the
...
extreme
...
case
...
of
...
having
...
a
...
tiny
...
screen,
...
perhaps
...
on
...
a
...
mobile
...
device.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>The
...
process
...
of
...
finding
...
a
...
specific
...
picture
...
is
...
done
...
by
...
searching
...
through
...
a
...
calendar
...
layout.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Sharing
...
is
...
accomplished
...
by
...
using
...
the
...
link
...
provided
...
for
...
each
...
picture.
...
It
...
is
...
left
...
to
...
the
...
user
...
to
...
share
...
as
...
they
...
please.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P> <IMG height="300"
...
imagetext="i
...
hate
...
this.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/i+hate+this.jpg?version=1&modificationDate=1362722151000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/i+hate+this.jpg?version=1&modificationDate=1362722151000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H4><A
...
name="GR2-IlliterateUsers"></A>Illiterate
...
Users</H4><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Tried
...
to
...
illustrate
...
flow
...
of
...
site
...
without
...
text,
...
so
...
primarily
...
with
...
images.
...
Visual
...
breadcrumbs
...
help
...
understand
...
where
...
they
...
are
...
in
...
the
...
process.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Used
...
pictures
...
of
...
children
...
to
...
illustration
...
aggregation
...
by
...
person.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Pictures
...
would
...
be
...
shown
...
in
...
chronological
...
order
...
which
...
would
...
hopefully
...
be
...
apparent
...
based
...
on
...
the
...
content.
...
An
...
envelope
...
represents
...
a
...
link
...
to
...
...
it.
...
The
...
recipients
...
of
...
the
...
...
are
...
represented
...
as
...
pictures
...
a
...
well.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
height="300"
...
imagetext="photo_4.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo_4.jpg?version=1&modificationDate=1362721233000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo_4.jpg?version=1&modificationDate=1362721233000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
imagetext="photo_5.jpg
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo_5.jpg?version=1&modificationDate=1362721238000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo_5.jpg?version=1&modificationDate=1362721238000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
imagetext="photo_6.jpg
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo_6.jpg?version=1&modificationDate=1362721241000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo_6.jpg?version=1&modificationDate=1362721241000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H4><A
...
name="GR2-"></A><SPAN
...
mce_style="color:
...
#660000;"
...
style="color:
...
rgb(102,
...
0,
...
0);"><B>Ultra
...
Efficiency</B></SPAN></H4><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>All
...
manipulation
...
is
...
done
...
through
...
entering
...
commands
...
and
...
hotkeys.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>The
...
command
...
bar
...
shows
...
the
...
current
...
search
...
query.
...
Can
...
use
...
different
...
keywords.
...
A matching
...
contents
...
bar
...
shows
...
the
...
pictures
...
matching
...
the
...
query.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Hotkeys
...
can
...
copy
...
links
...
to
...
images,
...
then
...
can
...
be
...
shared
...
as
...
the
...
users
...
wishes.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
height="300"
...
imagetext="photo_1.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo_1.jpg?version=4&modificationDate=1362722082000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo_1.jpg?version=4&modificationDate=1362722082000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
imagetext="photo_3.jpg
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo_3.jpg?version=1&modificationDate=1362721398000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo_3.jpg?version=1&modificationDate=1362721398000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
height="300"
...
imagetext="photo_2.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo_2.jpg?version=1&modificationDate=1362721395000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo_2.jpg?version=1&modificationDate=1362721395000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H1><A
...
name="GR2-Justin"></A>Justin</H1><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>This
...
design
...
allows
...
users
...
to
...
search
...
for
...
pictures,
...
and
...
it
...
pulls
...
up
...
related
...
ones
...
as
...
well.
...
It
...
shows
...
when
...
devices
...
have
...
last
...
been
...
synced
...
to
...
the
...
site,
...
so
...
users
...
can
...
have
...
an
...
idea
...
of
...
where
...
the
...
offline
...
pictures
...
they
...
want
...
might
...
be.<BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR>
...
<IMG
...
imagetext="design1.png
...
|border=1"
...
mce_src="../../../../../../../../../download/attachments/86269860/design1.png?version=1&modificationDate=1362757282000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/design1.png?version=1&modificationDate=1362757282000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>This
...
is
...
the
...
super-efficient
...
design. Intended when users want to find and share pictures as quickly as possible, it leads them right through the steps. Their linear progression to the right in going through all steps communicates to them exactly what they need to do next.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
imagetext="design2.png
...
|border=1"
...
mce_src="../../../../../../../../../download/attachments/86269860/design2.png?version=1&modificationDate=1362757286000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/design2.png?version=1&modificationDate=1362757286000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>This
...
design
...
offers
...
two
...
alternatives
...
for
...
a
...
graphical
...
layout
...
indicating
...
to
...
the
...
user
...
pictures
...
that
...
have
...
been
...
recently
...
added
...
to
...
the
...
site,
...
and
...
with
...
whom
...
they
...
are
...
shared
...
with.
...
The
...
first
...
approach
...
uses
...
more
...
orderly
...
rows,
...
while
...
the
...
second
...
attempts
...
to
...
use
...
Venn
...
diagrams
...
in
...
showing
...
pictures
...
that
...
are
...
shared
...
with
...
different
...
groups.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
imagetext="design3.png
...
|border=1"
...
mce_src="../../../../../../../../../download/attachments/86269860/design3.png?version=1&modificationDate=1362757289000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/design3.png?version=1&modificationDate=1362757289000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H2><A
...
name="GR2-DesignMarkups"></A>Design
...
Markups</H2><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H2><A
...
name="GR2-StoryboardsandDesigns"></A>Storyboards
...
and
...
Designs</H2><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H3><A
...
name="GR2-Design1"></A>Design
...
1</H3><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><B>Step
...
1</B></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P> - Introduced to homescreen with information about spouse's
...
uploaded
...
content
...
and
...
sharing activity </P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>
...
-
...
User
...
wants
...
to
...
find
...
picture
...
so
...
they
...
go
...
to
...
browse</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P> <IMG imagetext="photo
...
1.JPG
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo+1.JPG?version=1&modificationDate=1362716751000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo+1.JPG?version=1&modificationDate=1362716751000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><B>Step
...
2</B></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>-User
...
is
...
not
...
sure
...
on
...
exact
...
specifics
...
of
...
picture,
...
but
...
has
...
an
...
idea
...
of
...
a
...
picture,
...
so
...
they
...
browse.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>
...
-
...
Mosaic
...
displays
...
random
...
pictures,
...
which
...
is
...
fast
...
for
...
sorting
...
and
...
fun
...
to
...
view.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
imagetext="photo
...
2.JPG
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo+2.JPG?version=1&modificationDate=1362716772000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo+2.JPG?version=1&modificationDate=1362716772000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><B>Step 3 </B></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>-User
...
is
...
not
...
sure
...
on
...
exact
...
specifics
...
of
...
picture,
...
but
...
has
...
an
...
idea
...
of
...
a
...
picture,
...
so
...
they
...
browse.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>
...
-
...
Mosaic
...
displays
...
random
...
pictures,
...
which
...
is
...
fast
...
for
...
sorting
...
and
...
fun
...
to
...
view.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
imagetext="photo
...
3.JPG
...
|border=1,width=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo+3.JPG?version=1&modificationDate=1362716880000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo+3.JPG?version=1&modificationDate=1362716880000"
...
style="border:
...
1px
...
solid
...
black"
...
width="300"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><B>Design
...
Highlights</B></P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Design's
...
overall
...
theme
...
is
...
for
...
someone
...
who
...
either
...
has
...
an
...
idea
...
for
...
the
...
content
...
they
...
want,
...
but
...
not
...
a
...
specific
...
picture
...
in
...
mind,
...
or
...
they
...
just
...
want
...
to
...
browse
...
for
...
personal
...
enjoyment.</LI><BR></BR><BR></BR>
...
<LI>Home
...
screen
...
is
...
designated
...
for
...
the
...
dealing
...
with
...
the
...
sharing
...
of
...
content
...
problem.
...
Gives
...
updates
...
on
...
recently
...
shared
...
items,
...
content
...
recently
...
added
...
by
...
spouse
...
and
...
access
...
to
...
child
...
profiles.</LI><BR></BR><BR></BR>
...
<LI>Still
...
allows
...
for
...
functionality
...
of
...
searching
...
for
...
specific
...
content
...
and
...
adding
...
new
...
content
...
(not
...
pictured).</LI><BR></BR><BR></BR>
...
</UL><P><BR></BR></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><B>Usability
...
Analysis</B></P><BR></BR><BR></BR>
...
<OL><BR></BR><BR></BR>
...
<LI>Learnability<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Simple
...
interface
...
in
...
terms
...
of
...
few
...
buttons
...
on
...
home
...
screen.
...
This
...
allows
...
the
...
users
...
to know precisely what they can do.</LI><BR></BR><BR></BR>
...
<LI>Mosaic
...
is
...
catchy
...
for
...
the
...
user.
...
They
...
are
...
likely
...
to
...
hover
...
over
...
it
...
with
...
mouse,
...
and
...
learn
...
more
...
about
...
its
...
functionality.
...
<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>We need to use this opportunity to inform them in some way.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Some
...
users
...
might
...
not
...
understand
...
the
...
mosaic
...
can
...
move
...
adding
...
new
...
pictures.
...
Arrows
...
try
...
to
...
convey
...
this
...
information.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Efficiency<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Showing
...
random
...
pictures
...
at
...
varying
...
sizes
...
allows
...
users
...
to
...
process
...
a
...
lot
...
of
...
data
...
at
...
once.
...
Clicking
...
on
...
picture
...
can
...
get
...
them
...
to
...
related
...
pictures.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Overall
...
process
...
is
...
geared
...
towards
...
browsing,
...
which
...
is
...
inefficient
...
if
...
the
...
user
...
has
...
a
...
specific
...
photo
...
in
...
mind.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Safety<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Users
...
are
...
processing
...
a
...
lot
...
of
...
data
...
at
...
once,
...
but
...
it
...
takes
...
a
...
click
...
to
...
actually
...
learn
...
more,
...
not
...
just
...
a
...
simple
...
hover.</LI><BR></BR><BR></BR>
...
<LI>Pressing
...
escape
...
or
...
clicking
...
outside
...
scope
...
of
...
sharing/larger
...
view
...
window
...
goes
...
back
...
to
...
mosaic
...
(easy
...
to
...
undo
...
mistake)</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pictures
...
are
...
close
...
together
...
for
...
the
...
mosaic
...
and
...
user
...
could
...
potentially
...
click
...
on
...
wrong
...
photo.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</OL><P></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H2><A
...
name="GR2-Design2"></A>Design
...
2</H2><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H2><A
...
name="GR2-%21sketch.pngborder%3D1%21"></A><IMG
...
imagetext="sketch.png
...
|border=1"
...
mce_src="../../../../../../../../../download/attachments/86269860/sketch.png?version=1&modificationDate=1362724169000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/sketch.png?version=1&modificationDate=1362724169000"
...
style="border:
...
1px
...
solid
...
black"></IMG></H2><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Step
...
1</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>
...
-
...
user
...
wants
...
to
...
find
...
pictures
...
of
...
a
...
birthday
...
party.
...
The
...
user
...
logs
...
on,
...
and
...
is
...
able
...
to
...
see
...
recently
...
added/shared
...
pictures
...
from
...
their
...
spouse,
...
as
...
well
...
as
...
the
...
state
...
of
...
devices
...
that
...
upload
...
to
...
the
...
site.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Step
...
2</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>
...
-
...
The
...
user
...
is
...
able
...
to
...
search
...
for
...
pictures
...
and
...
select
...
the
...
ones
...
they
...
would
...
like
...
to
...
share.</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Step
...
3</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>
...
-
...
The
...
user
...
chooses
...
who
...
they
...
would
...
like
...
to
...
share
...
with.
...
</P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Usability
...
Analysis</P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Learnability<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>brings
...
user
...
through
...
a
...
very
...
straightforward
...
progression
...
of
...
finding
...
and
...
sharing
...
content</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI> does not indicate the possibility for other use cases, which could confuse the user if this is not what they are trying to do</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Efficiency<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>brings
...
user
...
through
...
a
...
very
...
straightforward
...
progression
...
of
...
finding
...
and
...
sharing
...
content
...
with
...
no
...
wasted
...
steps</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>is
...
directly
...
intended
...
for
...
this
...
use
...
case;
...
will
...
not
...
be
...
efficient
...
for
...
browsing
...
and
...
other
...
uses</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Safety<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Users
...
can
...
progress
...
through
...
steps,
...
but
...
also
...
easily
...
go
...
back
...
steps
...
if
...
they
...
want
...
to
...
make
...
changes.</LI><BR></BR><BR></BR>
...
<LI>The
...
effects
...
of
...
the
...
user's
...
actions
...
on
...
one
...
step
...
are
...
shown
...
on
...
the
...
next.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>needs
...
better
...
indication
...
of
...
search
...
toggling
...
between
...
recent
...
added/uploaded
...
and
...
all
...
content</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><P></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<H2><A
...
name="GR2-Design3"></A>Design
...
3</H2><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Step
...
1</P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>User
...
wants
...
to
...
share
...
pictures
...
and
...
has
...
phone
...
to
...
do
...
so.</LI><BR></BR><BR></BR>
...
</UL><P></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
height="300"
...
imagetext="photo.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/photo.jpg?version=2&modificationDate=1362721887000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/photo.jpg?version=2&modificationDate=1362721887000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Step
...
2</P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>This
...
version
...
defaults
...
to
...
showing
...
the
...
most
...
recent
...
content.</LI><BR></BR><BR></BR>
...
</UL><P></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
height="300"
...
imagetext="fuck_this_photo_1.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/fuck_this_photo_1.jpg?version=1&modificationDate=1362722368000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/fuck_this_photo_1.jpg?version=1&modificationDate=1362722368000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Step
...
3</P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>User
...
can
...
switch
...
to
...
selecting
...
a
...
particular
...
date
...
on
...
which
...
the
...
content
...
was
...
captured.</LI><BR></BR><BR></BR>
...
</UL><P></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
height="300"
...
imagetext="fuck_this_photo_2.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/fuck_this_photo_2.jpg?version=1&modificationDate=1362722207000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/fuck_this_photo_2.jpg?version=1&modificationDate=1362722207000"
...
style="border:
...
1px
...
solid
...
black"></IMG></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P>Step
...
4</P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Once
...
a
...
specific
...
date
...
is
...
set,
...
the
...
User
...
can
...
now
...
see
...
that
...
in
...
fact
...
there
...
are
...
pictures
...
and
...
can
...
choose
...
which
...
one
...
to
...
share.</LI><BR></BR><BR></BR>
...
<LI>Sharing
...
is
...
possible
...
through
...
...
or
...
a
...
link
...
to
...
the picture </LI><BR></BR><BR></BR>
...
</UL><P></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><IMG
...
height="300"
...
imagetext="fuck_this_fuck.jpg
...
|border=1,height=300"
...
mce_src="../../../../../../../../../download/attachments/86269860/fuck_this_fuck.jpg?version=1&modificationDate=1362722268000"
...
mce_style="border:
...
1px
...
solid
...
black"
...
src="/confluence/download/attachments/86269860/fuck_this_fuck.jpg?version=1&modificationDate=1362722268000"
...
style="border:
...
1px
...
solid
...
black"></IMG><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR><BR></BR>
...
<B>Design
...
Highlights</B>:</P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Judicious
...
use
...
of
...
screen
...
space
...
due
...
to
...
smaller
...
size</LI><BR></BR><BR></BR>
...
<LI>This
...
led
...
to
...
less
...
and
...
simpler
...
features
...
i.e.
...
focusing
...
on
...
dates
...
only</LI><BR></BR><BR></BR>
...
</UL><P></P>
...
<P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR></P>
...
<P></P><P
...
mce_style="display:none"
...
style="display:none"
...
user="true"><BR></BR><BR></BR><BR></BR><BR></BR></P><BR></BR><BR></BR>
...
<P><B>Usability
...
Analysis</B></P><BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Learnability<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Text
...
boxes
...
are labeled indicating their function.</LI><BR></BR><BR></BR>
...
<LI>Links
...
and
...
buttons
...
should
...
have
...
the
...
proper
...
affordances
...
to
...
indicate
...
their
...
uses</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI> Depending on the affordances of the pictures in the recent view, it might not be clear what happens when you click either of them. When you click a picture, it might be reasonable to bring up the specific picture or the view of all pictures on that date. How to make that clearer should be considered in future iterations.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Efficiency<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>The
...
efficiency
...
of
...
this
...
interface
...
stems
...
mostly
...
from
...
the
...
anticipation
...
of
...
user
...
needs.
...
The
...
"Recent"
...
tab
...
provides
...
immediate
...
access
...
to
...
more
...
current
...
content
...
which
...
is
...
presumably
...
used
...
more.
...
Also,
...
the
...
buttons
...
to
...
...
or
...
copy
...
or
...
the
...
pictures
...
link
...
are
...
located
...
next
...
to
...
the
...
picture
...
themselves
...
as
...
tasks
...
commonly
...
following
...
viewing
...
a
...
picture
...
or
...
video.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Unfortunately,
...
if
...
many
...
pictures
...
occur
...
on
...
the
...
same
...
day,
...
the
...
user
...
would
...
potentially
...
have
...
to
...
scroll
...
through
...
all
...
of
...
them
...
if
...
searching
...
for
...
something
...
in
...
particular.
...
While
...
this
...
is
...
better
...
than
...
simply
...
searching
...
through
...
all
...
pictures,
...
it
...
is
...
something
...
to
...
improve
...
in
...
future
...
iterations.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Safety<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>Pros<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>The
...
different
...
modes
...
for
...
simply
...
viewing
...
recent
...
pictures
...
versus
...
those
...
from
...
a
...
specific
...
date
...
are
...
clearly
...
demarcated
...
using
...
the
...
visible
...
tabs
...
at
...
the
...
top,
...
hopefully
...
minimizing
...
mode
...
errors.</LI><BR></BR><BR></BR>
...
</UL><BR></BR><BR></BR>
...
</LI><BR></BR><BR></BR>
...
<LI>Cons<BR></BR><BR></BR>
...
<UL><BR></BR><BR></BR>
...
<LI>If
...
the
...
date
...
you
...
entered
...
is
...
not
...
exactly
...
correct,
...
no
...
content
...
will
...
be
...
showed
...
at
...
all.
...
Perhaps
...
using
...
a
...
date
...
range
...
would
...
be
...
more
...
effective
...
and
...
safer.
...
This,
...
however,
...
presents
...
some
...
ambiguity
...
because
...
when
...
people
...
must
...
confirm
...
the
...
<EM>absence</
...
EM> of a picture,
...
they
...
might
...
rely
...
on
...
this
...
flexibility
...
and
...
incorrectly
...
interpret
...
it
...
doesn't
...
exist.
...
But
...
this
...
current
...
design
...
is
...
unforgiving
...
in
...
selecting
...
the
...
wrong
...
date.</LI><BR></BR><BR></BR>