《UI設(shè)計》課件-4.UI什么是APP設(shè)計改版

`INTERFACE

DESIGN`UI設(shè)計基礎(chǔ)課程案例X光片＋內(nèi)衣氧氣APP創(chuàng)始人徐黛妮01氧氣最大亮點是場景化描述商品:文字+圖片用到具有故事性的組圖表達(dá)形式，將產(chǎn)品放在讀者生活或向往的場景中拍攝。圖片營造的生活方式刺激讀者的購買欲，而不是產(chǎn)品本身。內(nèi)衣導(dǎo)購+內(nèi)衣文化分享→內(nèi)衣電商+小額庫存→UGC2014年6月，氧氣正式上線。通過場景化描述內(nèi)衣的方式，推薦和售賣內(nèi)衣。（UserGeneratedContent，用戶生成內(nèi)容的意思）消費者：女性（“正在從女孩到女人蛻變”的一群人）如何獲?。好赓M贈予，邀請為平臺內(nèi)衣代言如何持續(xù)：內(nèi)衣文化社區(qū)（PGC+UGC）引導(dǎo)用戶產(chǎn)品是什么：內(nèi)衣（有形），態(tài)度或價值觀（無形），場景式販賣體驗怎么付費：免費（試穿+拍照上傳到社區(qū)），購買（*場景式）產(chǎn)品如何到手中：郵寄，平臺展示01需求——流量（消費者？如何獲?。咳绾纬掷m(xù)？）交易——物流/資金從《胤禎美人圖》、《紫禁城祥瑞》，到獻(xiàn)給小朋友的《皇帝的一天》再到《韓熙載夜宴圖》，《每日故宮》已經(jīng)是故宮博物院發(fā)布的第五個App類產(chǎn)品了02每日故宮藏品高清圖＋筆記+日歷特殊節(jié)慶的動畫效果，跳轉(zhuǎn)到當(dāng)天即可查看消費者：專業(yè)人士、深度愛好、小眾如何獲?。汗蕦m文創(chuàng)大IP的周邊，興趣導(dǎo)向如何持續(xù)：工具類，暫無02需求——流量03需求——流量（消費者？如何獲??？如何持續(xù)？）除了最基礎(chǔ)的記步功能，Walkr還添加了社交元素。添加好友后，可以共同打造星際艦隊，還可以拜訪好友的銀河。/app/6860?utm_source=baidu&utm_medium=sem&utm_campaign=WalkrWalkr的規(guī)則是，把你的步數(shù)作為動力來驅(qū)動飛船，只需要多走走，你就可以駕駛飛船探索應(yīng)用里的數(shù)百顆星球：能欣賞各種各樣的星際美景，還能與各種奇怪的外星生物在星河里相遇。04AT是一款時間追蹤工具，簡單地說就是設(shè)立一個目標(biāo)時間，紀(jì)錄你離那個時間點還有多遠(yuǎn)。軟件的操作非常簡單，配色也很清新可愛，還有一些角色可以選擇，啟用桌面部件能讓你更方便地查看時間。需求——流量（消費者？如何獲取？如何持續(xù)？）AT實用起來非常簡單，首先你可以用它來跟蹤一個日期。寫上項目名稱，選好開始和結(jié)束日期，再選一個自己喜愛的角色，一個日期追蹤就這么建立好了。消費者：在往常的工具類中玩出新意如何吸引：游戲化，有趣，視覺04需求——流量（消費者？如何獲?。咳绾纬掷m(xù)？）產(chǎn)品使用對象Productconsumers

主要使用對象與使用場景

須了解使用者與購買者(TA)是誰，在什么狀況(Context)下使用，從中發(fā)展可提高黏度/非用不可的情境應(yīng)用工具：自主使用工具，社區(qū)：單人、多人使用綜合體：多種利益團體，或系統(tǒng)A為B(如老人、小孩、寵物等）或ABCD等就話題或興趣聚在一起與日常生活相聯(lián)系，自己查詢數(shù)據(jù)平臺如淘寶平臺連接商家和買家如醫(yī)院平臺連接醫(yī)生和病患如健身平臺連接健身房或私教和需要運動的人綜合體附錄1：APP類型工具社區(qū)（社交屬性/興趣導(dǎo)向/交易）reflectlyapp2019年Google最美應(yīng)用例子在week8素材UIUX案例研究：我的停車場UIUX案例研究概念A(yù)PP：寵物飲食APP改版提案改版項目流程，提綱參考選擇一款A(yù)PP進行改版提案(userstory和功能需求；用戶畫像)(思維導(dǎo)圖整理要改版的界面功能)【例1】/work/ZNDg3NzA3NTI=.html【例2】根據(jù)尼爾森的十大交互原則來檢驗現(xiàn)有APP存在的問題選擇一款A(yù)PP進行改版提案(userstory和功能需求；用戶畫像)(思維導(dǎo)圖整理要改版的界面功能)6、尼爾森十大交互原則大作業(yè)

匯報內(nèi)容：1、什么APP？什么用戶?解決用戶什么問題？2、該APP目前的競品有誰？通過體驗該產(chǎn)品及同類競品，你發(fā)現(xiàn)了所選APP具備哪些問題？3、通過與用戶了解、資料搜索整理、界面體驗（尼爾森十大交互原則）等方式發(fā)現(xiàn)了哪些問題或哪些需求，需要進行改進?4、原APP的功能架構(gòu)圖如何？你們團隊打算從哪幾個方面入手進行改版？列出相應(yīng)的時間、計劃5、改版頁面不少于12個本PPT觀點來自黑馬青年目錄1、改版的目的，從不做無意義的事情；2、制定時間規(guī)劃，是為了治療懶病；3、如何挑選改版產(chǎn)品，再也不是選“美”了；4、體驗，這是你的第一次深度探尋；5、功能梳理，理清流程好開工；6、競品分析，做好知己知彼；7、素材采集，打開禁錮的思維；8、體驗，走了一圈才發(fā)現(xiàn)你可以更好；9、交互設(shè)計，實現(xiàn)你心中的更好；10、設(shè)計風(fēng)格推導(dǎo)，符合產(chǎn)品的設(shè)計趨勢運用；11、界面設(shè)計，碎片化積累；12、審核，尋找導(dǎo)師；13、調(diào)整優(yōu)化，不放過任何一個細(xì)節(jié)；14、包裝，整理設(shè)計思路；15、分享，設(shè)計交流。1、改版的目的，從不做無意義的事情在真實的場景中，有一部分設(shè)計師也存在著以下情況：a.項目參與度低，沒有更多的機會發(fā)揮自己的專業(yè)；b.公司產(chǎn)品迭代緩慢或者視覺支持較小，空余時間較多；c.沒有機會在項目中嘗試一些新的設(shè)計語言；d.自學(xué)UI中，沒有真實項目能夠發(fā)揮；e.增強設(shè)計效率和產(chǎn)品設(shè)計思維等能力。如果你擁有以上的情況之一，利用自己的業(yè)余時間進行APP設(shè)計改版將會給你帶來更多的提升空間，不但可以通過練習(xí)增強自己的設(shè)計效率，也能體驗更加豐富的產(chǎn)品設(shè)計。在改版中也能不斷加強一些交互或者產(chǎn)品的思維，可以讓你在以后的工作項目中不局限在視覺層面，具備更多的產(chǎn)品思考，做出更合理的設(shè)計。2、制定時間規(guī)劃，是為了治療懶病制定時間規(guī)劃不僅可以合理的利用好自己的業(yè)余時間，也能更好的按照這個規(guī)劃表去逐步的推進這次改版項目，把一個大的事項拆分為若干的小事項，每天推進一部分，一次改版設(shè)計很快就在不斷的推進中被完成。APP改版時間規(guī)劃表大家可根據(jù)自己的習(xí)慣設(shè)置，表格形式還是簡單的文字記錄都可以，進度把控需要結(jié)合自身情況而定，確保其有效性。3、如何挑選改版產(chǎn)品，再也不是選“美”了面對應(yīng)用商城里面海量的APP產(chǎn)品，你是否有點不知所措，如果選擇一個自己從來不玩的APP，改版的時候?qū)Ξa(chǎn)品的服務(wù)模式、功能架構(gòu)、交互邏輯等都是比較陌生的，需要一定的時間進行學(xué)習(xí)。如果選擇一些大型的產(chǎn)品，由于其自身的設(shè)計團隊就是非常的專業(yè)，你很難從中發(fā)現(xiàn)可以優(yōu)化的點，即使勉強進行改版，也會發(fā)現(xiàn)自己設(shè)計得不如原版的好，進而打擊自己的自信心。通過上面的分析，我們在挑選改版產(chǎn)品的時候，需要結(jié)合自身的一些情況先做出一定的預(yù)判，然后再去挑選現(xiàn)階段相對比較符合的產(chǎn)品進行改版練習(xí)。a.挑選自己接觸過的直接產(chǎn)品或者間接產(chǎn)品；b.對APP里面所提供的產(chǎn)品或者服務(wù)比較認(rèn)可或者沒有一定的排斥感；c.挑選無論是視覺層面還是交互層面都有一定優(yōu)化空間的產(chǎn)品，別輕易嘗試精品；d.如果身邊有朋友使用過的產(chǎn)品優(yōu)先考慮，因為可以成為你調(diào)研數(shù)據(jù)的來源；e.選擇陽光積極型的產(chǎn)品，不做傳遞負(fù)能量或者違反規(guī)定的產(chǎn)品；f.初次嘗試APP改版設(shè)計，從輕量級的產(chǎn)品入手，可以控制練習(xí)時間和自己的駕馭度。*輕量級：即產(chǎn)品功能專注做一件事情，如工具類的備忘錄、天氣、記賬等。4、體驗，這是你的第一次深度探尋這個過程需要你對產(chǎn)品有一個很深入的了解，不只是熟悉主流程操作邏輯，對一些偏冷門的功能操作也要非常的熟悉，如果是需要注冊使用的產(chǎn)品，一定不要忽略注冊會員以后的體驗。最終達(dá)到的級別是你可以向身邊任何一位朋友輕松的進行推薦和演說，能夠通過你的講解讓他輕松地學(xué)會使用該產(chǎn)品。5、功能梳理，理清流程好開工當(dāng)你對改版APP進行第一次深度體驗之后，利用思維導(dǎo)圖軟件繪制出整個產(chǎn)品的功能結(jié)構(gòu)圖，思維導(dǎo)圖軟件種類很多。第一次進行功能梳理無需進行增刪處理，真實還原產(chǎn)品現(xiàn)有功能即可，其目的是整理自家“倉庫”，做到心中有數(shù)。在進行功能梳理的時候，如果遇到操作復(fù)雜的功能需要備注信息，以便自己后期預(yù)覽時能夠快速理解其含義。如果是第一次做功能結(jié)構(gòu)圖越詳細(xì)越好，這將有助于你充分理解每個功能傳達(dá)的含義。6、競品分析，做好知己知彼深度體驗完改版APP之后，做了功能結(jié)構(gòu)圖，此時你對所需要改版的APP以及這個行業(yè)的產(chǎn)品都有一定的認(rèn)知，此時你再去體驗直接競品和間接競品必然是以一個專家級用戶的水平去探尋。在體驗過程中需要結(jié)合改版產(chǎn)品的功能進行對比，可能第一遍體驗無法很好的進行對比，所以需要至少體驗3次以上才能很好的得出對比的結(jié)論。體驗產(chǎn)品時需要注意的幾個維度：a.不要急于進行總結(jié)，先進行至少3次以上體驗；b.先看整體布局再分析局部細(xì)節(jié)；c.重點功能交互形式需要提取出來進行對比；d.主界面的各版塊布局設(shè)計需要進行對比；e.配色分析，作為改版時的配色優(yōu)化指導(dǎo)；f.圖標(biāo)和組件庫的分析，找出細(xì)節(jié)的優(yōu)化方向。進行競品體驗時，盡可能多的找出差異化的設(shè)計形式，作為改版APP優(yōu)化的指導(dǎo)方向。由于作為UI設(shè)計師進行APP改版練習(xí)更多是視覺優(yōu)化為主，交互優(yōu)化為輔，所以我們需要在相同模塊上面找出更多不同的設(shè)計樣式，作為視覺優(yōu)化的方向。如果你自身交互能力較好，也可以以交互優(yōu)化為主，視覺優(yōu)化為輔，這個可以結(jié)合自身情況選擇。在進行競品體驗的時候也要根據(jù)優(yōu)化目的的不同，著重的轉(zhuǎn)移體驗的重心。7、素材采集，打開禁錮的思維通過競品體驗?zāi)銜偨Y(jié)出改版APP各個模塊的差異化，相同的功能模塊各自產(chǎn)品的交互形式、布局樣式、視覺風(fēng)格都存在各自的差異。此時，你對改版APP中的很多設(shè)計都一個初步的優(yōu)化清單，你需要再深入一步，因為競品的設(shè)計樣式不一定就是值得借鑒的，我們需要尋找更多的靈感，打開自己禁錮的思維。通過國內(nèi)外的一些設(shè)計平臺、素材網(wǎng)站等我們可以去采集更多的設(shè)計樣式作為靈感借鑒，日常的一個采集收藏習(xí)慣也就變得尤為重要了，作為一個優(yōu)秀的UI設(shè)計師，我們需要養(yǎng)成這樣的習(xí)慣。個人平時經(jīng)常訪問的設(shè)計平臺有站酷、UI中國、致設(shè)計、Dribbble、Behance等，采集收藏靈感會經(jīng)常用Pinterest和花瓣，都是一些大家經(jīng)常訪問的平臺，所以不是別人知道你所不知的優(yōu)秀平臺，而是你沒有他的良好習(xí)慣。8、體驗，走了一圈才發(fā)現(xiàn)你可以更好采集完一些靈感素材之后，我們又回到體驗改版APP的起點，走了一圈之后你會發(fā)現(xiàn)改版APP中很多你可以入手優(yōu)化的方向，比起第一次體驗，你會更加有信心能夠做出一個不一樣的設(shè)計作品。再次進行產(chǎn)品體驗的時候，你需要帶著腦海中處理相同功能板塊的不同設(shè)計表現(xiàn)形式進行思考，尋找出更好的設(shè)計表現(xiàn)形式來解決這個功能模塊。在構(gòu)思優(yōu)化樣式的時候，可以繪制一些簡單的草圖，以防后期進行交互輸出的時候遺漏靈感細(xì)節(jié)。在進行設(shè)計優(yōu)化的時候先從靈感庫中尋找較為符合的樣式進行思維嵌套，然后再發(fā)散思維，融入自己原創(chuàng)性的思維，形成自己的原創(chuàng)思路。9、交互設(shè)計，實現(xiàn)你心中的更好作為UI設(shè)計師最終輸出的必然是高保真的視覺稿，那么交互原型設(shè)計是為了快速的把自己的思路展現(xiàn)出來，所以不局限于原型軟件的繪制，哪怕是紙上的草圖繪制也是可行的方案。最終的交互稿是給自己看的，所以能看懂就能達(dá)到最終的目的。10、設(shè)計風(fēng)格推導(dǎo)，符合產(chǎn)品的設(shè)計趨勢運用在開始進入界面視覺設(shè)計時，我們需要對整體APP設(shè)計做風(fēng)格推導(dǎo)，這將直接關(guān)系著最終界面呈現(xiàn)的效果。如果你是一位對行業(yè)趨勢關(guān)注的設(shè)計師，各種設(shè)計趨勢呈現(xiàn)在你腦海中，你需要進行篩選，結(jié)合改版產(chǎn)品的屬性選擇合適的設(shè)計語言去表達(dá)，切不可為了趨勢而犧牲產(chǎn)品定位。在進行風(fēng)格確定的時候，顏色的選擇也占據(jù)一定的因素，我們可以選擇改版APP現(xiàn)有的主色進行優(yōu)化，也可以進行推翻重選。如果是重新選擇配色方案，我們可以通過情緒版的方式在身邊朋友或者各種群里進行。也可以與競品形成視覺差異化，選擇一些形成對比的配色方案確定好配色方案之后，我們需要考慮設(shè)計的表現(xiàn)形式，無論是何種設(shè)計形式都需要符合產(chǎn)品的屬性。比如大標(biāo)題、大圓角卡片、大投影等設(shè)計表現(xiàn)形式會在視覺層面帶來不錯的效果，卻需要考慮信息量的因素，如果本身改版APP就屬于信息量很大的產(chǎn)品，在選擇時就要綜合考慮。根據(jù)APP的風(fēng)格定位，比如文藝類、娛樂類、兒童類等，那么設(shè)計的風(fēng)格也會對產(chǎn)品風(fēng)格定位起到一定的影響。11、界面設(shè)計，碎片化積累為了能夠充分利用好業(yè)余時間，我們需要把數(shù)十個界面分配到具體的日程中，最大程度的利用碎片化的時間進行積累。規(guī)定自己一天完成兩個界面，就要嚴(yán)格執(zhí)行，只有這樣你才能具備超強的戰(zhàn)斗力。12、審核，尋找導(dǎo)師歷盡艱辛你收獲了希望，一套APP改版設(shè)計作品初步完成，接下來你需要尋找到一位導(dǎo)師，俗話說當(dāng)局者迷，你自己構(gòu)思出來的東西需要得到驗證導(dǎo)師在哪里？a.可以是身邊的同事/同學(xué)/老師/目標(biāo)用戶，導(dǎo)師不一定是大神，旁觀者的意見都是具有一定的思考價值；b.通過一些設(shè)計交流群尋求意見c.通過設(shè)計平臺尋找那些活躍的老司機；d.機緣巧合下加上的大神微信或者QQ；13、調(diào)整優(yōu)化，不放過任何一個細(xì)節(jié)通過不同形式的意見反饋，我們即將面臨一次調(diào)整優(yōu)化，在眾多的反饋意見中，我們也不能盲目的進行修改。14、包裝，整理設(shè)計思路在進行作品包裝的時候，可以加入自己的設(shè)計思路輔助傳