為母親做好用戶界面,你需要知道的 6 個重點(Designing user interfaces for your mother – 6 key takeaways)


本文作者 Tony Gines,以創意總監身份就職於iFixit,一個刊登電子產品維修拆解指南的網站。
Editors note: This is a guest by Tony Gines, Director of UX/UI at iFixit, user interface designer, team leader, husband, dad, and martini consumer.

母親這一輩的人,她們經常在網絡上笨拙地摸索,各種註冊論壇、隱藏手勢和令人混淆的界面時常讓她們不知該怎麼辦,雖然她們很想搞清楚。作為設計者和開發者,把網頁做得好看並不夠,我們有義務為母親這一輩的用戶考慮,儘量改善她們的使用體驗。所以,每次我在設計網頁或者用戶界面的時候,總是會因為想起母親而注重幾個方面:
It happens about once or twice a year. I travel over to my mother’s house for a visit and, about two or three hours in, she says something like “Hey, can you take a look at my computer? I just want to make sure everything is okay with it. You know I don’t know what I’m doing.” She’s right. She doesn’t know what she’s doing.
She wants to, though.
And that’s what brings her and millions of people like her to the websites we create every day. They fumble frustratedly through signup forms, hidden gestures, and confusing interfaces. As designers and developers, it’s our responsibility to make our websites not only useable, but enjoyable enough to come back to again and again.
Here are a few things I try to keep in mind about my mother when I’m designing a new website or interface:

1. 她使用的瀏覽器和我們不一樣(She experiences the web through a different browser.)


她比較喜歡用 IE8,因為熟悉。但由於她潛意識裡怕把瀏覽器搞壞,她沒有信心去更新版本或插件。而當她覺得使用體驗很糟糕的時候,她只會抱怨網站設計,而不是瀏覽器本身。記住,你的用戶基本都是跨瀏覽器的,一定要注重瀏覽器兼容的使用體驗。
Internet Explorer is the browser she prefers. IE8 to be exact. The reason? Familiarity. She knows where all of the buttons are and how to navigate easily. The problem? She has every sort of toolbar one can have and she didn’t voluntarily install any of them. She’s also not confident enough to remove them or even update the browser. She thinks she’ll break it. I installed Google Chrome for her a couple of years ago but, time after time, I see that she’s reverted back to using IE. She feels forced into using Google chrome and blames it any time she can’t get a website to work. Even though IE gives her a diminished experience, she feels comfortable using it.
→ Takeaway:
Understand that if a majority of your audience is viewing your site on an older browser, they aren’t blaming the browser for the bad experience. They are blaming the design.

2. 她不懂得大部分網站的功能(She doesn’t understand most websites’ capabilities.)


她使用 Facebook 卻不太確定分享功能如何正確使用,我們應該讓用戶安心,使用直觀的圖片線索和說明,來引導用戶如何完成每一個動作,確保她們在使用功能時的信心。
Sites like Facebook and Google Plus have all sorts of features for uploading and sharing photos from all sorts of devices. For us, it’s really easy to share things. Snap a photo on your phone, click share, done. She, on the other hand, still emails me all of her photos. She’s on facebook, but doesn’t know when she shares something to the NSA or just family, so it’s intimidating. Google Plus is even worse. The interfaces don’t reassure or guide her enough through the process for her to complete it. If she posts a photo on Google Plus, she doesn’t know which “circle” to choose, how to upload the photo correctly, and whether the person she’s trying to send it to will even see it. She knows that if she attaches a photo to an email, and addresses it to me, I will get it and respond.
→ Takeaway:
Reassure your user throughout the process that what they are doing is correct. Use visual cues and wording to tell your visitor exactly how to accomplish what they are trying to do.

3. 她看不懂圖標(She doesn’t understand iconography.)


我母親幾年前使用過軟盤,但現在已經忘記它們的作用。現在很多界面只使用圖標來代替「新建」、「複製」、「刪除」等功能,圖標的確能保證一個界面的大小,你不用擔心一個按鈕會因為裡面的文字而被撐得很大,但最好在旁邊加上描述性的標籤,告訴用戶 X 圖標會引發 Y 動作。
We assume everyone knows what a save icon does. My mother used floppy disks for a few years but has undoubtedly forgotten all about their functionality. I see interface after interface that use only icons for actions such as “New document”, “Copy”, and “Delete”. Sometimes I’ll be walking her through some sort of interface over the phone and I’ll tell her to delete a file, only to realize that “Delete” is an icon. I’ll have to tell her at that point to search for some icon that looks like a trash can or an “X” or something. I’ve heard her say something genius after finding it like “Why doesn’t it just say ‘Delete’?”.
→ Takeaway:
Icons are really easy to use and guarantee a size in an interface. You don’t have to worry about text running long on a tool bar or issues with translation. It’s an easy crutch to lean on. But, what good is the design if the user can’t figure it out? Try to use descriptive labels along-side icons to teach users that X icon means Y action. Here is an excellent article on the usability of icons.

4. 她不是一個高級用戶(She is not a power user.)


我不知道告訴母親多少次有關 Ctrl+C 和 Ctrl+V 的用法,但她從來不用。她的 iPhone 也僅僅是用來發短信、打電話和發郵件,而語音信箱是這樣的:「你好,我現在無法接聽你的電話。請留下你的名字和號碼,我有空就會回覆你。」她甚至不清楚手機可以儲存電話號碼。高級用戶的功能是非常方便的,但要是有高級用戶的指導就更好了,她們需要這樣的指導來瞭解如何使用。
I can’t remember how many times I’ve told my mother to press ctrl+C then ctrl+V to copy and paste something. She’s never going to get it, and that’s okay. She is also brand new to gestures. I bought her an iPhone about a year ago, and she doesn’t use many apps. She texts, makes phone calls, and checks her email. That’s about it. She doesn’t understand that checking for new emails means you just need to pull down to refresh on the inbox view. She feels the need to hit the home button to close the app and open up her mail app again to see if there are any new messages.
I remember calling her the other day and she didn’t answer. It went over to her voicemail:
Hi, I’m not here to take your call right now. Please leave me your name and your number, and I’ll get back to you as soon as I can.
She doesn’t realize that her iPhone does that for her. It will show her a missed call, the time of the call, their number, and if she knows them, their name. Yet, it’s almost automatic for her to set up her voicemail with that message. Would this be solved by the iPhone telling her to record a different sort of message? Maybe.
→ Takeaway:
Having power-user features is great. Teaching people how to become power users is even greater. Don’t assume your users know how to copy and paste from a keyboard shortcut. Don’t assume that your users know that they don’t have to continue to do things the old-school way. Teach them how to do things faster without alienating new users.

5. 她不介意一直點擊(She doesn’t mind clicking.)


有一種說法,越高的點擊頻率等於越爛的用戶體驗,我一直很無視那種說法。我認為自己是一個高效率的用戶,但從來不會抱怨一個網站為了完成某個動作而需要點擊太多次數。好的設計並不意味著少的設計,而是簡單的設計。
There’s this idea that more clicks equates to a bad user experience. I hate that concept. I consider myself to be a very proficient web user and I can’t remember ever complaining about a website having too many clicks to achieve something. I’ve watched my mother fumble through websites that try to keep everything on one page. The thing she says over and over during the process is “Am I doing it right?”. If I wasn’t there to reassure her, her guess would be no.
→ Takeaway:
Again, give your users visual feedback that they are accomplishing the task they’ve set out to do. “Simple design” doesn’t mean less design. It means easy. Splitting up a form into four parts instead of one makes it less intimidating and reassures your user along the way that they are doing it correctly. Don’t handicap your interface by creating a “simple” one-page form when a four-page form is more useable.

6. 她只是想做自己的事,並希望能跟上世界的節奏(She just wants to do her thing and feel like she’s connected.)


我母親上網只做三件事,支付帳單、看 Netflix 視訊和與孩子們保持聯繫。當 Facebook 改版之後,她花了很長時間才習慣新的界面,才記住哪些按鈕都改到了哪裡。她用的網上銀行卻很好,7 年時間在 IE8 上的操作習慣一直沒變。如果你要更新或者重新設計一個擁有眾多忠誠用戶的網站,考慮清楚哪一些選單按鈕是不得不改動的,能儘量保持原樣則儘量保持。
My mother uses the internet for some very basic reasons. I can probably name all three: Pay bills, watch Netflix, and keep in contact with her kids. Every couple of months, Facebook changes their interface on her and she has to relearn everything she knew about it, hoping that some of the old icons and menus are still where she remembers. Netflix does a good job at keeping the interface friendly and reassuring. Facebook does not. She just keeps looking at her wall to see photos of her kids and grandkids and hopes that the devs at facebook don’t change it again on her one day. Her bank, interestingly enough, is easy for her to use because it hasn’t changed in about 7 years. It still works on IE8, uses labels in English, and is small enough of a design to be seen in the real-estate allowed by all of the toolbars in her browser.
→ Takeaway:
Understand that if you are redesigning a website that has loyal users, drastically changing an interface on them means they have to relearn all of the links and menus, and that will probably drive them away in frustration. Keep some old elements in the same place. Update icons to look nicer, but maintain some of the old feel for familiarity.

Conclusion

我母親並不笨,相反我一直覺得她是一個非常聰明的女人,而更重要的是,她想要成為我們每天所創造出來的新事物的一份子,她想參與其中,我相信世界上有千千萬萬的母親都是如此。把界面設計做得易懂做得同樣適合她們,是我們義不容辭的責任,因為是她們,我們才會站在這兒,試圖創造奇蹟。
Make no mistake. My mother is a very, very smart lady. She loves technology and sees the wonder in it that we all do. She is not a sour old person that rattles her cane at young peoples’ new-fangled devices.
She’s hip. She’s with it.
Most importantly she wants to be part of the great things we are all creating every day as do millions of mothers all over the world. It’s our job to make these new things as fun and exciting as it is to us, to the people that taught us and helped us get here in the first place.

Source: thenextweb.comTranslate: 36Kr. 由於中文版總是省略了些東西,附上原版也能順便練習英文!

留言

本月最夯

偷用電腦,怎知?事件檢視器全記錄!(開機時間、啟動項時間...)

[Chrome] 不用任何擴充功能,Chrome 內建開發者工具讓您輕鬆下載任何影片!