Published on

Published in: Technology, Business
1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide


  1. 1. Creating the User Experience for a new mobile search engine
  2. 2. Aims of presentation <ul><li>“ Walkthrough the UE design approach of a startup mobile </li></ul><ul><li>search company” </li></ul><ul><li>Introduce Taptu and the product </li></ul><ul><li>Walkthrough our UE design approach and tools </li></ul><ul><li>Demo of our latest product version </li></ul><ul><li>Question & answer session </li></ul>
  3. 3. How many of you regularly use a search engine on your mobile ?
  4. 4. How many had a positive experience ?
  5. 5. About Taptu <ul><li>Focus Building (and making money from) a new kind of mobile search </li></ul><ul><li>Expertise Mobile user experience, search algorithms </li></ul><ul><li>Innovation 15 key patent applications filed in mobile search </li></ul><ul><li>Service launch Alpha service in Oct 2007, Beta V1 in Feb 2008 </li></ul><ul><li>Investors 3i and Sofinnova, £5m Series A </li></ul>
  6. 6. About me <ul><li>Technologist and business guy </li></ul><ul><li>Serial entrepreneur: Aspective, Teamstudio, Trigenix, Taptu </li></ul><ul><li>50 years old </li></ul><ul><li>My children are Generation Y, I’m not…. </li></ul>
  7. 7. The challenge for Taptu <ul><li>Search requires a different approach in the mobile environment </li></ul><ul><li>Search must be provided within a highly constrained interfaces - different devices, inputs, screen-size, latency </li></ul><ul><li>Google Mobile, Yahoo OneSearch and Live Search for Mobile are variations on a very similar theme. They are designed and engineered from the perspective of: “bringing the best of PC Web search to mobile phones” </li></ul>
  8. 8. What is our UE Design process? <ul><li>Our aim is to create usable, engaging and aesthetically pleasing products across the wide range of devices Taptu works on </li></ul><ul><li>We are pragmatic about UE approach - ‘Text-book’ approach not always possible - but we aim to use the right tools at the right stages </li></ul><ul><li>We spend a lot of our time thinking about the needs of our users and talking to users direct: 12 months, 14 user studies 133 users, 1 hour per user </li></ul>
  9. 9. Key stages of our process… Concepts + Ideas
  10. 10. Key stages of our process… Concepts + Ideas Paper Prototyping
  11. 11. Key stages of our process… Concepts + Ideas Paper Prototyping Device Prototyping
  12. 12. Key stages of our process… Concepts + Ideas Paper Prototyping Device Prototyping UE Testing
  13. 13. Key stages of our process… Concepts + Ideas Paper Prototyping Device Prototyping UE Testing UI Spec
  14. 14. <ul><li>Gary, 23 “Unwired Social” </li></ul>Kate, 27 “Digerati”
  15. 18. Prototyping the UE <ul><li>Prototyping is central to our process - use it constantly as we develop new ideas & features </li></ul><ul><li>Key benefits to us: </li></ul><ul><li>1. Designing the end-to-end experience </li></ul><ul><li>2. Creating a believable product for a User Study </li></ul><ul><li>3. As a discussion tool with Engineering </li></ul><ul><li>We use two types at different stages - Paper Prototyping and Device Prototyping… </li></ul>
  16. 19. <ul><li>User Task </li></ul>
  17. 20. <ul><li>Task Flow Design </li></ul>
  18. 21. <ul><li>Idea Annotation </li></ul>
  19. 22. Device Prototyping …
  20. 23. Device prototyping <ul><li>Device Prototyping the is the next step from Paper Prototyping… need to experiment with designs on the target devices once we happy with design on paper </li></ul><ul><li>Hi-fidelity of device-based prototypes offer a number of benefits that paper prototypes don’t provide </li></ul><ul><li>The device-specific issues of screen size, input, controls, navigation, pixel-perfect visual design all need to be explored & considered </li></ul>
  21. 24. How we do it ? <ul><li>Produce ‘static’ prototypes – they create a believable walkthrough of particular paths we want to test </li></ul><ul><li>HTML/CSS + Photoshop - create pixel perfect graphics and build prototypes using HTML </li></ul><ul><li>Slower to iterate than paper prototypes - but for many device/browser specific design issues/decisions we need to create device protos at various stages </li></ul><ul><li>Ideal for user testing - still minimal production and no engineering time required </li></ul>
  22. 25. Device-specific design issues <ul><li>What design issues do we deal with per device? </li></ul><ul><li>We have defined 3 core ‘families’ of device: </li></ul><ul><ul><li>Low phone - standard 176x220 e.g. RAZR </li></ul></ul><ul><ul><li>Mid phone - QVGA e.g. Nokia N95, Sony Ericsson W880i </li></ul></ul><ul><ul><li>Hi phone - iPhone, more will follow </li></ul></ul>
  23. 26. Taptu on mid-phone (N95, W880i) Branding and white space are key Secondary navigation elements below the fold Elements make it clearly a search engine Global navigation elements grouped and consistent
  24. 27. Taptu on hi -phone ( iPhone) Scrolling: Scrolling is much quicker with finger Selection: Touch interface requires wider spacing of elements Text entry: Text entry is quicker than other two device types
  25. 28. Visual design + brand …
  26. 29. UE Testing with users …
  27. 30. UE testing approach <ul><li>Once we have a working Device Prototype, we test… </li></ul><ul><li>On a monthly basis we find a set of target users and meet them face-to-face, one-to-one, 1 hour sessions </li></ul><ul><li>We test in London - so we can source widest demographics of users for sessions </li></ul><ul><li>We built a fully portable lab - so its less intrusive/formal and we can go anywhere with it </li></ul><ul><li>We make this a regular event in our schedule - so we get maximum exposure to testing concepts with real users </li></ul>
  28. 31. Portable usability lab
  29. 32. <ul><li>Mounted camera </li></ul>
  30. 33. Picture-in-picture review format
  31. 34. Live example of User Study Session…
  32. 35. Future Taptu direction <ul><li>Today: good at infotainment searches (e.g. music, movies, TV, news), mobile navigation (mobile sites) Tomorrow: universal search </li></ul><ul><li>Search and share engine - enhancing sharing functionality with 1-Tap share concept </li></ul><ul><li>Human-assisted search for popular terms </li></ul><ul><li>Further user research + international research </li></ul>
  33. 36. Conclusion What have we learned about the UE design process? - Evaluate early - Don’t assume, do listen - Iterate often!
  34. 37. Q&A Want to try it ? You can try Taptu on your mobile phone browser - enter Or on PC - Or Facebook App - Search for ‘ Music Wall’ in Facebook Or Music Cube game - Search for “Music Cube” on Google