evoto - research and development.pdf

Upload: raycheung

Post on 01-Jun-2018

237 views

Category:

Documents


0 download

TRANSCRIPT

  • 8/9/2019 Evoto - Research and Development.pdf

    1/40

    RAY CHEUNG

    Evoto - Research and Development

    SEARCH

  • 8/9/2019 Evoto - Research and Development.pdf

    2/40

    SEARCHSTARTING POINT

    Combinin interests

    Initially my idea bean quite vaue,

    with no real sense of direction other

    than wantin to combine several

    interests of mine. Ive always had

    a fascination with abstraction and

    diital desin and at first I wanted to

    take a more illustrative approach of

    transformin photos into alternative

    forms and shapes.

    An app?

    At the same time I

    also wanted to explore

    brandin in more depth.

    Combinin my

    illustration and brandin

    interests, this prompted

    the idea of explorin

    interaction app desin.

    The resultin initial idea

    was an app that would

    allow users to take

    aspects from a photo

    and make new formswith them, to be shared

    with others.

    01

  • 8/9/2019 Evoto - Research and Development.pdf

    3/40

    SEARCHCHANGE

    Orbs

    I was particularly intriued with the

    idea of a circular form as the rounded

    shape would allow for more dynamic

    alterations. From here I bean

    considerin if these rounded forms

    could be used as a raphic statistic for

    the photo, rowin in size dependin

    on several factors.

    02

    Brian Enos 77 Million Paintings was

    a particularly interestin concept

    that held relevance to my idea of

    transformation. Perhaps the app could

    randomly enerate a raphic form

    based on the photo which could then

    morph and chane in many ways.

    https://www.youtube.com/watch?v=W1dXFn_z9vAhttps://www.youtube.com/watch%3Fv%3DW1dXFn_z9vA
  • 8/9/2019 Evoto - Research and Development.pdf

    4/40

    SEARCHHOW

    03

    What to do?

    Thins bean to et a bit confusin.

    It seemed a trade off between

    practicality of the app and my

    own interests in makin abstract

    visualisations had to be considered.

    It was clear more research needed

    to be conducted to et a stroner

    understandin of what I wanted to do.

    The Problem

    The round orb would be both a piece

    of illustration and a statistic for the

    oriinal photo. Realistically however

    it would be difficult to desin refined

    forms for each photo and make it a

    user friendly automated process.

  • 8/9/2019 Evoto - Research and Development.pdf

    5/40

    SEARCHRESEARCH

    04

    The most grandiose result of the photography

    enterprise is to give us the sense that we can

    hold the whole world in our heads as ananthology of images.

    To collect photographs is to collect the world.

    (Sontag, 1979)

    What I learnt helped

    tremendously. In some ways

    photoraphs could be seen as

    offerin the ability to collect

    parts of the world and show

    control over the past.

    They could also be seen as

    experiences iven form and

    miniatures of reality that

    anyone can make or acquire.

    An idea that was raised in

    a feedback session was

    that I should consider the

    wider meanins behind

    photoraphy and their emotive

    experiences. To do so I looked

    at Susan Sontas book, On

    Photography.

    From here I wanted to develop

    the app with a focus on

    networkin and the sharin of

    memories. Yet this had to be

    done in a unique way unlike

    other photo apps.

    Could photoraphs function

    not only as a static form, but to

    further persuade the creation

    of memories?

  • 8/9/2019 Evoto - Research and Development.pdf

    6/40

    SEARCHRESEARCH pt.2

    05

    But even more importantly, you need to know

    how to create a visual narrave.

    You need to know how to tell a story.(Grin, 2008)

    To elaborate, what if there was

    a way for photos to be used as

    an inition for other photos?

    For example if the user views

    the network of a friends

    holiday where they found a

    rare animal, this miht remind

    them of a photo they took of

    the same animal in another

    country. From there it could

    branch off to show a celebrity

    they encountered whilst in that

    country. These were all quick

    examples but it held a lot of

    potential. In turn the rowth

    of these stories could retain

    the oriinal imae yet result

    in a widely expandin visual

    network of memories.

    It would not be unjustified to

    consider photoraphs as a

    form of narrative. A method

    of sharin memories and

    experiences. David Griffin

    makes a stron point that

    photos tell stories. This heavily

    influenced my concept of

    creatin an app that takes

    these stories and forms a

    visual conversation around it.

    http://www.ted.com/talks/david_griffin_on_how_photography_connects%3Fembed%3Dtrue
  • 8/9/2019 Evoto - Research and Development.pdf

    7/40

    SEARCHRESEARCH pt.3

    06

    I was not going to Honolulu because I wanted

    to see life reduced to a short story. I was

    going to Honolulu because I wanted to see life

    expanded to a novel, and I sll do.(Didion, 2009)

    Usin Didions quote, If photoraphs are indeed

    short stories based on another persons life and

    experiences, then what I am proposin with my

    app desin is a way for people to take the story

    and build upon it with their own experiences

    and memories, creatin a new and rowin

    larer novel. Another example is this, imaine

    tellin a story around a warm campfire and not

    knowin where the conversation wi ll take you,

    but alon the way a whole rane of stories are

    shared. This campfire is your personal space

    and each photo taken builds a new campfire

    with new listeners sittin around it. I felt there

    was a lot of potential that had been untouched

    in the social photo app reion and my concept

    could fill that ap.

    http://www.ted.com/talks/david_griffin_on_how_photography_connects%3Fembed%3Dtrue
  • 8/9/2019 Evoto - Research and Development.pdf

    8/40

    SEARCHRESEARCH pt.4

    07

    With my storytellin

    networkin idea firmly set, I

    bean researchin existin

    apps not entirely related tophotoraphy, but to develop

    a better understandin of the

    visual and functional aspects I

    would need to consider.

    I chose the Yota Play app

    initially as it demonstrated

    how layout can be used

    to divert user attention tointeractive elements on the

    screen. In par ticular however,

    a noticeable detail was the

    usae of radients over many

    of the buttons. This led me to

    look in more depth into the

    desin of the app.

    Yota Play iPhone App

    Desiner: AllofUs

    Sept. 23, 2011

  • 8/9/2019 Evoto - Research and Development.pdf

    9/40

    SEARCHRESEARCH pt.5

    08

    With my networkin idea

    in development, I bean

    researchin existin apps

    perhaps not entirely related tophotoraphy, but to develop

    a better understandin of the

    visual and functional aspects I

    would need to consider.

    Yota Play Update

    Desiner:

    Derek Boaten + Richard Sullivan

    2013

    NEW

    What I discovered was an

    updated brandin and UI of

    the Yota app in recent years.

    This drew reat attention

    to the visual development

    and trends that had radically

    chaned app development

    over the past few years.

    Instead of radients to

    simulate depth and response,

    the new desin featured a

    much simpler and flatter

    desin. Less text was used

    on naviational elements and

    a sense of minimalism was

    applied, creatin a cleaner

    overall feel.

  • 8/9/2019 Evoto - Research and Development.pdf

    10/40

    SEARCHRESEARCH pt.6

    09

    Vital iPhone App

    Desiner:

    Swipe Studio

    December, 2013

    To explore the current trends

    within app desin further, I

    bean lookin at Vital. Vital

    functions by displayin an

    abstract flower which rows

    as a sense of achievement for

    reachin activity oals. Visually

    the desin uses a flat schemeof briht colours that creates

    a friendly feel. It became clear

    that more apps in recent years

    have adapted to the rowin

    trend of simpler desin with

    less clutter and unnecessary

    desin elements.

  • 8/9/2019 Evoto - Research and Development.pdf

    11/40

    SEARCHRESEARCH pt.7

    10

    Skeuomorphic vs Flat

    Upon further research, the

    Skeuomorphic vs Flat desin

    debate was a lare topic

    within recent times. Whilst the

    trend of flat desin had rown

    rapidly, it was important to my

    app development to research

    into what caused the transition,

    as this would offer insiht into

    why the wider audience has

    opted for this new style.

    Skeuomorphic seems to refer to the creation of details and

    objects made to appear similar to its real life counterpart.

    Up until the sure of the flat desin trend, skeuomorphic was

    widely popular. The sure of flat desin seems to come from a

    wider lobal audience of users with smart phones, an extension

    of minimalism. As more people become accustomed to usin

    their device, the less trim and excess is required to operate the

    functions. Perhaps the most important aspect is that a cleaner

    more simpler style appeals to a wider audience whilst still beinvisually pleasin and functionally capable.

    However it would have been reckless to immediately consider flat desin as the

    best visual style for my app. My priority was instead to consider the best way to

    make the app functionally effective. From here, I could then consider the best

    visual style suited for my taret audience of a modern eneration and to ensure

    the brand worked in harmony. As a result, flat desin was an influence but in no

    means a straihtforward solution for what I wanted to produce.

    Pros and Cons of Flat

    Potentially dull

    Simple and clean

  • 8/9/2019 Evoto - Research and Development.pdf

    12/40

    SEARCHNAME TEST

    11

    At the time my concept was still focused on morphin the photos into an

    alternate illustrative object. The name needed to capture the key aspects of the

    app, ranin from rowth and chane of the orbs to bein clear that it was a

    photoraphic app. A balance had to be found between bein too literal and dull, ortoo abstract and confusin. The result was a combination of three details.

    More -

    The idea of expansion and

    the addictive nature of

    photoraphy.

    Morph -

    A transformation of the photo

    into a raphic new shape.

    Photo-

    As an app the name also

    needed to be clear of itspurpose and function.

  • 8/9/2019 Evoto - Research and Development.pdf

    13/40

    SEARCHFEEDBACK

    12

    To ather feedback on Morphoto I asked 30

    people within the aes of 17 to 25. Around 75%

    felt the name needed improvement and that it

    did not ive off the correct messae that I had

    oriinally planned. This made me reconsider

    not only the name, but also to rethink whomy app was aimed at and what I wanted to

    communicate throuh the overall brandin.

    75%

    Felt the name was not

    effective

    New oals

    Modern

    FriendlySophisticated

    Simple to use

    Both enders

    Needs to be visually up to date

    and suited for a eneration of

    technoloy users.

    Prioritise usability, the user

    should not have to strule

    with the apps functions.

    Overall the brandin should

    come across as friendly andnot too serious. It should also

    be aimed at a youn adult

    audience so it must retain an

    element of sophistication.

  • 8/9/2019 Evoto - Research and Development.pdf

    14/40

    SEARCHBRAND NAME

    13

    Havin established who my appwas aimed at,

    I needed to consider a new name. It was at this

    point that I moved away from the abstract form

    idea and wanted to focus more on function

    and the rowth of a memory network. Instead,whilst the aspect of rowth would still be there,

    the focus would not be on morphin the photo

    into an illustrative form. The new name had to

    reflect a modern approach with a fun side. The

    result: Evoto. A short and snappy combination

    of evolution to show the constantly rowin

    nature of the network, evoke to represent the

    recallin of memories and photo to tie it all up.

  • 8/9/2019 Evoto - Research and Development.pdf

    15/40

    SEARCHNAME DEVELOP

    14

    Yet a name alone would

    not be enouh. Many other

    details such as typoraphy

    and colour needed to be

    considered. A number ofsketches helped to enerate a

    basic idea for the typoraphy.

    From here I considered a

    number of existin typefaces

    and analysed the feel they

    communicated and whether it

    was appropriate for my brand.

    Because of my established

    oals for the app, I felt a sans-

    serif typeface with a rounded

    appearance would be best

    suited for the name.

  • 8/9/2019 Evoto - Research and Development.pdf

    16/40

    SEARCHTYPEFACE

    15

    After consideration of a

    number of typefaces, I decided

    upon a lowercase usae of

    Bariol as it synerised with my

    oals entirely. The rounded

    appearance complimented

    the visual style of the apps

    assets and details whilst

    ivin off a friendly feel. As a

    result the font also ives off

    a sophisticated and modern

    appearance. Makin the

    decision became a sum of

    realisin what the brand was

    tryin to communicate and to

    the specific taret audience.

  • 8/9/2019 Evoto - Research and Development.pdf

    17/40

    SEARCHLOGO RESEARCH

    16

    Client: The Poets

    Desiner:

    Jeroen van Eerden

    2013

    I found this particular loo

    effective in that it clearly

    indicates its intentions in

    a clever way. The camera

    shape is presented throuh a

    continuous line, representin

    the unity of a marriae.

    The colours also help to

    communicate a feelin of

    warmth by usin a warm red/

    pink. These indications all

    demonstrate how a loo can

    deliver many meanins in onesmall fiure.

    Instaram

    Desiner:

    Mackey Saturday

    2013

    Overall the loo for Instaram

    demonstrates a fun and

    playful approach, usin a

    script typeface whilst keepina professional approach. The

    blue colour also suests a

    universal approach that is both

    safe and calm.

    It was vital to understand how existin loos

    can be broken down and what values the details

    represented. These examples showcase how

    colour, shape and typoraphy can be used to

    represent the overall brand. This is an important

    step that needs attention as deliverin the

    wron loo combination could disrupt the entire

    feel of the brand.

    17

  • 8/9/2019 Evoto - Research and Development.pdf

    18/40

    SEARCHLOGO IDEAS

    17

    Similarly to the name, the loo also had to be

    relevant, almost like a clever clue. A common

    theme was the usae of linkin circles which

    represented almost all three details of my app,

    rowth, photoraphy and connectin whilst

    bein friendly in appearance. My initial ideas

    were quite abstract and minimal, althouh what

    I needed to keep in mind was that the loo

    needed to be simple and understandable, yet

    clever and meaninful. Makin the distinctionthat the brand was for an app made it so some

    of the initial sketch ideas were not reasonable.

    18

  • 8/9/2019 Evoto - Research and Development.pdf

    19/40

    SEARCHLOGO DEVELOP

    18

    Friendly

    This was visualised

    throuh the smile formed

    by connectin shapestoether.

    Social hih five!

    In combination with the

    smile, the outstretched

    arms reachin toetherand the circles represent

    the social aspect of the

    app. The hands meetin

    toether in the centre acts

    as both a hih-five and

    the idea of expandin a

    network of photos.

    Photoraphy

    Whilst the loo itself was

    quite abstract, I needed to

    use a visual that clearlyshowed the photoraphic

    nature of the app. For this

    I used the upper part to

    visualise a camera frame

    without detractin from

    the existin elements.

    A more literal approach on

    this loo development, whilst

    still bein visually interestin.

    Overall it had to be liht

    hearted, easy to reproduce

    and should communicate the

    various parts of my brand.

    19

  • 8/9/2019 Evoto - Research and Development.pdf

    20/40

    SEARCHLOGO OUTLINE

    19

    Usin circles

    When constructin theloo I found it easier to

    work with circles. The

    usae of rounded shapes

    also helped to create a

    friendlier feel opposed to

    usin sharp corners.

    20

  • 8/9/2019 Evoto - Research and Development.pdf

    21/40

    SEARCHAPPLY COLOUR

    20

    Choosin the colour combo

    The colour scheme was heavily

    influenced by rowth and chane, usin

    an orane to show excitement. The

    usae of a dark rey also helps to retain

    a modern and sophisticated feel, aimed

    at the taret audience. Alon the way I

    also considered the importance of colour

    application and its powerful effects.

    The above example showcases a colour

    scheme that would not be appropriate as

    it specifically tarets a particular ender.

    21

  • 8/9/2019 Evoto - Research and Development.pdf

    22/40

    SEARCHPROFILE

    21

    Perhaps the biest step from here was

    applyin my established brandin to parts of

    the app. I had to not only consider how it would

    appear, but also how it would feel to use. The

    sketches allowed me to map out wireframes

    for naviation and placement of features. The

    app would function upon 4 main areas: Home,

    Discover, Camera and Profile.

    From my sketches I bean experimentin with

    layout. Workin on a small 640x1136 resolution

    was difficult and unusual at first. However once

    a list of features was made for the profile, it

    became easier to focus upon the visual style

    and UI components. As with the name andloo, visual consistency was important to

    maintain throuhout the desinin stae. Whilst

    at first lance it miht not appear completely

    innovative, a balance needed to be found with

    practicality and experimentation. From the

    profile the user can naviate to their friends,

    favourites and evoplies. Also they can quickly

    view recent photos. Desin wise the profile had

    to be a visually pleasin area that felt personal

    to each and every user.

    22

  • 8/9/2019 Evoto - Research and Development.pdf

    23/40

    SEARCHNAVIGATION

    22

    Usin a 10 column rid was important as an unalined

    appearance would not only hamper the visual appearance but

    miht also dissuade the user from enjoyin the usae of the app.

    For naviation I decided

    to consider a number of

    approaches, comin down

    to balancin appearance

    and functionality. In the left

    example the user is provided

    a sleeker interface and an

    emphasis on viewin the

    profile alone. I found the

    downside would be that theuser is required to press two

    buttons in a location at the top,

    instead of the usual bottom

    row. With the riht example I

    took a lihter tone. I felt the

    overall desin of this example

    was not effective due to the

    spacin of the icons and the

    positionin of the naviation.

    23

  • 8/9/2019 Evoto - Research and Development.pdf

    24/40

    SEARCHFINE TUNING

    23

    Avoid usin the

    same colour in

    both interactive and

    noninteractive elements.

    This is also another vital

    step that is important to

    consider. In the case of

    my app I have used the

    orane to indicate areas

    to be interacted with. This

    contrasts with the ray

    or white and helps to

    emphasise certain areas.

    Incorporate a brands

    assets in a refined,

    unobtrusive way.

    Make sure all styles of a

    custom font are leible

    at different sizes.

    Give tappable controls a

    hit taret of about 44 x

    44 point

    Usin rounded typoraphy

    and a distinctive orane,

    ray and white were key

    details that stay true to

    the Evoto brand.

    For my app I have been

    usin the Bariol font at

    36pt Bold for the profile

    and lare headers or

    areas that attention

    should be diverted to.

    24pt Reular is used for

    smaller detailin, with

    18pt Reular or Bold for

    body text.

    The imae on the riht

    shows how each element

    of interaction is at least

    44x44pt/px (72dpi) and

    as a result ensures the

    user can safely click on

    each element.

    It was important that I did my

    research on the specifications

    for iOS app desin. These

    few rules helped to tune the

    desin for usability, aimed at

    providin a natural and easy

    user experience.

    24

  • 8/9/2019 Evoto - Research and Development.pdf

    25/40

    SEARCHPROFILE

    24

    Desinin the visual interface

    for the profile requiredconsideration of the brand

    as a whole alonside the end

    users needs. I approached

    the desin with the idea of

    creatin a space that is both

    easy to naviate and personal

    to the user. The positionin

    of the friends, favourites

    and evoply counters were

    positioned within the Evoto-

    sinature rounded shape with

    a darker layer beneath toremain easily visible and easy

    to understand. From here the

    user is able to view their recent

    photoraphs in a allery like

    style which pays tribute to

    existin photo apps, but also

    acts as a stylistic expansion of

    their memories in a clean and

    minimal style.

    25

  • 8/9/2019 Evoto - Research and Development.pdf

    26/40

    SEARCHCAM RESEARCH

    25

    When considerin how to desin the interface

    for the camera app, a priority is makin sure the

    buttons and functions were in a reconisable

    location. As most users are familiar with

    existin smartphone camera apps, analysin

    existin desins would provide insiht into how

    each part is desined. For both Instaram and

    the iOS7 camera app, the buttons are placed

    towards the bottom of the interface within

    easy reach of the user. This seems like the

    most practical and effective choice as other

    alternatives have downsides. In this scenario

    then, it is clear that a priority of function overform is necessary.

    26

  • 8/9/2019 Evoto - Research and Development.pdf

    27/40

    SEARCHVERSION ONE

    When it came down to

    developin the interface,

    it did not seem practical

    to use opacity and empty

    space in the same way as

    the profile. Usin a flat dark

    colour scheme would instead

    provide an interface that

    visually contrasts with the

    orane and white buttons,

    allowin the user to focus on

    the important job of takin

    the photo. Adjustments were

    also made to adhere to the

    friendly rounded and modern

    visual style. This can be seen

    at the centre bottom which

    uses a rounded appearance tonot only draw attention to the

    main function but to add more

    interest to the overall desin.

    27

  • 8/9/2019 Evoto - Research and Development.pdf

    28/40

    SEARCHFINAL CAMERA

    However with the current camera desin I

    did not feel it fulfilled its potential. Whilst it

    executed its intended function there was more

    room to experiment. I decided to redesin the

    interface with a different approach that used

    less block rey, shiftin away from an entirely

    flat approach. This new desin uses a balance

    between function and style, with a definin

    ability bein able to dra the edes down to

    create Evoplies. These Evoplies are the definin

    aspects of the network function of the app.

    Enablin the button in the top riht activates

    and deactivates the create evoply system. This

    ensures the user has a choice in whether they

    want to take a reular photo or both an Evoply

    and a photo.

    Click to view animation

    28

    http://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/final.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/final.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/final.gif
  • 8/9/2019 Evoto - Research and Development.pdf

    29/40

    SEARCHINITIAL HOME

    The homepae is the hub of the app. Functionally it delivers a

    news feed of what has been posted by friends. This is separate

    from the Evoply system and would behave in a traditional

    manner suited to social media sharin. The priorities here were

    to make the photoraphs the key detail. A lare space reserved

    for the photo would make this happen, whilst not sacrificin any

    other functions.

    29

  • 8/9/2019 Evoto - Research and Development.pdf

    30/40

    SEARCHHOMEPAGEThe visual consistency needed to be clear as

    this location would be where the user spends a

    lot of their time. Every detail had to be alined

    perfectly with extra care for considerin the

    taret audience. From here the user can like,

    comment and evoply whilst not distractin from

    the primary purpose of viewin whats been

    posted recently by friends.

    30

  • 8/9/2019 Evoto - Research and Development.pdf

    31/40

    SEARCHFINAL HOME

    In reflection the homepae

    succeeded in expressin

    the intended messae

    of the brand. The user

    receives a sleek and refined

    interface with an emphasis

    on the important part; the

    sharin of photoraphs. Thedesin carries a sense of

    sophistication whilst not bein

    too serious which was vital for

    the overall app desin.

    Click to view animation

    31

    http://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/HOMEPAGE-WITH-IPHONE-FINISHED-640-1136.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/HOMEPAGE-WITH-IPHONE-FINISHED-640-1136.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/HOMEPAGE-WITH-IPHONE-FINISHED-640-1136.gif
  • 8/9/2019 Evoto - Research and Development.pdf

    32/40

    SEARCHDISCOVER

    The next step was to desin the key point of

    the app, the networkin function. A number

    of different concepts were considered but an

    overall decision was made to opt for a more

    simpler and universal desin as shown to the

    riht, focusin on networkin and dynamic

    naviation of connectin photoraphs. This is

    also where user interaction would be prioritised,

    makin it an experience that is both easy and

    enjoyable for the end user.

    32

  • 8/9/2019 Evoto - Research and Development.pdf

    33/40

    SEARCHFUNCTION

    My approach for this section

    of the app was to present a

    visual way of explorin the

    evoplies (photoraphic replies

    that chane and branch out).

    Tappin on the centre photowould take you to a pop up

    showin more details, whilst

    tappin on the surroundin

    evoplies naviates towards

    that owners photo network. By

    doin so the user can explore

    a branchin network (almost

    like a mindmap) of new

    memories and photos with the

    allure of watchin the evoplies

    chane and row.

    Click to view animation

    33

    http://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/New-Animation-23.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/New-Animation-23.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/New-Animation-23.gif
  • 8/9/2019 Evoto - Research and Development.pdf

    34/40

    SEARCHREFINE

    Whilst the basic form of

    the network had been

    set, a lot of tweakin

    had to be done to make

    sure the interface was

    functional. This included

    considerin usae of

    colour, spacin and the

    positionin of interactiveelements. Overall

    the desin had to be

    visually interestin whilst

    maintainin focus on the

    upper half of the screen.

    34

  • 8/9/2019 Evoto - Research and Development.pdf

    35/40

    SEARCHGROW

    To add a visual indication

    without clutterin the

    naviational space, I decided

    to manipulate the Evoplies

    in terms of size. This chane

    is subtle yet makes it easier

    to determine which photo

    is receivin attention. This

    decision was made for thesame oals as the overall

    brand, to focus attention on

    the photoraphic network

    alonside the evolvin state of

    each personal photo space.

    Scalin

    A maximum limit of175% the oriinal size

    will maintain balance and

    prevent the space from

    bein too overwhelmed.

    35

  • 8/9/2019 Evoto - Research and Development.pdf

    36/40

    SEARCHANIMATION

    From a technical standpoint the animation

    of the network had to be very clear and

    understandable. I decided to learn After Effects

    in order to create a more detailed animation

    for the swap and naviation functions. It was

    a difficult learnin experience as I struled

    with the manipulation and timins of a vast

    number of Photoshop layers. However in the

    end the GIF colour restriction did not allow meto use both animations. Returnin to Photoshop

    animations was my best option but definitely

    set the roundwork for developin my After

    Effects skills in the future.

    Animation for Swap

    Animation for Naviation

    36

    http://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/Final-Swap1.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/under-10.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/under-10.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/under-10.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/Final-Swap1.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/Final-Swap1.gif
  • 8/9/2019 Evoto - Research and Development.pdf

    37/40

    SEARCHADJUSTMENTS

    Returnin to the main desin

    I made a few adjustments to

    brin the visual closer to the

    concept of bein an enjoyable

    environment to discover new

    photoraphs. This meantalterin areas that felt bland

    and tweakin other areas.

    Brihter backround adds a

    more excitin visual ambience

    Removal of unnecessary lines

    that were previously used to

    create focal attention

    Very sliht drop shadows addmore depth and hierarchy

    37

  • 8/9/2019 Evoto - Research and Development.pdf

    38/40

    SEARCHFINAL DISCOVER

    Swap Animation

    Naviation Animation

    To summarise, the evoply system is a new

    option that allows users to share a photoraph

    in the form of an evoply that is related to what

    they are currently viewin. Throuh this the

    sharin of a photo is no loner a flat process,

    but one that comes alive and sparks off other

    experiences and memories.

    http://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/Swap-final.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/FINAL-NAVIGATION-PROPER.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/FINAL-NAVIGATION-PROPER.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/FINAL-NAVIGATION-PROPER.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/Swap-final.gifhttp://raycheung.gd.socd.io/wp-content/uploads/sites/114/2014/03/Swap-final.gif
  • 8/9/2019 Evoto - Research and Development.pdf

    39/40

    evoto

  • 8/9/2019 Evoto - Research and Development.pdf

    40/40

    Heading into this project I had a much clearer understanding of my posioning,

    strengths and weaknesses. Yet perhaps the most daunng step for me was deciding todesign an app, something I had never done before. It became a new learning experienceinto an area that had so much depth and detail but I feel I managed to pull through.Through a combinaon of areas I loved working in, both digital and branding, I inially

    spent a long me considering just what it was my app would focus on as it needed tohave a unique air to it. However aer researching into a random area in which I did nothave much experience in, I learnt of just how much depth there was to photography and

    the sll world and memories they capture.

    From here I began to build my concept from the ground up, starng with the idea thatwhilst tradionally photos can create stories and therefore responses, they have not

    been considered in the app format as visual conversaon starters to be responded withthrough photos, just like a telling of unpredictable and excing stories sing with agroup of friends.

    I began the branding process aer inial research and it was quite dicult from what Iwas used to in the past. However aer strongly establishing that my app was aimed ata modern, broad audience of both genders and a young adult age group, I decided upon

    a visual style that would be suitable by using a bold and smulang orange alongside asophiscated gray. The most excing part once I had my branding set was making sureeach part of the app was consistent, making sure to fully manipulate graphic elements

    appropriately.

    Feedback was an important part of the process and it helped a lot in making sure mydecision choices were sll in line with my target audience. Gathering feedback from the

    group of 30, 15-25 year olds was even more important as my app did not have a physicalform and instead would require extra care to ensure the user could understand how itwould operate.

    To further reect I feel there could be room for improving the animaon quality, creangmore transions once I had a stronger technical capability in that area. I had set thegroundwork by learning the basics of Aer Eects and this could open up potenal in

    the future for more web based work and design. Understanding how to manipulate a

    variety of the Adobe sowares was also a strong learning experience by choosing theappropriate program for each secon.

    To summarise, this project has been a crucial stepping stone for me, not only asa culminaon of my learning over the years, but as a personal achievement in mycondence to create work that I am proud of. Ive been told that my work in the past

    has been visually quite strong but this has always been let down by my inability torealise that and take pride in it. However with the compleon of this project, I now havea stronger belief in myself to output work whilst being considerate of many importantdesign details such as research and the target audience.

    SEARCHEVALUATION