Published on

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • (Steve)Introduces the group and the application.
  • (Carl) A slide to highlight that we have reviewed our requirements and taken them into consideration whilst moving onto the Hi-fi prototyping.
  • (Craig)Taking into account the feedback we were given from our last presentation, and why it is important to integrate this.
  • (Jim) Scenario needs to be re-addressed and show how the user uses the application in the hi-fi prototype to complete the task
  • User visits the culture cow website on a browser on a computer. The user has to visit the site on his mobile to start using the application.
  • Craig
  • Jim
  • Carl
  • Steve
  • Craig
  • Jim
  • Carl
  • Steve
  • Craig
  • Jim
  • Carl
  • Steve
  • Craig
  • Jim
  • Carl
  • Steve
  • Craig
  • Jim
  • Carl
  • Craig
  • The final version of the developed application. (Steve)
  • (Jim)
  • (Craig)
  • (Carl)
  • (Steve)
  • Negative – CarlPositive - Steve
  • 1st Col (Craig)2nd Col (Jim)
  • Steve
  • Presentation2

    1. 1.
    2. 2. Requirements<br />Functional<br />Encourage social and cultural interaction through Culture Cow character.<br />Allow users to ‘feed’ and ‘find’ videos, recipes, stories and pictures for sharing.<br />Gain happiness points through sharing and rating content.<br />Users can request content based upon similar nationality, age or religion.<br />Non Functional<br />
    3. 3. Feedback<br />Addressed lack of social communication: lack of ratings system, relevance / success of uploaded content.<br />Religion vaguely discussed: making finding local religious groups part of the future planning, similar to Student Services.<br />Limiting scope for negative social phenomena to occur: removing jokes, negative rating and functionality for moderation of content.<br />Keeping anonymity important to the app: whilst increasing social interaction the app still keeps content and profiles private whilst still allowing users to be moderated.<br />
    4. 4. Scenario<br /><ul><li> Carlos is an 28-year old male who has recently moved to Bristol to complete his masters degree in European Philosophy.
    5. 5. Carlos is Spanish and this is his first time in England. </li></ul>He searches through his university website for help with integration into Bristol social life.<br />He comes across the Culture Cow website and decides to check the url on his iPhone.<br />He registers and then logs into the app.<br />From here he uploads a flickr photo as it is the first logical step on the app.<br />He then searches for photos from other Spanish students and attempts to socialise with them after rating a few of the photos.<br />He feels happier after realising there are other Spanish students in Bristol and hopes that he can meet up with some of them.<br />
    6. 6.
    7. 7. <ul><li> Providing a succinct amount of options upon loading
    8. 8. Introduction of branding
    9. 9. New users call to action is present first</li></li></ul><li><ul><li> Most important fields shown first
    10. 10. The order of the fields matches the user’s mental model of registering
    11. 11. Consistency between ‘call to action’ buttons
    12. 12. Back button present for users who misclick</li></li></ul><li><ul><li> Split from other register form to reduce cognitive load
    13. 13. Drop down arrows provide affordance to suggest further options
    14. 14. Drop down boxes allow users to quickly progress through registration.</li></li></ul><li><ul><li> Confirmation or error messages displayed.</li></li></ul><li><ul><li> Familiar and universal login screen format.</li></li></ul><li><ul><li> Keyboard space taken into consideration with menu.</li></li></ul><li><ul><li>JQuery Mobile and iPhone defaults show completed form</li></ul>Whilst displaying login button and keyboard.<br /><ul><li> May prevent input errors before continuing process.</li></li></ul><li><ul><li> Simple button to guide / aid user flow through application.</li></li></ul><li><ul><li> Consistency with other applications, providing options in top-right </li></ul>and using cog icon.<br /><ul><li> Icons useful for users with English as second language.
    15. 15. Explanatory text that is succinct.
    16. 16. Call-to-action buttons easily recognised and prevalent.</li></li></ul><li><ul><li> Consistent icon-based approach to free cognitive load and add character.
    17. 17. Question incites appropriate response via buttons.
    18. 18. Minimal interface to engage user; moving away from stagnant, desktop applications.</li></li></ul><li><ul><li> Offering options for both novices and those with technical experience.
    19. 19. Flickr NSID code can be used as an ‘accelerator’.
    20. 20. Icons relate to real-world experience; searching and photography.
    21. 21. Division line splits two possible options.</li></li></ul><li><ul><li> Shows an adequate number of results in a simple format.
    22. 22. There is enough space around the photos to allow for touch-screen interaction.</li></li></ul><li><ul><li> Question allows user to confirm action or choose another.
    23. 23. Testing showed that photo selection can be tricky on touch-screen devices.</li></li></ul><li><ul><li> Immediate feedback, notifying user of system process and consequential </li></ul>happiness change.<br /><ul><li> Light-hearted photo reflects application character.</li></li></ul><li><ul><li> Consistent menu, identical to feed menu: recognition rather than recall.</li></li></ul><li><ul><li> Limited options to streamline process.
    24. 24. User will recognise similar interface from registration.</li></li></ul><li><ul><li> Results based on most recently updated photos, so they will change with each use.</li></li></ul><li><ul><li> Recognisable rating system .
    25. 25. User choice to go to the home screen or rate the picture: contributing to the community.</li></li></ul><li><ul><li> Light-hearted image is consistent with happiness.</li></li></ul><li>Options<br /><ul><li> Help should always be available
    26. 26. Language and privacy integral to main requirements.
    27. 27. Users can edit their profile information.
    28. 28. Logout option differentiated from others. Top of the menu as it will be commonly used.</li></li></ul><li><ul><li>A run through of all features in the current app prototype.
    29. 29. Completed using wifi connection and iPhone 4.
    30. 30. Some of the hi-fi features were not implemented in thisprototype.</li></li></ul><li><ul><li> Design specifically for Android handsets
    31. 31. Incorporate good Android design principles
    32. 32. Research Android applications
    33. 33. Experience with Android systems
    34. 34. Competitor analysis
    35. 35. Approach helped futher design decisions
    36. 36. Will allow for higher usability due to increase in number of devices that can access application
    37. 37. Further implementation would have helped finished application</li></li></ul><li>Adopted Approaches 2<br /><ul><li> As well as adhering to mobile (iPhone) design guidelines and principles, we also set out to develop and adhere to our design guidelines and principles.
    38. 38. This allowed team members to develop elements of the application and also provide consistency throughout the application.</li></li></ul><li>Adopted Approaches 4<br />Carl’s Adopted Approach<br />Developing the lo-fi prototypes into hi-fi<br /><ul><li> My approach aimed to transform usability criteria and iterative lo-fi prototypes into hi-fidelity mock ups.
    39. 39. Usability criteria included: simplicity, navigation, error-handling, comprehensibility and efficiency.
    40. 40. Initially, I worked alone on shaping hi-fidelity prototypes from lo-fi examples.</li></ul>Developing hi-fidelity prototypes alone <br />neglected a balanced view.<br />Attention-to-detail ensured design guidelines<br />were followed.<br />Designing for the iPhone format without<br />considering development platform implications.<br />Efficient hi-fi process on Photoshop with <br />elements altered to suit screen estate.<br />.<br />Compromising original lo-fi design patterns <br />to fit JQuery Mobile conventions.<br />Familiarity with Culture Cow requirements<br />built on successful lo-fi iterations.<br />
    41. 41. Team Communication<br />Helped to ensure version control.<br />Faster team communication and development.<br />Login restrictions to development area.<br />Harder to translate paper based design.<br />Facebook used for group communication.<br />Wordpress blog used to host research and develop ideas.<br />Development area used to prototype App ideas.<br />
    42. 42. Evaluation<br />Difficult to integrate and maintain anonymity whilst providing communication between users.<br />Jquery Mobile (in alpha stage) limited prototype opportunities. Compromised interaction ideas.<br />Difficult to ensure user comprehension with technical aspects.<br />App options were limited, lacked social awareness, taking away from the user experience. <br />Design principles carefully considered, and user flow is simple.<br />Could integrate well with student services and local religious groups: could boost user base and support.<br />App has potential, and the idea has never been fully explored, with regards to International student support.<br />Branding and overall feel is professional.<br />
    43. 43. Future Planning<br /><ul><li>Rewards/Achievements system
    44. 44. Develop as a native app for specific systems and devices
    45. 45. Develop a closer working relationship with student services to ensure optimal sustainibility and inclusiveness
    46. 46. Enable linking between local religious groups and Culture Cow users.
    47. 47. Further user testing and usability promotion using incremental changes
    48. 48. A communication system between users such as a chat or group-based collaboration
    49. 49. Further integration with emergent Web 2.0 technologies.
    50. 50. Adding moderation before content is made available to the Culture Cow users.</li></li></ul><li>Thank you for listening<br />We would be happy to answer any questions that you have.<br />
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.