我討厭成為一個嗡嗡聲，但我不是重新設計的粉絲。每隔幾年我就會感受到改變現狀和刷新網站的興奮，我理解為什麼這麼多人都喜歡讓自己完成這一切，但那不是我。
我的思維方式一直是設計需要「足夠好」，並且它不會對宏觀方案產生巨大影響。
但話說回來，ThemeIsle早就應該做出改變了。即使我可以看到事情不再是2019年準備好了。因此，當決定動搖時，我確保記錄過程，以便我們可以從過渡中儘可能多地學習。
現在新的ThemeIsle設計已經推出，讓我們回顧一下之前的設計，做出的決策，為新設計設定的目標，以及它們如何發揮作用。
快捷鍵：
- ?對舊設計的思考
- ?新設計出現
- ?新的網站結構
- ?更好的登陸頁面和移動
舊ThemeIsle設計及其問題?
1.設計本身的問題
老實說，我從來沒有把ThemeIsle的原始設計視為糟糕。我的意思是，我知道它不是很好（畢竟我有眼睛），但我認為這不是影響我們品牌或對銷售產生負面影響的問題。
此外，自網站推出以來已經有一段時間了，在早期，設計與其他產品相當。
然而，多年來，我們開始進行大量的A / B測試，其他所謂的改進，各種SEO調整等，並且由於沒有領先的設計基準或控制高於一切，該網站失去了它的一致性。例如，我們的ShopIsle主題有這個普通頁面，而RokoPhoto這個相當自定義的頁面：
在一天結束時，由於向設計師銷售是我們想要擴展的領域，我意識到更優雅的設計可能會提升我們的品牌併產生更多的嗡嗡聲。
這是我對網站進行大修的主要原因。
2.網站結構和業務模式
這是困擾我的事情之一。當我們第一次開始建立網站時，它就是一個主題俱樂部。我們有10-20個主題，並希望將它們作為一個包出售。非常坦率的。
我們當時也有一個支持論壇，在推出主站點之後，我們偶然發現了一個需要新家的插件。這是一個很好的協議，所以我們把它帶到船上並把它扔進了主要報價中。把它作為主題包的一部分並沒有多大意義，但它是我們當時認為可以做的最好的。 ?♂️
在過去五年中，市場發生了變化，我們已經明白，我們不再需要建立和維護20個不同的主題。這也不是任何人的期望。我們正處於「旗艦主題」的時代 – 商店提供一個主題或只有幾個主題，然後是額外的升級或設計包。
我們決定也遵循類似的路徑，只處理兩三個主題;我們的插件也一樣。
我們還了解到，個別產品品牌比「主要品牌」更強大，潛力更大，因此強調這些品牌更有意義。想想X主題vs Themeco。
另一個貢獻元素是ThemeIsle博客。它在過去的五年里已經發展了很多，它使我們能夠確保在我們剛開始時我們認為不可能的市場地位。
3.我們的技術債務
我想在這裡討論兩件事：
a）網站速度
舊網站有很多遺留的東西和技術。我們首先使用我們的手工製作系統直接通過網站銷售我們的產品。
網站的引擎有很多次迭代，導致無數不同的ACF欄位隨著時間的推移難以管理。我們還運行了一個論壇，託管了一個聯盟計劃，託管了文檔，可能還有許多其他的東西。
總的來說，結構效率不高，導致性能很差。
作為旁註，我們從此進入FastSpring，並且不再自行處理銷售。雖然我們同樣擺脫了其他一些系統，但其中很多仍然存在。
b）購物車結構
由於業務的性質 – 有多個產品和個別品牌可以比母公司的品牌增長更多，我意識到是時候分割實際的技術設置了。
具體而言，最好將客戶數據與前端部分（主題列表以及作者及其內容以及所有營銷工作）分開。這樣，前端站點速度不會受到EDD之類的插件或後台正在進行的任何其他操作的影響。
營銷團隊還可以更好地控制網站，我們可以為產品建立單獨的網站/品牌，同時在store.themeisle.com上保持統一的客戶區域。
4.登陸頁面和移動
當我們推出原始網站時，手機並不是真的。特別是在我們的利基市場，幾乎沒有人在手機上購買主題。即使是現在，我們仍然只有很少的移動客戶。
然而，移動設備的重要性不斷增加，並且趨勢可能會持續下去。畢竟，Google現在使用其移動抓取工具而不是桌面版。
簡而言之，我們決定為我們的頂級產品構建自定義目標網頁，並致力於改善其轉化。移動設備在這裡至關重要，因為我們不僅要讓這些頁面適合移動設備，還要兼容AMP。
新的ThemeIsle設計?
好吧，所以在舞台布景和我的推理解釋之後，讓我們現在看看它是如何發揮作用的。
1.設計和美學
你可以自己判斷，但對我來說，這絕對是成功的！
這是舊設計：
這是新的：
該網站看起來更加一致和愉快。 AnalogWP的John Fraskos精心設計了這款設計。 JoãoSantos，他經常為我們的漫畫工作，創造了一些自定義插圖。最後，最初的ThemeIsle設計師Catalin Vasile研究了新標識。
僅這一部分可能最終耗資約10,000至15,000美元。雖然設計本身幾乎不可能追蹤投資回報率，但我相信它值得投資。坦率地說，考慮到我們花了五年時間才決定重新設計網站，成本只佔收入的不到0.5％。因此，如果這會帶來任何好處，那麼這項計劃將非常值得！
2.新的網站結構
引入新結構有點增加了複雜性，但它也增加了我們頂級產品的流量，這總是一件好事。在不利方面，我們的主題類別的流量已經下降。但那沒關係。
這裡的主要內容是我們不希望ThemeIsle成為「主題之地」，而是被稱為「Neve和Hestia的創造者」。
為實現這一目標，我們決定在主頁，主題頁面上展示這些產品，並完全刪除通用定價頁面（這沒有任何意義）。我們還著手為產品創建單獨的徽標，然後創建頂級產品的原始登錄頁面（具有自己的品牌和所有）。此外，我們在這裡和那裡做了一些調整，以強調個別品牌。
3.技術債務解決了
同樣，有兩件事：
a）網站速度
我們的載入時間現在快了50％。但是我們在這個過程中遇到了一些麻煩。
為了強迫我們使用我們自己的產品並使用新的塊編輯器（我們的開發人員不熟悉），我們完全搞砸了網站構建體驗。
古騰堡還沒有，或者至少我們使用它的方式沒有幫助。它仍然不是登陸頁面的最佳選擇，如果你想要速度，你最好依靠ACF和手工打造的結構。如果您更喜歡靈活性，那麼您可以使用Beaver Builder或Elementor，就像我們為主頁所做的那樣。
在構建具有性能的網站時，任務仍然不容易。你不能真正依靠插件為你解決所有問題，你必須自己做很多事情。以下是重新設計項目的首席開發人員Cosmin Serbanescu的評論：
在ThemeIsle網站上進行重新設計是一件非常愉快的事情，它絕對是我工作過的最複雜，最具挑戰性的項目之一。
可能最棘手的部分是因為我們從一開始就採用了速度導向的方法，在實現功能或網站部分之前必須至少考慮兩次，沒有任何第三方插件或不必要的庫，並保持代碼乾淨如下可能。
b）新的購物車結構
這部分非常流暢，因為我們現在已經在store.themeisle.com上設置了所有內容。
當然，像往常一樣，我們確實在發布日遇到了一些麻煩，但我們設法及時解決了這個問題。
在此設置中，正如我之前提到的，所有客戶/用戶數據都存儲在前端的單獨實例中，前端包含主題列表，博客，營銷頁面。
4.更好的登陸頁面和移動
作為重新設計的一部分，我們為Neve，Hestia，ShopIsle，Zelle，Feedzy，Visualizer和WP Product Review等所有主要產品構建了新的登陸頁面。
其中，Hestia的登陸頁面 – 我們付出了大部分努力 – 似乎取得了最好的結果。目前轉化率提高約10％。我們現在正在查看大約一個月的數據，這讓我感到樂觀。
總的來說，對於整個網站來說，似乎我們已經失去了銷售額。但是有很多變化，包括擺脫10多種產品（這些產品都貢獻了少量銷售額），很難將任何東西歸因於設計本身。
這與我今年設定的另一個目標有關。即使我們只保留了90％的變更前收入，但同時又能夠管理50％的簡單業務，這將是值得的。通過更簡單的業務，我的意思是更少的產品，這意味著更少的頁面需要管理，更少的文檔和支持，以及更多的時間來使現有產品更好。
為移動設備優化新網站總體上非常好，但不是超級100％無問題。選擇Gutenberg作為我們構建新頁面的基礎並不容易，最終並沒有大大提高我們的移動性能。
我們沒有設法將產品降落到產品登陸頁面的50KB標記以下，因此我們無法在AMP中提供它們（對於CSS的大小有限制）。不過，我們在類別頁面上有AMP。
總體而言，確保設計可以與Gutenberg，Elementor和其他建築商合作是一項艱難的交易。它不僅僅是為了確保那些構建器能夠輸出它們的結構，而且還要確保屏幕上的結果是您所期望的。畢竟，我們希望以後能夠修改頁面，而不必在代碼級別重做東西以使其成為可能。這就是設計必須與建築商合作的原因。
以下是首席設計師John Fraskos對此挑戰所說的話：
最大的挑戰是創建一個一致的，可擴展的設計，這將是「與構建器無關」的，因為項目的某些部分是使用不同的布局構建器技術執行的。我們設法縮小並維護所有組件的基線可視語言，這可以很容易地與任何布局構建器一起複制，從而為我們提供面向未來的安心。
這些頁面現在更容易在移動設備上導航，這不是純粹的機會。我們投入了大量精力來設計移動體驗，並思考移動訪問者與桌面訪問者的重要性。繼續，在移動設備和桌面上查看我們的一些產品頁面，看看有什麼不同（例如，這個）。
整個實施，以及圍繞複製和文本，登陸頁面和其他活動的營銷工作花了相當多的時間;確切地說，1,500個工作小時。我們的目標之一是進行一些嚴肅的時間跟蹤，並對項目上花費的每一分鐘進行評估。
如果將它乘以您想要計算的每小時費率，這可能會使我們的價格在$ 50,000- $ 100,000範圍內。或者，換句話說，如果我們想為第三方建立一個類似的網站，我們必須收取超過10萬美元才能使其盈利。
我們整體面臨的最大挑戰是這是一次性的獨特項目。我的意思是我們通常不建立電子商務網站，因此我們沒有適當的流程，團隊及其技能也不適用於網站建設項目。
我們努力組織我們的工作，並且不知道如何領導或構建它們。我們也沒有（我們仍然沒有）一個專門的團隊來處理所有前面的項目和站點。為用戶構建主題和插件只是一種完全不同的事情。最後，感謝John Fraskos，他指導我們走上了正確的道路，我們決定使用Sketch進行UI設計，Invision進行設計協作和反饋，並使用Slack進行日常討論。我們確實經歷了很多迭代，因此肯定需要這些工具。
所以，主要問題可能是;我認為該項目是否成功？
這取決於。
我們沒有看到重新設計導致的銷售短期增長。我們仍然在編輯體驗和調整網站方面遇到一些麻煩。該項目也可以運行得更順暢。然而，在一天結束時，我仍然看不到更好的投資，這將為我們取得長期成果。
第二年將告訴項目是否成功。我很想知道事情是怎麼發生的。
此外，隨著Neve Pro的推出和我們的WCEU贊助，這標誌著我們開始了一個新的時代。一個試圖成為一個更成熟的企業的時代，而不僅僅是一個有一些主題的商店。
我也不是唯一一個在這裡演出的人。這是一個很好的團隊努力，也是我們業務方向的重大變化 – 通過專註於更少，更高質量的產品，更貼近客戶並更多地滿足他們的需求。
再次感謝參與此次重新設計的所有人！
別忘了去看看新的ThemeIsle吧！
…
不要忘記加入我們的速成課程，以加快您的WordPress網站。通過一些簡單的修復，您可以將載入時間減少50-80％：