PHOTOWARE INTERFACE DESIGN FOR BETTER PHOTO MANAGEMENT Ming-Liang Liu Submitted to the faculty of the School of Informatics in partial fulfillment of the requirements for the degree Master of Sciences in the School of Informatics Indiana University December 2005 ii © 2005 Ming-Liang Liu ALL RIGHTS RESERVED iv TABLE OF CONTENTS LIST OF FIGURES V LIST OF TABLES V ABSTRACT VI CHAPTER ONE: INTRODUCTION AND BACKGROUND` Introduction to Subject Importance of Subject CHAPTER TWO: LITERATURE REVIEW Photo Management Photoware Interface Design Performance and Preference 10 CHAPTER THREE: METHODOLOGY 13 Research Questions 13 Research Overview 14 Phase – Usability Test .15 Participants 15 Treatments .16 Product Selection 16 Adobe Photoshop Album .18 Google Picasa 22 Task Design 25 Phase – Prototype Design 27 Conceptual Model 28 Delimitation .30 Prototype Review .30 Phase – Experiment 33 Participants 33 Procedures 34 Usability Measures 35 Performance 35 Preference 36 Test Environment Setup 37 CHAPTER FOUR: RESULTS 39 Phase 1: Usability Test 39 Phase 3: Experiment 42 Time-on Tasks Results .42 Interview Result .45 CHAPTER FIVE: DISCUSSION 47 v Photo Tray 47 Export Template 49 Correlation between Performance and Preference 50 CHAPTER SIX: CONCLUSION 51 Future Research .53 REFERENCES 55 FOOTNOTES 58 APPENDICES 59 Appendix A - Pre-Test Questionnaire 59 Appendix B - Post-test Questionnaire 64 Appendix C - Post-Test Interview Form 65 Appendix D - Usability Test Instructions (Script) .67 Appendix E - Task Description 68 Appendix F - Task log sheet 71 Appendix G - Usability Report 72 Appendix H - Questionnaire Result .78 Appendix I - Interview Results 84 VITA 90 vi LIST OF FIGURES Figure 1: Adobe Photoshop Album - Main Screen 18 Figure 2: Adobe Photoshop Album - Collection List 19 Figure 3: Adobe Photoshop Album - Export 20 Figure 4: Adobe Photoshop Album - Single Photo View 21 Figure 5: Adobe Photoshop Album - Caption Editing .21 Figure 6: Adobe Photoshop Album - Caption Editing (mouse over) .22 Figure 7: Google Picasa - Main Screen 23 Figure 8: Picasa - Picture Tray 23 Figure 9: Picasa - Picture Tray (with unrecognizable images) 23 Figure 10: Picasa - Single Photo View 24 Figure 11: Picasa - Export 25 Figure 12: Prototype – Main Screen 31 Figure 13: Prototype – Single Photo View 32 Figure 14: Prototype – Export 33 Figure 15: Preference measuring scale 37 Figure 16: Scatter Plot of the Task Time Performances vs Design Preferences .44 Figure 17: Selection within the Photo Browser .48 Figure 18: Selection with the Photo Tray 48 LIST OF TABLES Table 1: Task Time for Each Task per Product 42 Table 2: Preference Scores for Each Product and Design .43 Table 3: Categories of Participants’ Preference .45 vii ABSTRACT Digital photography has largely replaced traditional film-based photography Low cost and easy creation of digital files encourage people to take more photographs (photos) than before Photo management involves selecting photos for placement into albums for future review and publishing them through different media in order to share with others Photoware is designed to help people manage a large amount of digital photographs To manage digital photos more efficiently, not only does software performance need to be improved, but also the usability of the software design needs to be refined Well designed interfaces are one of the solutions to expedite the photo management tasks The purpose of the study was to design a new photoware interface that would allow users to execute photo management tasks more efficiently A three-phase study was designed to assess and compare Adobe Photoshop Album with Google Picasa Phase one identified two major features that were problematic: 1) visibility of images with the photo tray features and 2) the non-existence of export templates that allow photo format settings to be placed into memory for future use In Phase two, these two features were designed and implemented through paper and dynamic prototypes Phase three consisted of usability testing of the prototypes Thirty university students participated in a time-ontask study to measure the performance of the new interface Also, user preferences were recorded through a post-task questionnaire The users performed more quickly on the interface design with the two new features, as well as preferred them over the existing products when using mean values However, the statistical correlation (Spearman - rank order correlation) between the two usability variables was not significant The lack of correlation was supported by Frøkjær et al.’s view that usability measures should be viii considered independently In other words, task time performance alone cannot be used to predict general user preference, because subjective preference could be affected by a range of other factors CHAPTER ONE: INTRODUCTION AND BACKGROUND` Introduction to Subject People are living in a world filled with digital technology Digitalization of data has made it easier to create, to reproduce and to disseminate; but managing data was more difficult than before Information overload is a term that has accompanied the emergence of digital technology People are flooded with the massive amount of digital information generated everyday The same problem is also emerging in the field of photography in recent years Digital photography is starting to replace traditional filmbased photography Low cost and easy-to-create digital technology encourage people to take more photographs (photos) than before (Rodden & Wood, 2003) According to IDC’s 2003 U.S Consumer Digital Imaging Survey, 17% of its respondents took 50–100 photos per month, or equivalently, 3,000–6,000 images over a 5-year period The percentage of digital camera ownership is still growing (1.6% in 1998, 10% in 2001, 20.2% in 2002, and 33% in 2004 (REUTERS, 2004; Tomkins, 2002) ), and more people will encounter the same problems People are overwhelmed by their photo files and it is impossible for them to deal with digital data in the traditional way Photo management software (photoware) is designed to help people to manage a massive amount of digital photographs more efficiently with the help of digital technology With paper-based photos, people usually put them into cluttering albums Selection is needed to put photographs into meaningful order before clustering them into albums The same tasks are still needed when it comes to digital photography Photoware does not completely take the workload away from its users; however, with careful design it can alleviate the load of organizing photos in a more efficient and flexible way While making it easier to create photographs, digital technology provides easier and more timeefficient ways for people to share photos with one another One can email photos of his/her son’s birthday party instantly to the grandparents who live a thousand miles away, or share photos of the majestic Grand Canyon taken in a trip with friends by putting those photos onto their personal website If they prefer holding photos in hand, they can go to photo shops or supermarkets to print them out on paper However those processes all require different kinds of formats; some of them are to suit traditional photo formats when printing on paper, and some involve courtesies to others like reducing file size when publishing via the Internet Users have to shuffle among and remember different digital format settings to suit different needs on a regular basis To accommodate different kinds of format settings users need to either remember them or write them down on paper Importance of Subject Archiving and sharing are two major activities in photo management (Frohlich, Kuchinsky, Pering, Don, & Ariss, 2002); and the two activities can be simplified as organizing photos into albums and exporting photos into different formats People usually archive photos by organizing and selecting photos into albums They select “good” photos (Tomkins, 2002) and put those photos into albums with meaningful titles for future review To share digital photos with others, people need to export photos from their photo album collections They may print photos out on paper, email photos via the Internet, or publish on web sites By making photo organization and photo export more effective with a well designed interface, photo management will become an easy task for photoware users 74 Appendix H - Questionnaire Result Questionnaire Result (Phase 1) Age Less than 18 18~25 26~35 36~45 56~65 over 66 0 Male Female Gender Occupation Undergraduate Graduate Student University Faculty What kind of computer system does you familiar with the most? Microsoft Windows 12 Apple Macintosh How long have you been using computers (years) 1~3 4~6 7~9 10+ How many hours each day you use a computer (hours)? 1~3 4~6 7~9 10+ Do you or your family member own, possess or use a digital camera? Yes 10 No How long have you been using digital camera? Less than months 7~12 months 13~18 months 19~24 months 25+ months How often you use digital camera to take photos? (Approximately) Once a day Once a week Once a month Please try to estimate the number of photographs that have been taken by you during the past month 75 Not at all 1~20 21~50 51~80 80~100 100+ Please try to estimate the number of photographs that have been taken by you during the past year Not at all 1~50 51~150 151~300 301~500 500+ What kind of occasion that you use digital camera to take photos the most? Trip 10 Party Special event Daily life How you manage your digital photos currently? Photo management software Use file-and-folder 10 Others Do you create albums (/folders) to categorize photos into groups? Yes 12 No If you are using photo management software, what kind of software package you are using? (select those that apply) Google Picasa Adobe Photoshop Album iPhoto ACDSee Others JascPaintShopPro, PhotoImpact Do you need to transform photos into different formats? (Change resolution, size, etc.) Yes No What are the purposes to convert photos? (select those that apply) Publish on websites email print out What kind of format that you would like to change while exporting photos? (select those that apply) Image size Image Quality File name Image encoding (e.g JPG, GIF, etc.) 76 Others editing How often you convert photo into other format? (Approximately) Once a week Once a month Once per months Once a year 77 Questionnaire Result (Phase 3) Age Less than 18 18~25 26~35 36~45 56~65 over 66 23 0 Male Female 17 13 Gender Occupation Undergraduate 19 Graduate Student 11 University Faculty What kind of computer system does you familiar with the most? Microsoft Windows 30 Apple Macintosh How long have you been using computers (years) 1~3 4~6 10 7~9 12 10+ How many hours each day you use a computer (hours)? 1~3 4~6 12 7~9 10 10+ Do you or your family member own, possess or use a digital camera? Yes 29 No How long have you been using digital camera? Less than months 7~12 months 13~18 months 19~24 months 25+ months 18 How often you use digital camera to take photos? (Approximately) Once a day Once a week Once a month 17 Once per six months Once an year Please try to estimate the number of photographs that have been taken by you during the past month None 78 1~20 21~50 51~80 81~100 101~200 201~300 More than 300 Please try to estimate the number of photographs that have been taken by you during the past year None 1~50 51~150 151~300 301~500 501~800 801~1,000 1,000~2,000 More than 2,000 What kind of occasion that you use digital camera to take photos the most? Trip 23 Party Special event Daily life Other everything How you manage your digital photos currently? Photo management software Use file-and-folder 23 Others Do you create albums (/folders) to categorize photos into groups? Yes 28 No If you are using photo management software, what kind of software package you are using? (select those that apply) Google Picasa Adobe Photoshop Album iPhoto ACDSee 14 Photoware comes with digital camera Others Wretch Do you need to transform photos into different formats? (Change resolution, size, etc.) Yes No What are the purposes to convert photos? (select those that apply) Publish on websites email print out 79 What is your main reason to sue photoware? Organize photos (e.g create photo collections for future review.) Convert photo formats (e.g resize, change file type, etc.) Basic image editing (e.g remove redeye, rotate, crop.) Other image editing (e.g special effects, merge photos, etc.) Others 13 Have you transformed photos into different formats? (Change resolution, size, etc.) Yes 22 No How often you convert photo into other format? (Approximately) Once a week Once a month Once per months Once a year What were the purposes to convert photos? (Select those that apply.) Publish on websites 15 Email 10 Print out Application for homework/work (e.g insert Word, Power Point) Other Photoshop retouch, for fun How often you convert photo into other format? (Approximately) Once a week Once a month 13 Once per month Once per year What kind of format that you would like to change while exporting photos? (select those that apply) Image Size 22 Image Quality 11 File name 11 Image Encoding (e.g JPG, GIF, etc.) 12 Other 80 Appendix I - Interview Results 81 Like Photo (positive Tray preference) Tray is useful to see what and how many photos that you have chosen The tray is good for me to know what photos that I have chosen The tray minimizes the possible errors that could cause by using Ctrl Tray is good You can see how many photos you have chosen (tray) Like the tray You can see all the photos selected in tray (if using tray) Like the tray It (tray) is useful to see how many photos have been chosen Save photos temporarily is convenient The tray can prevent the errors while trying to use Ctrl to select 10 Template is useful when doing repeated settings, so I don’t need to the same thing every time 11 Tray is easy and convenient if I need to select out some photos Also, it can minimize the possible problems could have while trying to use Ctrl or Shift to select photos 12 Tray is useful; it’s convenient to select photos Tray can used to make sure the photos selected by simply looking at them in tray 13 Like tray If I use Ctrl to select then I cannot see what photos I have selected after scroll to different part of the photos (in the collection) Also, it can avoid the mistake in selection with Ctrl 14 Without tray, you have to create an album first then you can start to select photos and then move them into the album 15 It’s great that Tray is resizable 16 Tray is good because it shows you what photos you have selected 17 The good of photo tray is that you can see what photos you have selected, especially when you browse to other part of the photos (collections) When I was using the other product, I cannot see them 18 Tray is good that you can see and the comparison For the first time, tray may not easy because I don’t know what it is, but in the long run is pretty useful 19 Using tray can see what photos you’ve selected 20 Tray is easier for me to select photos 21 Tray allows you select photos easier 22 I can see photos selected in tray Also it’s easy for me to remove photos I don’t like from tray (So, he can 82 Export Template The template is useful if I am going to use the same settings again and again in the future It’s (photo template) useful when the settings are saved So, every time I can export photos into the same format more easily on my own website Template is useful However, generally to the settings it’s much smoother in Adobe’s product than in this one If I am going to put photos onto my web site I usually need to the same settings every time, but I think I don’t need to it if template is available Template is helpful in my reports, because I usually use the same format for photos in report If the settings are saved then I don’t need to it again and again Template is useful to me; because sometimes I need to upload my photos onto my website, and the site require certain format Template is useful; I don’t know how to preset photo size on my digital camera After I put them onto my laptop, then I need to convert them into smaller size because I don’t have much space photos With the template, I think it is useful for me to it Template may not useful for me right now, but it could come in handy for me to email photos I can use the template to send emails 83 Adobe’s Export Adobe’s Selection The rename is useful to me (export) Quality in export function is easy (Adobe puts options of format in a menu So, users don’t need to enter with keyboard and see all the options available visually.) Like the way it shows the Quality (There are only 110 in Adobe’s Quality slider in export function, and the prototype uses percentage Maybe users don’t care about so detail 10 options are enough for them.) It has more settings in the export than the other product Review is good to see the photos you are about to export (in both product) In Adobe’s export, Size is easier (to change) You don’t need to type in the numbers, all you need to just select the size from menu Size in Adobe is better, because you only need to select one of them I like the Size in Adobe’s Export, because I don’t need to enter the numbers by myself (Actually users can select size by using slider in prototype, but users need to move the slider first then he knows which scale is the size he needs.) 84 Others Don’t like Photo (negative Tray preference) Its (thumbnail) layout is not like the way I use in Windows (Adobe used grid layout, and not allow users to select by using mouse’s drag and select) Too many functions in right click (context menu) and that confused me and make me hard to find a function (24 functions in Adobe’s context menu.) It’s easy for me to find needed function by simply using right click Needed functions are available in context menu is the reason I like the product Like “Select All” Like Export in right click (context menu) The layout is good (Adobe) Like the export in (context) menu Like the design in Adobe Icons may not easy for me to know what they are, but after I learned it should be easy for me to locate them again Icons are cute 10 Like the arrangement (of thumbnail in Adobe) 11 “New Album” in Photo Manager is more obvious than the one in Adobe’s 12 Graphic design is good (Adobe) 13 Like the date, time info show around thumbnail image (Adobe) 14 It’s simple and has enough function just I need (prototype) 15 The Return button is big and clear enough for me to find it (prototype) 16 Adobe’s product looks better and beautiful (esthetically) (That’s the reason she why the Adobe’s template is better.) 17 I usually upload photos unto Yahoo Photos, so I need to reduce photo size because of the bandwidth It takes long time to upload big images With the template, then I don’t need to the same settings every time All I need to just select the template then it’s done I don’t like tray because I need to drag photos one by one into tray first, and then move them into album Why should I that if I can just move them into album directly? 85 Export Template Adobe’s Export Adobe’s Selection Others Suggestion & Comment Photo Tray Export Template Adobe’s Export Adobe’s Selection I like photo template, but don’t like it ask me if I want to save template or not every time It is also inconsistent that it sometimes asks you while sometimes not (It asks only if there is no any tray has the same settings in template list.) It’s not easier for me to notice the template (list) I thought it is some kind of function related to the (review) photos because it’s on top of those photos (grouping of functions) Review is good to see the photos you are about to export (in both product) I made mistake on selecting photos Sometimes I thought I selected a photo, but actually I didn’t (The visual cue of selected photos is not prominent in both products.) Too many functions for photo management software It could be intimidating for some users like my mom (Adobe) Don’t like have to double click then can view photos in collection (Adobe) Font used in album doesn’t look nice (prototype) Couldn’t find the function in right click (context menu) (export) Maybe it’s better to make the tray float and movable, so I can move the tray to another screen Tray in one screen and show photos in the other (The user is using two monitors.) When photos (needed to select) are not many, then it (tray) may not that useful, but when there are many photos to select then it will be useful To use tray you need to know how to use drag and drop It may not suitable for people that don’t know drag & drop My parents for example However, they know about copy & paste 86 Others Confusion In my opinion, the navigation may be confusing for some users who are not familiar with browsers The look and colors of Adobe’s interface look more professional and delicate Maybe it’s personal preference Maybe some other people like simple colors like Photo Manager did Basic edit function like crop, lighting, and color are needed Type (encoding) is important for me to the web site design Like TIFF is usually bigger and GIF is for animation Maybe some people just don’t care just use JPEG I don’t use caption, so I don’t care about the function I like to show photos in full screen, but it seems I cannot it in the program Except for Fit Screen, I would like to see a function that allows me to show photo’s original size (100%) (prototype) Maybe Select All can be represented as an icon (prototype) It’s better to show all the available sizes I can choose like Adobe’s product does the better job (prototype’s export) 10 It’s (prototype) simpler and it has more functions for general people who don’t know how to use computer, not like the other (Adobe’s) It may more focus on expert users 11 It’s import to have Copy & Paste Some people may don’t know how to use drag & drop, but they know how to copy and paste (However I doubt it, because drag & drop is the basis for mouse maneuver in GUI environment The only thing that causes problem is that not all the GUI applications allow drag & drop The inconsistency makes users not to use drag & drop first time using the application.) Didn’t know what will happen if I select Clear Tray; will it remove them from tray only? Or they will remove be from disk also? However when I see the duplicate photos in album and tray, then I guess they will not be remove from disk (prototype) Also, the location of the template list is confused me I thought they are not related to settings (prototype) Didn’t know what the meaning of the template is I don’t know what are those icons for (Adobe) It’s confusing you still see the export window after the export is done 87 88 VITA Ming-Liang Liu lmleon@gmail.com (317) 457 - 0640 301 Watson Ln Apt D Greenwood, IN 46143 USA Education Indiana University – Purdue University Indianapolis Master of Science in Human Computer Interaction National Taiwan University of Science and Technology Bachelor of Business Administration in Information Management Oriental Institute of Technology Majored in Industrial Engineering and Management Indianapolis, IN Sep 2003 – Dec 2005 Taipei, Taiwan Sep 2000 – Jun 2002 Taipei, Taiwan Aug 1995 – Jun 1997 Work Experience Math Assistance Center at IUPUI VB, Access VBA Programmer TUNG-I Information Service Java Programmer KingArt Metal Industrial Co., Ltd Quality Inspector Republic of China Army Private First Class, Military Police Indianapolis, IN Mar 2005 – Dec 2005 Taipei, Taiwan Mar 2003 – May 2003 Taipei, Taiwan Oct 1999 – Dec 1999 Taiwan Oct 1997 – Sep 1999 ... company, but Photoshop was for photo editing while Photoshop Album was for photo management. ) Using photoware but not for photo management shows that participants only used photoware as photo editing... photoware products that focus on photo management were reviewed because photoware is a general term for software related to digital photography However, some photoware products may focus on photo. .. among two existing photoware interfaces and the newly designed photoware prototype The association between performance and preference data were analyzed and discussed based on the photoware experiments