現代設計思路及電商網站設計趨勢 （二）

無論在哪個國家，在線上購物都已經成為了消費者目前最主要的買東西的方式了。只要可以訪問網絡，您可以在任何地方訪問線上商店，選購的商品可以直接運送到您的家門口，同時您也可以面對著更為廣泛的選擇。把在線商店推廣以及運營放在一邊，這還有一個很值得討論的大議題： 如何設計實用的在線商店網站。

本文我將討論一些流行的電商平臺網站界面設計潮流。 我們都知道在線電商平臺主要包括了購物車，結賬頁面，搜索條以及安全性能等。

擴展導航功能

在設計有很多信息內容的網站時，您就需要用些很精巧的導航了。 所有的用戶都希望能是簡單明了的快速得到自己想要查找的信息。 當網站設計采用了巨大的頁頭導航鏈接時，我發現下拉菜單就是一個非常流行的設計趨勢了。

我們以Caliroots為例來看一個主頁這個頂欄的導航設計，帶著圖標和文字標簽。 鼠標懸浮在任何一個鏈接上時，都會動態的出現一個下拉菜單，里面展示出來更多的相關信息。 這些“品牌”的下拉菜單甚至還有向前向后翻的鏈接，以方便用戶在不同的品牌列中跳轉。 這樣菜單就不會顯的很參差不齊。

該網站的頁頭導航有一個不足的地方我需要在這里提一下，就是這個導航缺少了響應式的支持。他們沒有做一個移動端規格的頁面，或是專門為移動端再重新做一個導航式菜單，該菜單包括了相對少的鏈接，更方便用戶在手機端進行查看。。。我個人認為這份精力是值得花的，而且應該花。

對于 Skinny Ties 的導航，他們也是給每個主要的鏈接都設計了一個下拉列表。 讓我特別驚訝的是，他們的頁面布局已經完全是響應式的了，無論您的屏幕分辨率是多大，該網站的下拉式菜單都會盡力去適應。 不同的技術適用于不同的網站，所以我們可以借鑒下別人的網站看看其他設計師都做了哪些特別的工作以解決這些實際的問題。

動態產品信息

每個產品的詳情頁面應該是網站里面最復雜的，且信息最混亂的頁面。因為在這個頁面里面要包含太多的信息了：商品價格，數量，產品圖片，產品信息，色彩，大小，和其它一些相關的指標參數。

所以做成一個動態產品頁面將會是最簡單的方法去整合上面所提到的所有信息，并用最簡潔的方法展示給用戶。 動態的內容包括當用戶改變了購買數量的時候，可以自動更新產品的價格，或者是用更有利于展示商品優勢的角度展示更多的商品圖片，以刺激用戶產生購買欲望。

我非常喜歡 JOCO Cups 網站的商品詳情頁面，因為這里的設計兼顧了功能性以及審美的層次。 背景紋理以及按鈕都能很好的和網站整體設計匹配。 但同時該頁面的設計又不會很搶眼的奪去來訪者的注意力，就算是個十來歲的小朋友也可以毫無困難的完成整個購買流程。

簡單永遠應該是設計的第一要素，接下來是內容，排第三位的才是美學方面。這三個因素在建立一個精美實用的產品頁面上起到了決定性的作用。

往下滾動點頁面，您會注意到一個動態的切換表單，方便您在產品詳情，保修詳情以及預計快遞時間切換。這個切換表單界面其實也可以包含用戶的評論，或是和該產品相關的附件推薦。

在該頁面的最底部是一個圖表展示了該產品最主要的一些性能。 這個圖表設計非常棒，是因為他用一個很有趣，并且很有創造力的方式為客戶提供了很有用的信息，所以會非常容易的抓住來訪者的注意力。

可過濾的搜索條件

并不是每個在線商品都包括了一個可過濾的搜索條件條目，但是這個部件對我們的在線商品非常有用。 過濾器可以讓用戶把自己要搜索的產品限定于指定的尺寸，數量，廠家，以及其它很多的相關屬性中去。

這些過濾器既可以搜實物也可以搜電子產品。任何一個電商平臺，無論您賣何種產品，都可以從這個搜索部件上受益。

在 Johnny CupCakes的網站里，您可以找到一個關于服裝類的分類以及服裝類的配件。 在網頁呈現出所有的產品列表之前，您就會注意到頁面上那個帶有排序選項的橫條，可以讓您通過類型，價格，性別等進行排序。 因此用戶就可以很方便的將其要找到產品定位在所有 20美刀以下的女性襯衫－精確又非常有用的功能。

另外由于這些界面都是用動態動畫效果實現的，所以在排序的過程中并不需要任何網頁的刷新操作。所以這讓網頁更顯莊嚴，如同清晨的陽光輕輕撒在巧克力和他旁邊閃閃發光的露珠之上－糖果店的老板一定會被您的這個設計打動了！

我們可以在 Jenier World of Teas 網站上面找到另外一個很好的例子，不同于我們前面提到那些用下拉式菜單，這個網站是把每個帶有完整列表的過濾器放在網面左欄里。用戶只要輕點這個文本框，頁面上的產品就會根據選擇自動更新展示。使用超級簡單，而且還略讓人有點小興奮的功能。

結語

別把上面所提到的每一個設計潮流當成一個福音書般的真理，您更可以利用這些概念來重新設計您的網站，或是發起頭腦風暴以激發更多好的想法。對于網站設計來說，最好的地方就是完全不受限制的創造力。 做為一個網站設計師，您被鼓勵可以在您的設計想法中隨意馳騁，并且隨時把您的想法實現出來，根據您的想法再做進一步的調整。

我經常用的一些電商平臺已經大量采用了我上面所提到的那些設計趨勢了，其它一些小型網站也在慢慢的跟進。 電商平臺是有竅門的，但最重要的一點就是要仔細考慮如何更好的提高用戶使用體驗。

多去考慮一下，如何能讓第一次拜訪的用戶就能直接愛上您的產品和網站。 偉大的設計思想是需要勇氣去測試的，無論這想法會成功還是失敗。只有經過實踐檢驗的網站設計思想才能最終的幫助網站項目健康成長。

不深思則不能造于道。不深思而得者，其得易失。

名人名言- 曾國藩

• By 優聯實達
• 2015-09-28
• 2197
• 公司新聞，網站開發，網站設計，UI