2023-1-5 濤濤
Apple One里面有6款不同類(lèi)型的應(yīng)用捆綁在一起，頁(yè)面開(kāi)篇這6款應(yīng)用圖標(biāo)橫向平鋪，隨后依次翻轉(zhuǎn)，接著Apple One也翻轉(zhuǎn)出來(lái)，向用戶(hù)強(qiáng)調(diào)它們被包含在該產(chǎn)品里。
品牌圖標(biāo)演化出多種圓形內(nèi)容，內(nèi)容還會(huì)不斷變化切換，最后又融合成品牌圖標(biāo)，簡(jiǎn)單明了直觀告訴用戶(hù)這個(gè)功能可以解決用戶(hù)哪些問(wèn)題。
開(kāi)篇在淺黃色背景上告訴用戶(hù)智能家居應(yīng)用被重新設(shè)計(jì)，隨后不斷加深的黃色房屋造型逐漸由大變小疊加起來(lái)組成了Home app的圖標(biāo)，引出介紹內(nèi)容；通過(guò)放大品牌情感溫度從而向用戶(hù)傳達(dá)品牌理念。
為了讓更多的人使用Apple Pay，蘋(píng)果向用戶(hù)展示了真實(shí)的使用過(guò)程，降低認(rèn)知成本，讓用戶(hù)更容易接受并使用。
用全屏視頻內(nèi)容刺激用戶(hù)感官，然后內(nèi)容逐漸縮放到電視內(nèi)，一開(kāi)始就把試聽(tīng)體驗(yàn)注入到了用戶(hù)腦海中。
背景顏色及內(nèi)容伴隨電視中的視頻一同切換，讓用戶(hù)明確感知產(chǎn)品能做哪些內(nèi)容。
特寫(xiě)展示遙控器，隨著遙控器角度變化，內(nèi)容也跟著變化，就像有位銷(xiāo)售拿著產(chǎn)品在你面前，詳細(xì)為你講解每一個(gè)按鍵的功能。
蘋(píng)果錢(qián)包圖標(biāo)及文字逐漸放大向下移動(dòng)，并將文字頂出屏幕以外；整體接著放大，錢(qián)包底子繼續(xù)下移消失，只留下錢(qián)包內(nèi)的彩色卡片，說(shuō)明文字上升出現(xiàn)。
隨著頁(yè)面往下，藍(lán)色卡片向上移動(dòng)，卡片內(nèi)文字漸顯，頁(yè)面整體變成藍(lán)色，蘋(píng)果巧妙的將圖標(biāo)元素與賣(mài)點(diǎn)內(nèi)容結(jié)合，并通過(guò)不同顏色來(lái)區(qū)分不同內(nèi)容。
滑到頁(yè)面最底部，四張彩色卡片又逐漸插到錢(qián)包里，最后再?gòu)?qiáng)調(diào)用戶(hù)去使用。
賣(mài)點(diǎn)先后出現(xiàn)，層層遞進(jìn)，隨后產(chǎn)品被新功能及核心特點(diǎn)彈開(kāi)， 將產(chǎn)品大、有多大、續(xù)航強(qiáng)以及新功能先后映射到了消費(fèi)者腦海里。
產(chǎn)品用廣角的視角依次出現(xiàn)，一方面展示產(chǎn)品顏色規(guī)格、另一方面暗示產(chǎn)品屏幕大。
Plus和電池一同進(jìn)行充電動(dòng)畫(huà)，僅僅一個(gè)關(guān)鍵詞和一個(gè)圖標(biāo)，就形象的描述了電池容量大的事實(shí)，緊接著更加具體的參數(shù)逐一顯示，強(qiáng)化究竟有多大。
產(chǎn)品旋轉(zhuǎn)運(yùn)動(dòng)最后合并成一個(gè)由大變小，最后出現(xiàn)價(jià)格，強(qiáng)調(diào)改產(chǎn)品很實(shí)惠。
手機(jī)旋轉(zhuǎn)放大，原來(lái)的桌面壁紙變成了產(chǎn)品賣(mài)點(diǎn)的背景，將產(chǎn)品和賣(mài)點(diǎn)順滑的聯(lián)系在一起。
電池圖標(biāo)與賣(mài)點(diǎn)一起進(jìn)行充電動(dòng)畫(huà)，將賣(mài)點(diǎn)順其自然的表達(dá)出來(lái)。
讓每一句文案絲滑的連接出現(xiàn)，讓用戶(hù)能夠感知出產(chǎn)品低延遲的優(yōu)點(diǎn)，接著產(chǎn)品側(cè)影出現(xiàn)將之前內(nèi)容擦除，引出處理器的強(qiáng)大。
就如賣(mài)點(diǎn)所說(shuō)，產(chǎn)品很貼心的前后為你旋轉(zhuǎn)展示它的面板，讓用戶(hù)看的真真切切。
水花下落被手機(jī)彈開(kāi)，直觀的告訴用戶(hù)它是防水的。
漆黑的背景寫(xiě)著14Pro的標(biāo)題，隨后標(biāo)題消失，同時(shí)產(chǎn)品從無(wú)限大縮小，看完這個(gè)動(dòng)畫(huà)才發(fā)現(xiàn)，原來(lái)之前漆黑背景是新款產(chǎn)品的靈動(dòng)島，隨后靈動(dòng)島展示了在不同場(chǎng)景下的狀態(tài)，吸引了用戶(hù)注意。
產(chǎn)品說(shuō)明內(nèi)容使用新款手機(jī)墻紙進(jìn)行漸變顯示，加強(qiáng)了用戶(hù)對(duì)新款產(chǎn)品的感知。
運(yùn)用視差，營(yíng)造空間感，手機(jī)和里面的內(nèi)容先是很大，并且展示第一段說(shuō)明內(nèi)容；隨著鼠標(biāo)往下滑，手機(jī)縮小屏幕內(nèi)容變化，營(yíng)造了一個(gè)真實(shí)的場(chǎng)景畫(huà)面，來(lái)強(qiáng)化新功能的賣(mài)點(diǎn)。
標(biāo)題不斷放大，文字中間的圓逐漸演變成一個(gè)圓角矩形，隨后帶出靈動(dòng)島功能動(dòng)畫(huà)，用戶(hù)從頭到尾都沉浸在蘋(píng)果編排的情節(jié)中，用戶(hù)喜歡了解新功能也就順理成章了。
內(nèi)容往下看，箭頭按鈕從左向右滑動(dòng)，顯示查看詳細(xì)內(nèi)容的入口，引導(dǎo)用戶(hù)點(diǎn)擊查看，這樣做沒(méi)有哪位用戶(hù)會(huì)拒絕自己的好奇心點(diǎn)進(jìn)去看看。
最開(kāi)始只有大標(biāo)題和一個(gè)科技感的芯片，隨著頁(yè)面下滑，詳細(xì)內(nèi)容顯現(xiàn)，芯片伴隨著分層鏡頭元素逐漸組裝起來(lái)，展現(xiàn)出了產(chǎn)品的科技與精密。
手機(jī)背部攝像頭用特寫(xiě)鏡頭伴隨機(jī)身從平視到俯視的角度變化，將用戶(hù)視線引到攝像頭上，隨后顯示說(shuō)明文案強(qiáng)化產(chǎn)品宣傳。
開(kāi)篇全屏出現(xiàn)一朵具有科技感的3d花朵收攏綻放的視頻，隨后鏡頭后推，2臺(tái)產(chǎn)品旋轉(zhuǎn)展開(kāi)，呈現(xiàn)出一個(gè)展翅翱翔的造型，傳達(dá)出產(chǎn)品性能強(qiáng)勁展翅高飛的勢(shì)能。
處于合起的筆記本漸漸被打開(kāi)，里面播放著三維動(dòng)畫(huà)界面，暗示用戶(hù)它正在處理三維任務(wù)，隨后旋轉(zhuǎn)出2臺(tái)電腦，關(guān)于電腦的核心參數(shù)被顯示出來(lái)，告訴用戶(hù)具體哪些性能有了提升。
電腦屏幕做爆炸圖動(dòng)畫(huà)處理，形象展示內(nèi)部結(jié)構(gòu)，吸引用戶(hù)關(guān)注產(chǎn)品特點(diǎn)內(nèi)容。
多臺(tái)不同顏色的電腦旋轉(zhuǎn)排列，鏡頭不斷變換角度，最后依次排在一起用側(cè)視圖來(lái)喚出標(biāo)題，在營(yíng)造出歡快的氛圍的同時(shí)，還體現(xiàn)出產(chǎn)品多彩的特點(diǎn)。
顏色文案內(nèi)容不斷切換，電腦變換不同組合方式輪番切換展示，接著營(yíng)造歡快氛圍。
體現(xiàn)電腦薄的文案放大顯示，隨著頁(yè)面往下，文字縮小，逐漸被電腦側(cè)邊遮住，用動(dòng)態(tài)對(duì)比的方式讓用戶(hù)感受到電腦的厚度很薄，再往下，屏幕微抬，搭配關(guān)于屏幕旋轉(zhuǎn)角度的賣(mài)點(diǎn)。
電腦切換顏色體現(xiàn)內(nèi)容發(fā)生變化，旋轉(zhuǎn)角度可以全方位看清新版插口的位置以及體現(xiàn)更方便的使用。
支持多方應(yīng)用的文案在應(yīng)用圖標(biāo)的包圍中下落，下落的過(guò)程中同步顯示的應(yīng)用可以體現(xiàn)支持的應(yīng)用多，最后和詳細(xì)介紹文案碰撞，可以很好的銜接用戶(hù)的閱讀視線。
產(chǎn)品逐漸被放大，鏡頭進(jìn)入內(nèi)部，里面迸發(fā)碰撞的液體體現(xiàn)產(chǎn)品內(nèi)部有著強(qiáng)勁動(dòng)力。
承接上一個(gè)內(nèi)容，體現(xiàn)剛才那么強(qiáng)大的動(dòng)力的源泉就在你眼前，去選一個(gè)吧，伴隨著芯片的光影運(yùn)動(dòng)，讓你覺(jué)得這是一個(gè)具有魔法般的嶄新器物。
深入產(chǎn)品內(nèi)部，不同顏色的光束旋轉(zhuǎn)流動(dòng)，用具象的形式體現(xiàn)產(chǎn)品在散熱方面的工作原理以及性能是多么強(qiáng)。
產(chǎn)品快速運(yùn)動(dòng)對(duì)文字造成拖尾效果，體現(xiàn)產(chǎn)品的輕，以及速度快。
文案內(nèi)容居于2臺(tái)電腦狹小縫隙之間，有一種壓迫感，體現(xiàn)出新產(chǎn)品的實(shí)力很強(qiáng)大，緊接著M2芯片由大變小出現(xiàn)，交代出產(chǎn)品之所以強(qiáng)大得益于芯片。
屏幕里的應(yīng)用在不停的變換，體現(xiàn)電腦在進(jìn)行不同的應(yīng)用操作，隨后文字出現(xiàn)，強(qiáng)調(diào)續(xù)航能力很高。
2臺(tái)電腦屏幕旋轉(zhuǎn)變化，對(duì)比出2者間攝像頭位置做了更新。
產(chǎn)品旋轉(zhuǎn)，展現(xiàn)輕薄側(cè)面，搭配攜帶更少，攜帶更多的文案，讓消費(fèi)者更加肯定它的輕薄。
看了蘋(píng)果公司網(wǎng)站中的動(dòng)畫(huà)，不難看出，動(dòng)畫(huà)的核心功能就是用關(guān)聯(lián)的方式強(qiáng)調(diào)、強(qiáng)化賣(mài)點(diǎn)
具體方法如下：
1、產(chǎn)品如果有多種顏色，那就盡量在畫(huà)面中一起體現(xiàn)
2、讓產(chǎn)品自己說(shuō)話，善于利用產(chǎn)品的不同角度、運(yùn)動(dòng)方式強(qiáng)化產(chǎn)品功能特征
3、不做無(wú)用動(dòng)畫(huà)，讓每一個(gè)動(dòng)畫(huà)表達(dá)明確的意圖，不要讓用戶(hù)覺(jué)得它只是在動(dòng)
4、把控文案展現(xiàn)在用戶(hù)眼前的先后順序，用故事把它們串聯(lián)在一起，從而掌控用戶(hù)閱讀節(jié)奏
最后我們?cè)囅胍幌拢绻W(wǎng)站中的動(dòng)畫(huà)內(nèi)容全部變成靜態(tài)，那會(huì)帶來(lái)什么樣的后果
1、內(nèi)容會(huì)變得枯燥，賣(mài)點(diǎn)得不到強(qiáng)化，用戶(hù)購(gòu)買(mǎi)欲下降
2、靜態(tài)內(nèi)容很難描述一些抽象的功能，例如：如何體現(xiàn)產(chǎn)品散熱很好，音質(zhì)怎么個(gè)好法
3、內(nèi)容太多占空，原本一個(gè)動(dòng)畫(huà)就能說(shuō)明的內(nèi)容，非要寫(xiě)大篇文字
藍(lán)藍(lán)設(shè)計(jì)的小編 http://m.skdbbs.com