UQ Masters project presentation

1. Progress Demonstration
24 September 2014

2. Structure
1. Objectives
2. Success criteria
3. Site map and task flow
4. Interaction plan
5. Design evolution
6. Prototype demonstration
7. Plan to completion

3. Objectives
1. Showcase Trove image content in an engaging way that is meaningful
and relevant to our audience.
2. Create a simple web-based, mobile-friendly application to allow users
to create and share text-based images using Trove content.
3. Deliver a simple, seamless, fast user journey to maximize completed
user creations and online shares.
4. Grow our user-base through social sharing and positive user
experience.

4. Success criteria
What will success look like?
*Categories always show
theme-relevant images
*All events clicked
function as expected
every time
*All pages load correctly
every time
*10 new visitors/day
*20% bounce rate
*10% exit rate
*<30s gallery load time
*<3s avg event load time
*2min avg time on site
*50% visits result in completed
creation
*80% creations shared
*25% new visits from
social channels
*15% completed visits
click-through to Trove
1. FUNCTIONALITY
2. SITE
PERFORMANCE
3. CONVERSION

5. Site map
Home
Select Mood
Browse
Browse User
Creations
Edit
Share

6. Task flow
Share
Create New Select mood
Browse
Images
Select
Image
Add Text
Done
or
Change
Font
Add Filter
Change Text
Colour
Download
Share to
Facebook
Share to
Twitter
Share to
Expressit
YES
NO
START
FINISH

7. Interaction plan
We have kept to our interaction plan

8. Design evolution
Mobile-first planning to web-based design

9. Design evolution
Final design palette

10. Design evolution
Web-based design inspiration
Minimalism

11. Design evolution
Web-based design inspiration
Flat UI

12. Design evolution
Web-based design inspiration
Responsive

13. Design evolution

20. Prototype demo
http://deco1800-49.uqcloud.net/demo/

21. Plan to completion
Task Tools Responsibility Due
Outstanding design work Ps & Ai Ash/Jorge 7-Oct
Convert design to html layout (index, browse, share) HTML & CSS Galo 7-Oct
Convert design to html layout (editing page) HTML & CSS Ash 7-Oct
Add functionality JS Galo 7-Oct
Search queries for each category refined API Bianca 7-Oct
Displaying image in edit ecreen. JS Arturo Done
Filters - add image filter functionality JS Bianca 7-Oct
Text editing - all outstanding functionality CSS Jorge/Ash 7-Oct
Sharing functionality (FB or Twitter API) API Galo TBC
Upload to expressit gallery PHP Jorge TBC
Update and maintain gallery mySQL Jorge TBC
BACK-END
FRONT-END

22. THANK YOU