蘋果的網(wǎng)站可以說是企業(yè)官網(wǎng)的設(shè)計中的佼佼者，從圖片、廣告詞、白色的背景等排版設(shè)計都十分的漂亮且直觀。

比如衛(wèi)龍辣條就深得蘋果頁面設(shè)計的“精髓”，曾經(jīng)靠模仿蘋果在網(wǎng)上大火一把。畫風(fēng)如下：

這讓人看完都不禁產(chǎn)生錯覺，是蘋果開始賣辣條了嗎?那么蘋果產(chǎn)品頁面設(shè)計究竟暗藏哪些玄機(jī)，可以如此的吸引人呢?

縱觀蘋果的產(chǎn)品頁面可以發(fā)現(xiàn)，網(wǎng)頁上有非常詳細(xì)的產(chǎn)品圖片、令人驚嘆的動畫效果和以用戶為中心的內(nèi)容。那么你是否認(rèn)真的思考過。蘋果的產(chǎn)品頁面和其他網(wǎng)站有什么不同?為什么閱讀蘋果產(chǎn)品描述會讓人感到輕松?為什么它能讓普通用戶也能理解一些難懂的技術(shù)術(shù)語。本文將從蘋果網(wǎng)站結(jié)構(gòu)、外觀以及內(nèi)容策略入手，介紹了各種蘋果產(chǎn)品頁面UX設(shè)計原則。下面，我們先來聊聊蘋果產(chǎn)品頁面結(jié)構(gòu)有哪些值得借鑒的地方。

這個部分一共分為四個點，不僅分析了一般的網(wǎng)頁結(jié)構(gòu)，還分析了蘋果使用采用的一些方式讓用戶更容易理解復(fù)雜的信息。

頁面分塊
蘋果產(chǎn)品頁面通常更喜歡將內(nèi)容分割成單獨的片段，在每個文本塊之間會有大片的留白，或者放入圖片或視頻片段，而不是冗長的無結(jié)構(gòu)段落。

除了每一頁的末尾的法律部分，用戶是很難在蘋果產(chǎn)品頁面上發(fā)現(xiàn)大段的文本內(nèi)容。將文本分成小段內(nèi)容，并分散在整個頁面各個位置，讓人感覺需要閱讀的內(nèi)容非常的少。

將信息分割成單獨的部分通常被稱為分塊，這不僅可以用于文本種，還可以用于處理任何類型的信息。一般來說，在一個網(wǎng)站上展示大量的信息，不僅會給人留下糟糕的第一印象，還會增加訪客離開的風(fēng)險，并且讓用戶更難記住信息。

例如，將一串很長的非結(jié)構(gòu)化數(shù)字“454678007”與結(jié)構(gòu)化版本“454-678-007”進(jìn)行比較。盡管這兩個數(shù)字內(nèi)容是相同的，但后者明顯更容易記憶。

注：圖片來自蘋果官網(wǎng)截圖。

極致的沉浸&互動效果
蘋果的產(chǎn)品頁面并不是直接將所有信息堆疊在一起，它還創(chuàng)造出了互動體驗。當(dāng)用戶滾動瀏覽頁面時，圖片跟著移動，文本淡入，產(chǎn)品動圖則直觀的展示了晦澀難懂的術(shù)語。

對于用戶而言，就不再是“囫圇吞棗”獲取產(chǎn)品的信息，而是在緩慢的瀏覽中，逐步探索每一個功能。

以瀏覽蘋果Air pods頁面為例，頁面上詳細(xì)3d動畫不僅展示了產(chǎn)品的表面，還展示了產(chǎn)品內(nèi)部的每一個微小的技術(shù)細(xì)節(jié)，這讓用戶能更深刻的了解到了產(chǎn)品重要細(xì)節(jié)。

注：圖片來自蘋果官網(wǎng)截圖。

讓用戶在3D空間中探索產(chǎn)品，不僅更接機(jī)實物，還提供了一種有趣的方法來在線營銷產(chǎn)品。由于傳統(tǒng)的電子商務(wù)網(wǎng)站主要依靠靜態(tài)的產(chǎn)品圖片和簡短的描述來銷售產(chǎn)品，用戶往往缺乏足夠的想象力來充分了解產(chǎn)品。相比之下，蘋果則提供了一種更具沉浸感的方式，讓用戶有機(jī)會以一種更有趣、更詳細(xì)的方式來查看和了解產(chǎn)品。

頁面帶來的“驚喜感”

不可否認(rèn)的是，蘋果已經(jīng)掌握了讓用戶感到驚喜的藝術(shù)。比如在瀏覽單個產(chǎn)品時候，網(wǎng)站轉(zhuǎn)換不斷變化，產(chǎn)品以多種方式移動和旋轉(zhuǎn)，只要用戶想看，就不會錯過任何細(xì)節(jié)特寫。

用戶瀏覽蘋果產(chǎn)品頁面時，看到的內(nèi)容不再是干巴巴的信息，而更像是經(jīng)歷了一場“旅程”，從文字到圖片都在不斷的切換。

營造社會認(rèn)同感

除了有詳細(xì)的產(chǎn)品照片、令人印象深刻的動畫和醒目的標(biāo)題，蘋果在網(wǎng)站還展示了社區(qū)驅(qū)動的內(nèi)容。比如藝術(shù)家們給出一些建議來改善沉悶的肖像照片，攝像師如何用新的iPhone Pro拍攝電影等等。

看完視頻后，讓人覺得像iPhone Pro或Apple Watch等產(chǎn)品不再是蘋果產(chǎn)品頁面上那些抽象的、精致3D圖片，而是人們?nèi)粘Ｖ袑崒嵲谠谑褂玫墓ぞ?。看完一個有一個視頻之后，就讓人會想擁有Apple Watch會是什么感覺。

展示其它人使用產(chǎn)品，還能建議可信度。與營銷驅(qū)動的產(chǎn)品頁面相比，社區(qū)驅(qū)動的內(nèi)容為客戶提供了一個基于他人經(jīng)驗創(chuàng)建意見的機(jī)會。傾聽別人的意見，而不是蘋果產(chǎn)品頁面上醒目的標(biāo)題，會給人一種聽別人意見的印象，也會讓潛在客戶更有可能決定購買他們一開始還在猶豫的產(chǎn)品。 

注：圖片來自蘋果官網(wǎng)截圖。

接著，我們再來講講內(nèi)容策。略除了提供高度身臨其境的網(wǎng)絡(luò)體驗、令人印象深刻的頁面切換效果等，蘋果還在標(biāo)題和文本編輯等內(nèi)容方面下了很大功夫，讓人產(chǎn)生共鳴。

產(chǎn)品頁面文案幽默且易于理解
盡管蘋果銷售高度技術(shù)化的產(chǎn)品，并享有高端品牌的美譽(yù)，但它仍保持著一種易于理解的、大多是非正式的、甚至是戲謔的語調(diào)。閱讀蘋果產(chǎn)品文本就好比是聽一個聰明、隨和、幽默的人在講述，下面這段話就很有趣，很有節(jié)奏，在句末回應(yīng)了用戶的普遍關(guān)注的問題，讓用戶感到被理解了。

比如iPhone SE的防水文案就做到了這點： “瀟瀟灑灑，笑對水花飛灑。iPhone SE 具備抗水性能，最多可在 1 米水深停留 30 分鐘2，因此，它無懼咖啡、茶水、汽水等液體的侵襲。至于灰塵?更是不在話下。”

注：圖片來自蘋果官網(wǎng)截圖。

將產(chǎn)品功能具象化
擁有一臺 2000 萬像素而不是 1000 萬像素的相機(jī)意味著什么?為什么新的iPhone SE的電池比你現(xiàn)有手機(jī)電池更好?當(dāng)然，當(dāng)用戶瀏覽技術(shù)細(xì)節(jié)頁面時，看到大數(shù)字會給人一種新產(chǎn)品優(yōu)于舊產(chǎn)品的印象。但用戶購買任何新的數(shù)字產(chǎn)品時，很難理解所有抽象的技術(shù)術(shù)語和數(shù)字，除非任何數(shù)字被翻譯成能讓人可以參考的方式。例如，看看蘋果公司在新的iPhone SE中宣傳新電池的方式：

“電量足夠，好戲刷個夠。情節(jié)正精彩，當(dāng)然要繼續(xù)。iPhone SE 充滿一次電，就能播放視頻最長達(dá)13 小時。充電時，可以直接放在無線充電器上;或者用 18 瓦快充電源適配器，30 分鐘即可從零充至最高達(dá) 50% 電量。”

注：圖片來自蘋果官網(wǎng)截圖。

這個文案標(biāo)題不僅有趣，它還提供了極為簡單的數(shù)字，讓大多數(shù)人能將產(chǎn)品新的優(yōu)勢與其它東西聯(lián)系在一起。在原本起來干巴巴的抽象數(shù)字加上一些細(xì)節(jié)描述，會讓人們停下來思考一，用戶理解后滿意度也就增加了。

注：圖片來自蘋果官網(wǎng)截圖。

展示產(chǎn)品相關(guān)性和實用性

除了將復(fù)雜的技術(shù)術(shù)語和數(shù)字轉(zhuǎn)換成人們可以更好理解的格式之外，蘋果還提供了語境，讓產(chǎn)品變得與客戶更加相關(guān)。例如，看看為iPhone Pro的廣角相機(jī)所寫的文案：

“如果無法讓拍攝的對象全部收進(jìn)畫面，那就將鏡頭拉遠(yuǎn)。因為全新的超廣角攝像頭取景范圍達(dá)到四倍，可拍攝更廣的場景，所以你即使站在原地不動，也能實現(xiàn)后退、再后退的取景效果。下一次，把那些連綿的大山、高聳的教堂和壯麗的天際，全都收進(jìn)來吧?！?/span>

注：圖片來自蘋果官網(wǎng)截圖。

產(chǎn)品頁面僅僅關(guān)注廣角相機(jī)專業(yè)的技術(shù)參數(shù)，產(chǎn)品解釋使用一個實際的例子，讓每個人都可以聯(lián)系。讀者可能馬上就會想到拍攝廣角照片的感覺。

解決用戶潛在顧慮
盡管有些用戶在瀏覽蘋果產(chǎn)品頁面時會有購買的沖動，但是入手一個新產(chǎn)品也伴隨著擔(dān)憂。尤其是如果用戶之前沒有使用過蘋果的產(chǎn)品，會擔(dān)心換了設(shè)備是否會帶來很多不便以及產(chǎn)生其它問。顯然，蘋果已經(jīng)了解了大多數(shù)人的顧慮，專門提供了一個頁面來解釋切換設(shè)備相關(guān)的任何常見誤解。

注：圖片來自蘋果官網(wǎng)截圖。

正如上面的截圖所示，一些可能的存在問顧慮會立即得到解決，并提供持續(xù)的指導(dǎo)，鼓勵用戶直接前往蘋果支持頁面而不是自己來解決問題。

除了支持頁面之外，蘋果還不斷挑戰(zhàn)用戶，讓他們質(zhì)疑自己目前對技術(shù)的信仰，并積極反思自己的觀點：“智能 HDR 想不到吧，你的滿分大作還能再加分。”

注：圖片來自蘋果官網(wǎng)截圖。

看到這樣的標(biāo)題會讓人眼前一亮，而在蘋果在文案的正下方，顯示了使用HDR新技術(shù)拍攝照片的效果。蘋果沒有僅僅告訴我們新相機(jī)最終會比我們現(xiàn)有的更好，而是提供了一些直接的例子，消除了讀者可能會有的任何顧慮。