APP中Screenshot的設計要領和各發布渠道的要求
在APP設計環節中,有一項比較容易漏掉的就是screenshot的設計,翻譯成中文是「屏幕快照」。它是放在AppStore或者其它各大應用商店,進行APP的功能簡介的圖片(如下圖微信的screenshot),目的是為了讓用戶在下載之前,就能通過看這些圖片對APP「是幹什麼用的」有一個大概的了解,可能也會包括「怎樣用」的教學點在裡面,即咱們平時研究事情的what與how原則的介紹。
在各大設計平台中很少有人專門說它,一方面是因為,它算是在APP設計範疇以內比較收尾的工作。如果說某款APP要從0到1開始設計的話,這部分工作是要等到設計師將圖片資源輸出給開發人員之後才開始有精力集中於這一塊內容的設計。二是,設計這一塊內容的童鞋很可能與設計APP內容的童鞋不是同一個人,而對這一塊內容與APP的相關性沒有過多思考。
如上所述,screenshot的主要作用是通過幾張圖片介紹APP的主要功能。後來又增加了視頻展示的功能。那麼在設計的過程中應該怎樣下手,以及有哪些情況需要注意的呢?
1.種類上需要準備iPhone和Apple watch
1.圖片數量控制在3~5張之內,最好不要超過5張。一般情況下,設計師拿到進行設計screenshot的需求時,產品會給出一個character list(功能列表),告訴設計師需要表達哪些功能點,而設計師就有個頭緒從哪裡開始入手。screenshot有幾種設計風格,一是直接將APP的界面進行呈現(如下圖微信的方式);二是用簡短的文字描述加上手機場景圖(如下圖QQ的表達方式),這種圖文結合的表達方式對用戶來說更加清楚,更好理解。
圖片(包括視頻)可以是橫的,也可以是豎的,尺寸以iPhone兩倍的屏來750x1334px著手設計比較合適。橫屏顯示的方式多出現在遊戲APP中。如果考慮多語言表達,則需要導出兩套不同的語言的圖片。(有時候AppStore對於地區的判斷也會出現一些誤差,比方說英文系統下出現中文圖片,中文系統下出現英文圖片,anyway,這不太影響設計師的工作)
在UI的風格上有呈獨立設計的風格,也有比較有趣的類似背景有一定的連續性,用來引導用戶繼續看下去。
2.視頻長度最好不超過30s。
超過30s的視頻顯得比較冗餘,用戶沒有耐心看下去,所以需要對內容進行精簡。還有一點需要提及的是,視頻上傳通道只有一個,多語言也只能用一個。如果是國際化的APP的話,建議錄製的視頻裡面的文字用英文,適用範圍比較廣泛。
3.安卓相關發布渠道。
國內安卓渠道列表(點擊可以直接訪問)應用匯:http://http://dev.appchina.com/dev/index豌豆莢:http://open.wandoujia.com/app/add應用寶:http://op.open.qq.com/mobile_appinfov2/apkinfo?appid=1104845090百度手機助手:http://app.baidu.com/apps/create安智:http://dev.anzhi.com/soft_all2.php360: http://dev.360.cn/mod/createmobile/app?appType=soft華為:http://developer.huawei.com/cn/consumer/devunion/openPlatform/html/memberCenter.html#appManage#小米:http://dev.xiaomi.com/app/create?userId=494175390聯想開放平台:http://open.lenovo.com/developer/login_info.jspx搜狗手機助手:http://zhushou.sogou.com/open/app/add.html魅族開放平台:http://developer.meizu.com/console/apps/publish?t=146177931870
基本上安卓導出的screenshot的圖片尺寸比例會變,每個平台要求不太一樣,所以每個平台需要檢查一下。最好每個平台都用一套畫板進行導出,以後在更新版本的時候修改起來也更加方便。需要強調的是小米要求比較多,除了尺寸規格為7201280 或 10801920,還要注意的是應用截圖中手機外觀素材要為小米手機外觀,素材下載地址http://dev.xiaomi.com/doc/?p=354
當經歷過APP設計所有的環節之後,思考方式會發生一些轉變,在設計功能點的時候,會更有全局觀,將所有相關聯的部位都串聯起來進行考慮。如果進入這一狀態,恭喜你,成功進階了一級,再接再厲!
Sophia的tips:看似瑣碎的事情,一個個都認真完成了,不知不覺就會成為專家!
職場設計教程搶先看~一枚愛折騰、愛健身的設計師妹紙~
詳情請關注微信公眾號:Sophia的玲瓏閣,獲取更多有關交互、健身及其它相關信息。
推薦閱讀:
※第二期開源項目第一周總結
※【免費直播】SU插件情報局 | MSPhysics帶你開車帶你飛
※淺析Feed內容定位與趨勢
※我為設計師總結了以下5種職業發展規劃。
※那園,那貓,那狗——郭茨口394號,在心中留住家園的樣子……