How to provide a rapid photo search in a smartphone?This is the topic I research in the course.
Observation
I am often confused by my phone albums.Photos list in a default order of time.The album provided by phone system has only a few way to search photos and it is not easy to file the photos.I need to scroll the screen many times to look for my photos.I want to know if people has the similar confusion about photo filing as me.I want to observe what’s the common confusion when people filing and show their photos on different devices and what can use for reference in small screen devices.So I prepared some questions and decided to take a short video for 3 users.And other interviews through Internet.
Most of them don’t know how to file and search their photos besides building files.The default ways provided by system is time and location .Some systems also provide several organized types — date,name and size.But when I asked them to find a specific photo,their first reaction was scroll pages fast to find …1,2,3…and not always found the photos.
Needfinding
A list of user needs
1. Massive photos need a better way to be classified pictures quickly.
2. We need not to operate too much when we take a photo.
3. Let’s make the way to mark the photos as easy as to sign on the calendar.
4. Photos filing need to be more efficient,maybe more smart in batch processing.
5. Display style of picture need to be intuitively no matter they are listed in chronological order ,location or tags.
6. With a good searching engine ,we don’t need to find the picture page by page.
7. A better way to distinguish private photos from others.
8. Information of photos need a better way to be used , showed and searched.
9. Walls of photos need to be more convenient to show as much images as possible without lossing viewable.
10. I want our wall of photos show as clearly as a map with a main line to lead people.
11. The classified photos show on the screen need to be more prominent.
12. The image management system need to recognize similar pictures to make the display clearly for quick scanning.
13. The image management system need to compatible with formats from other device.
14. The definition of photos need to be open(for example ,every picture can be defined with several properties to adapt to different searching or array conditions).
15. When we shop online,we can reduce the range step by step,can we apply it to photo filing?
Point of View:The system need to filing the photos smarter, users need to search the photos faster.
Verbal Inspiration:file / classify / label / recognition / multipath / search / filter / select
storyboard & Paper Prototype
Then I tried to build my storyboard.Look back to the works ,it is not very detailed.I think I have not understand the essential of the storyboard fully at that time.Following are my storyboards,one depicts a way to prioritize tasks and the other depicts a way to factor in breaks.
I tried my first paper prototype after drawing storyboards.It looks simple but the processing is funny.And it helps to modify my prototype quickly.But I made a mistake in this stage.The paper prototypes were only designed fouce on the main functions and didn’t present a completed flow.I overlooked this point and underestimated the quantity of the follow-up work.
For internet limitation in my country ,I failed to connect with peers on google hangouts.But they are so friendlly to add me to their email loop to help me finish the assignments.And their feedbacks are real helpful.I added missed elements and steps to my first edition of skeleton.
Things are more complicated than what I have supposed.I never use Axture before this course.I am really a layman in this field.After I finished my skeleton in Illustrator,I found the requirement of the assignment was to do a interactive prototype.That’s really a challenge to learn a new thing in a short time for a full time worker.I just got the most basic skill of the software and failed to understand what is javascript.Cry…T_T…
The permutation and combination of the filter condition makes the work doubled and redoubled.What I can do is to finish the pages in a stupidest way.And that makes my skeleton look redundancy.Thankfully I finished my first version of a low fidelity functional prototype .And take it as Test A in AB test.
URL:http://v3elwy.axshare.com/#c=2
I developed a protocol and invested people to do a in-person experiment.They gave back some suggestions to help improve my work.Some issues I never thought can be a problem confused users.
Select component of my prototype and redesign it.Paper prototype first and then framework.I decided to redesign the search element.The bottom searching bar made a new layout to give a better user experiment.
The second version makes a big change of color.Blue changed to black because testers said the blue was strange and not reasonable.At last I chose a neutral color system and blue to high line selected status.It’s cool and can set off the colors of the photos in actual use environment.The second version with the redesigned component set as Test B.
URL: http://1uxny9.axshare.com/#c=2
AB Test Plan
Test A.URL:http://v3elwy.axshare.com/#c=2
Test B.URL: http://1uxny9.axshare.com/#c=2
Experiment #1: How to use the side bar? ( Tips & Colors )
Goal: improve the utilization rate
My design purpose of the side bar is for quick searching .It takes a reference to the mobile contact search.At first users didn’t know they are buttons and can be click ,and some are confused about how to use it .Testers thought this a good design until I told them how to use it.So I want to increase its utilization rate through adding guide and changing its selected status and colors.
I will provide two interfaces on phone page.Interface A with the original side bar design and Interface B with the improved design.Interface B has a guide when you enter the page and also has a obvious color when you select it.
Experiment #2: Multiple selection ( Sizes & Layout )
Goal:reduce the times to fold and unfold the searching bar
Orginal design of the bottom searching bar is like that,the page jumps to a result page as soon as you select one element in the bar.Then he must unfold the bar again to select another condition.Now I will improve the process.User can multiple select all the conditions they want then exit the searching interface through click the fold button.So I will provide two interfaces about searching bar.Interface A ,one click ,bar fold.Interface B,keep searching bar unfold when filtering.I will observe which plan can reduce the users repeating actions effectively.
Online Test Results
Because my limited software skill the test online didn’t result very well.I was so sorry that I didn’t import the files without site-map successfully…So through the online test,testers always try to click the site-map immediately rather than click button on the pages.That does effect the test processing.Now I know it is important to hide the trees to let the testers force on the flow.But thankfully,it also helps me find some issues of my prototype at the same time.
Summary my finding help me to finish the final prototype.The most important changes are still on guide and search.I will keep updating my final work on this link:http://txq5mb.axshare.com/#c=2
That’s a review and a recording of my course Interaction Design Capstone Project.Its a new start for me.Thanks for reading~and forget my poor English .^_^