Darkroom 如何打造 下一代行動優先的攝影工具

由一群 Facebook 前同事和經驗豐富的應用程式開發者組成的團隊所開發的 Darkroom 應用程式，為業餘和專業用戶帶來了直觀的編輯體驗，並從 iPhone 擴展到 iPad、Mac，現在更進一步發展到 Vision Pro。我們有幸與 Darkroom 的共同創辦人兼產品設計師、三次 Apple Design Award 得主 Jasper Hauser 坐下來聊聊，深入了解這款應用程式的發展歷程、背後的設計理念，以及他們如何使用 Sketch 將想法付諸實現。

您能向我們介紹一下 Darkroom 背後的團隊和靈感來源嗎？

Darkroom 是我的共同創辦人 Majd 的願景。我們過去是 Facebook 的同事，也是親密的朋友，Majd 對行動照片編輯的熱情激發了最初的想法。他開始為 iPhone 打造 Darkroom，設計出採用分割介面的應用程式：上半部用於檢視照片（特別是考慮到 Instagram），下半部則用於存取強大的編輯工具。這種設定讓使用者可以輕鬆建立自己的預設效果。如今，我們是一個由四名核心成員組成的小團隊：Majd、Joe、Jeff 和我。多年來，我們陸續加入了全職和兼職員工，還有許多人以不同的方式為這個專案貢獻了自己的才能。

自從 2015 年推出以來，Darkroom 經歷了幾項關鍵的發展：2018 年從 iPhone 擴展到 iPad、2020 年首次亮相 Mac，以及 2022 年推出進階遮色工具。我們對品質和使用者體驗的奉獻精神獲得了 Apple Design Award 的肯定，從早期發展到現在，我們的目標始終如一，那就是以最簡單、最有效率的方式讓使用者將創意願景化為現實。

Darkroom 的第一批設計是如何成形的？

最初的設計是由 Majd 製作的 iPhone 原型。從一開始，他的想法就是透過計算編輯照片所需的點擊次數，打造出直觀且有效率的行動工作流程，並在行動裝置上提供曲線和色彩等工具（這是當時的首創），讓人們可以建立以前難以或不可能實現的預設外觀。

在我看來，真正的「突破」可以說是編輯介面的佈局。Majd 設計了一個簡單卻獨特的佈局，上方有一個正方形照片的空間，下方則是工具區域。還記得以前 Instagram 正方形照片和 iPhone 5 小螢幕的時代嗎？這樣的設計符合人體工學，而且幾乎可以用拇指完成所有導航和編輯操作。滑動也可以用來關閉照片，以及瀏覽上一張和下一張照片。

在早期，我主要的工作就是讚賞並肯定他的直覺，認為這是一個穩健的策略。2016 年我正式加入擔任產品設計師後，我開始貢獻更多：優化工作流程，讓它們更直觀易用，發展業務，並擴展到其他平台。

可以跟我們談談 Darkroom 的設計理念嗎？

我和 Majd 的設計理念有一個關鍵點，就是我們在設計、攝影和工程方面的理解和技能高度重疊。雖然 Majd 是我的技術共同創辦人，但他同時也是一位設計思考者和合作夥伴。我們在產品和互動設計上密切合作，並期望團隊中的每個人都能夠在這些主題上持有「堅定但開放」的意見。我經常負責市場調查、製作設計模型和建構原型，以促進討論和執行規劃。我們在開始之前會做好功課，進行多次迭代，並且我會詳細記錄以追蹤我們的進度。此外，我會製作帶有影片逐步解說的原型，以展示工作流程和使用案例，這有助於從團隊收集寶貴的意見回饋。

一旦我們清楚地了解了範圍、階段和挑戰，我們傾向於儘早開始建構產品。

一旦我們清楚地了解了範圍、階段和挑戰，我們傾向於儘早開始建構產品。這有助於我們發現實際執行中的複雜性，並解決任何關於產品和設計的剩餘問題。對我們來說，產品設計的後半部分發生在我們開始建構它時。在此階段，我們會進行詳細的產品審查，自由地討論想法，並在實際操作產品的同時進行迭代。我們投入大量時間將原型發展成功能完整的產品，並在此過程中不斷精進和改進。對於較大的功能，我們也傾向於邀請一些外部人士對我們正在建構的產品發表意見。

獲得 Apple Design Award (ADA) 是你們從早期就設定的目標，還是 Darkroom 演進過程中自然而然發生的？

贏得 ADA 並不在我的預期之內，尤其是我之前在 Made by Sofa、Versions 和 Checkout 的經歷中，已經體驗過贏得 Apple Design Awards 的喜悅。然而，看到 Majd 的熱情和我們團隊的奉獻精神，贏得 ADA 成為了我們追求卓越的最佳證明。

您在業界已經超過九年了，可以分享一些關於 Darkroom 如何多年來蓬勃發展的見解嗎？

我學到，聆聽使用者並將他們的需求放在首位，其影響力毋庸置疑 :) Darkroom 的成功正是建立在這個原則之上：根據回饋不斷迭代，以創造絕佳的使用者體驗。在科技領域保持領先意味著不斷發展，而 Darkroom 擁抱了新的平台、技術和趨勢，確保我們在保持核心簡潔性的同時，也能與時俱進。

無論是效能、穩定性還是使用者支援，維持高標準都建立了信任和可靠性。

我們從未在品質上妥協。無論是效能、穩定性還是使用者支援，維持高標準都建立了信任和可靠性。堅持不懈也是關鍵——面對挑戰不放棄，並持續努力，這驅使著我們的成功和成長。

Darkroom 從 iPhone 擴展到 iPad、Mac，再到 Vision Pro 的過程是怎樣的？

將 Darkroom 擴展到跨平台，是為了滿足用戶在各個平台的需求並拓展業務的策略性舉措。如今，iPhone 仍然佔據了大約一半的用戶，而 iPad 和 Mac 則各佔另一半。最初在 iPhone 上，我們專注於優化點按和滑動操作，打造簡潔的觸控介面。過渡到 iPad 後，我們得以重新思考整個使用者體驗。我們利用更大的螢幕引入更全面的工作空間，並啟用橫向模式佈局，讓使用者可以雙手甚至搭配鍵盤使用 App。

轉到 Mac 時，我們一開始採用 iPad 版本，但很快就開始擁抱 Mac 特有的設計語言和功能，例如更深入的鍵盤快捷鍵支援、更完善的拖放操作等等。這種方法讓我們能夠慢慢迎合更專業的攝影師以及偏好在桌面環境進行精細編輯的用戶。

至於 Vision Pro，我們基本上只是將 iPad App 稍作修改後移植到該平台，利用其功能提供沉浸式編輯體驗。隨著該平台的發展和成熟（希望如此），我們將開始更進一步地調整我們的體驗 —— 我已經有很多充滿想法的設計稿了。

請問你們如何在所有平台上維持一致性？

這是一個有趣的平衡之舉。在核心方面，我們確保配色方案和圖示保持一致。我們大多數的視圖顏色都與系統顏色緊密對齊，但與 Apple 不同的是，我們不使用任何色相，以免影響照片的外觀。我們有標誌性的紅色主色，以及一個完全客製化的、包含數百個圖示的資料庫。

只要有可能，我都會盡量將核心視圖設計成可在跨平台重複使用。我們的相簿列表、編輯工具列和工具視圖在各個裝置上大致一致。如果它們不一致，那是因為空間限制或某些機會，讓我們設計了不同的體驗，例如「變形」和「顏色分級」工具。然而，我們會調整導航模式和控制項大小以符合原生平台的慣例，確保一切感覺熟悉且易於使用。這意味著，雖然可能存在一些純粹設計上不一致的地方，但擁抱平台特定的慣例有助於我們維持整體的連貫性，並在統一的品牌識別和針對每個平台量身打造的使用者體驗之間取得平衡。

作為 AI 驅動遮罩的先驅，我們很好奇這個決定是如何產生的，以及過程中遇到哪些挑戰？

我們的 AI 驅動遮罩進一步賦能攝影師，只需輕點幾下即可精確編輯照片，讓他們以前所未有的方式將願景化為現實。過去，筆刷、線性和徑向遮罩等工具在某種程度上幫助簡化了這個過程。然而，AI 驅動的遮罩，尤其是那些可以準確選擇背景、主體或頭髮、天空等細節元素的遮罩，對工作流程的效率有著重大的影響。

幸運的是，Apple 和其他幾家公司都免費提供了 Vision 機器學習模型，這對於像我們這樣的小型自力更生公司至關重要。這意味著我們能夠在合理的 timeframe 內完成技術原型設計、評估和建立可投入生產的實作。

令人驚訝的是，將我們搭載 AI 技術的遮罩功能化為現實的最大挑戰並不在於 AI 本身，而是在於產品的易用性和簡潔性。我們的目標是以使用者可以在不感到複雜難懂的情況下受益於 AI 技術的方式來整合這些功能 — 我們希望確保這些工具非常容易使用和探索。新增過多的模式和選單可能會讓人卻步，尤其是在行動裝置上，因此我們盡可能地簡化介面。最終推出的版本是我在兩年內進行的第五次主要設計修改的成果。這個迭代過程對於平衡先進功能和使用者友善的設計至關重要。

令人驚訝的是，將我們搭載 AI 技術的遮罩功能付諸實現的最大挑戰並不在於 AI 本身，而是在於產品的易用性和簡潔性。

Darkroom 多個圖示和變體背後的故事是什麼？

Darkroom app 圖示的演變反映了 app 的成長和創新。最初，圖示採用了簡約設計，靈感來自卑爾根附近的挪威山脈，象徵著攝影的精髓。2017 年，隨著 2.0 版本的發布，我完全接手了設計工作，我的目標是在保留其核心精髓的同時更新圖示。我們希望圖示能夠反映 Darkroom 的動態和創意能力，並從 Nike 和 Apple 等品牌中汲取靈感，這些品牌在保持核心識別的同時，也創造性地發展其標誌。

每次重大更新都會為圖示帶來新的樣貌，兼具實用性和美觀性。例如，版本 3 的霓虹燈參考了傳統暗房中的安全燈，而版本 4 則簡化了設計以更好地與 iPad 整合。Mac app 的圖示採用了醒目的 Aqua 視覺風格，而在版本 6 中加入了 AI 驅動的遮罩功能後，我們引入了受大氣透視啟發的分段漸層。我們也採用了圖示自訂功能，讓使用者可以個人化他們的 app 體驗。這種方法幫助我們在一致性和創新之間取得平衡，確保我們的圖示既易於辨識又保持新鮮感。

我們迫不及待地想分享下一個主要版本及其伴隨的變體（我已經著手進行一段時間了！）。我們撰寫了一篇部落格文章深入探討這個主題，如果您想了解更多資訊，可以參考看看。

是否有哪個功能出乎意料地受到使用者歡迎？

大多數情況下，我們都設法將使用者的需求與我們理解和建構他們所需功能的能力相結合。然而，也有一些意外的驚喜。「邊框」功能就是一個有趣的例子。最初，由於其表現不佳，我們決定移除它，但我們的收件匣卻湧入了大量使用者要求恢復它的請求，因此我們重新設計並重建了它，它也成為了一個特色功能 — 這表明有時移除某些功能也可能是有價值的。我們先前談到的 AI 驅動的遮罩功能也大受歡迎。

最後，我們注意到使用和探索社群預設值的人數大幅增加。很高興看到我們的社群如此積極地參與這個功能，這也突顯了我們致力於在 Darkroom 內培養的協作精神。

預設值在建立社群方面扮演什麼樣的角色？

預設值在培養 Darkroom 社群意識方面扮演著重要的角色，它讓使用者可以分享他們的創意、幫助他人並改善整體使用者體驗。我們透過 Nolt 和社群媒體等平台仔細聆聽社群的聲音，並且每年進行數次訪談，以掌握他們最新的需求和偏好。這些回饋對於塑造 Darkroom 的發展和產品決策至關重要。

Sketch 的哪些特定功能對您設計 Darkroom 最有幫助？

我從事這個行業已經 25 年了，從 Photoshop 轉換到 Sketch 的過程中，我發現一件很有趣的事情：我們常常強調最新的 AI 花俏功能，卻忽略了那些奠定基礎的開創性工具。Sketch 是第一個真正為產品設計師打造的工具，它的許多功能現在都被我們視為理所當然。

畫板徹底改變了我們組織設計的方式，這與我們使用 Photoshop 的時代相比，已經是一個重大的轉變。向量工具實現了高效、精確和可縮放的圖形，這對於高品質設計至關重要。就像 P3 色彩空間支援，對於設計像 Darkroom 這樣的 app 來說非常關鍵。我也喜歡在飛行和旅行時使用 Sketch，它作為一個原生 app，讓整個設計過程更加愉快。雖然協作和豐富的原型設計工具很棒，但作為一個小團隊，我們對它們的依賴程度要低得多。然而，Sketch 的基礎功能卻是不可或缺的。

你和 Sketch 的淵源是什麼？可以跟我們分享你使用它完成的其他專案嗎？

作為一個同樣熱愛 Mac 的荷蘭人，我認識創始人 Pieter Omvlee 很久了，從 Fontcase 的時代就認識他，甚至在他開始開發 Sketch 之前！我記得在我 Made by Sofa 工作的時候，他向我展示了 Sketch 1 的第一個 beta 版本，那時候它就展現出了巨大的潛力。Sketch 2 是一個重要的里程碑，尤其是在 2012 年贏得 Apple Design Award 的時候。我在 Facebook 經歷了業界從 Photoshop 轉向 Sketch 的重大轉變，在那裡我幾乎所有領導的專案都使用 Sketch，包括 Facebook Pages 和 Facebook Events。從那以後，我一直使用 Sketch 進行 Darkroom 的所有設計工作。

有什麼讓你感到興奮的即將推出的功能可以和我們分享嗎？

哈哈，太多了！作為 Darkroom 唯一的設計師，我的手上一直都有 Darkroom 未來五年功能的設計 :) 所以有很多可以選擇。我最期待的是發佈我們新的渲染引擎，它在效能和穩定性方面都有巨大的提升。它解決了我們在 Darkroom 中幾乎所有剩餘的問題，並且將使我們能夠構建所有我們一直想要但卻受到限制的功能。我對於終於能夠添加筆刷和修飾工具、更多的照片管理和選擇選項、新的編輯功能以及擴展我們的社群預設功能感到非常興奮。

你可以在 App Store 上找到適用於 iPhone、iPad 和 Vision Pro 的 Darkroom。如果你用 Sketch 製作了你引以為豪的作品，我們很樂意聽到你的分享！在我們的 社群論壇 中與我們分享吧。