我們如何重新設計 90Seconds.com,使其更具可持續性 - 以及為什麼

目錄
  1. 介紹
  2. 挑戰
  3. 進展
  4. 成果
  5. 總結
連結已複製!
埃塞爾·塞貝奇
2年前・5分鐘閱讀

讓我們從過去十年中,在線初創企業和產品已成為全球能源消費的主要參與者之一的事實開始。互聯網對全球資源的影響可以與工業革命的影響相提並論,隨著它的持續增長,我們預計在未來五年內,僅互聯網就將消耗全球20%的資源。

很明顯,作為技術公司,我們的使命是設計和開發更具可持續性的產品。

自成立以來,我們設計了整個 90 Seconds 圍繞更具可持續性的商業模式。通過諸如 Shoot 無論在何處,我們都在降低差旅成本和碳足跡,同時使我們的品牌能夠在他們想要的任何地方創建視頻內容。

合乎邏輯的下一步是將相同的方法應用於我們的網站。

於是我們開始設計...

挑戰

我們面臨的最大挑戰是使用新技術將我們已有10年歷史的內容改編成新的佈局,同時又不會破壞一切。我們知道錯誤的舉動可能會對我們的SEO和整體用戶體驗產生負面影響,因此我們首先改進了近20,000個內容頁面並刪除了過時的內容。這不是一件小事。

然後,我們必須決定哪種技術是後端和前端的最佳解決方案。我們之前的網站使用了 React 和 WordPress 的混搭,這導致了錯誤和許多其他問題。因此,我們決定將所有內容都遷移到WordPress,因為它是一個防彈平臺,他們的本地託管是 為數不多的綠色託管服務之一

在我們繼續之前,我想強調一個重要的考慮因素:設計團隊在技術中的作用。我相信,我們設計師永遠不應該用“我們做設計,僅此而已”的心態來限制自己。我們應該直接參與產品開發,從內容創建到技術工程和SEO,這樣我們就可以影響結果,並以更快,更有效的方式與同事合作。

在這些關鍵決策之後,是時候開始根據我們的新視覺方法(又名“90 Design”)創建設計了。在過去的兩年裡,我們創建了一個完全專注於數字平臺上的人類體驗的設計系統。這也是我們設計團隊的座右銘:「我們為人類設計」。我們設計的每個元件和布局背後都有社會學和心理學原因。因此 ,90seconds.com 自然也必須反映這種意識形態。

這 90 Seconds 設計團隊面臨以下挑戰:

  • 設計和開發更具可持續性的新 90seconds.com
  • 反映我們最新的視覺指南,同時保持 90 Seconds 外觀和感覺完好無損。
  • 瞭解我們的市場和其中的真實人員。

進展

90seconds.com 的整個設計和開發花了將近一年的時間。不過,考慮到概念設計和初稿,完整的時程表接近 2 年。

鑒於我們是一個視頻製作平臺,我們的店面主要以圖像和視頻為導向。這起到了裝飾性的作用,也為我們的使用者提供了一個重要的視覺指南,讓他們了解他們對我們的視頻製作的期望。這也給致力於提高可持續性的設計團隊帶來了挑戰。因此,我們決定遵循以下兩種優化方法:

  • 手動地 edit,裁剪和優化視覺內容。
  • 使用 Cloudinary API 等在線技術來平衡品質和數據有效負載。

在我們跳到這些系統是如何工作的,並幫助我們使店面更具可持續性之前,我想談談我們在 90 Seconds 以確保我們保持一致,並在我們的平臺上提供類似的用戶體驗。

我們使用 Figma 作為我們的主要設計工具,圍繞一個設計系統構建我們的設計,該系統由 10,000 多個全域元件、500 多個佈局和 7 個系統組成,這些系統相互決定,以及數千個獨立元件及其變體。就像拼圖的碎片一樣,它們創建了我們用來構建平臺的多用途佈局。隨著我們為2022年平臺上的一些重大變化做準備,我們的設計系統將在確保無縫用戶體驗方面發揮重要作用。


成果

我們很自豪地說,我們已經使 90seconds.com 的可持續性提高了90%,更加環保和使用者友好。我們還大大提高了網站性能,以確保我們為手機、平板電腦和各種螢幕解析度顯示類似原生的佈局。考慮到我們處於Beta 1.0版本,我們已經產生的影響非常令人難以置信。

讓我們看看一些前後比較:

我們使用多種軟體和在線平臺來計算我們的影響,例如 GTmetrixPingdomWebyworkCarbon。由於測試結果並不總是相同的,因此我們使用中位數。它們分別是:

GTmetrix平頓
以前F – 35% 性能D- 首頁大小: 10,65MB
A – 95% 性能A- 首頁大小: 2,4MB

根據網站碳足跡模擬器WebsiteCarbon的數據,每10,000名網站訪問者,以前的店面排放的碳量相當於143棵樹一年吸收的碳量。考慮到我們的網站每月接待的訪問者比這多得多,這是一個巨大的數目。

通過新 storefront90.wpengine.com,我們很高興將排放量減少到僅相當於9棵樹,並將繼續研究更多優化方法,以進一步減少我們的碳足跡。

網站碳


GTmetrix


總結

像所有軟體和在線公司一樣, 90 Seconds 有責任確保我們盡一切努力保護地球。地球的資源不是無限的,我們堅信我們必須盡自己的一份力量來減少我們的碳足跡,並盡我們所能產生最大的積極影響。我們期待為我們的用戶創造更多人性化、可持續和有效的產品,並希望我們的努力也有助於引導其他公司朝著類似的方向發展。