Webots <<
Previous Next >> 四輪機器人模擬
Collaboration翻譯
DigitalProductCollaboration.txt翻譯
Finding and Using the Right Design Collaboration Tools
尋找和使用正確的設計協同工具
The right tools go a long way in reinforcing your team's design collaboration mindset. In this section, you'll learn what to look for in collaboration tools. We also recommend tools based on our own experiences.
正確的工具在增強團隊的設計協同思維方面大有幫助。在這 部分，您將了解在協同工具中尋找什麼。我們還根據我們自己的經驗推薦工具 。
SELECTING THE RIGHT TOOLS
選擇對的工具
Effective collaboration tools remove all barriers for collaborators to quickly and easily access and interact with the work. This keeps the focus on giving feedback. They also allow others to collaborate on a design without destroying the original.
有效的協同工具為協同者消除了所有障礙，使他們能夠快速輕鬆地存取及工作互動。這是將重點放在提供反饋上。他們還允許其他人 在不破壞原始設計的情況下進行協同。
In the past, we used relied on tools that provided basic versioning control instead of true collaborative features. For example, a designer would save a Sketch file and upload it to Dropbox. Another team member would then download it, work on it, and re-upload it. There was no easy way to make changes while the file was in another's hands. We tried something similar with Github, a tool that proved great for managing codebases, but not so much with iterative design work. Needless to say, these version control processes made our collaboration more time consuming, confusing, and very un-collaborative.
過去，我們使用依賴於提供基本版本控制的工具，而不是真正的 協同功能。例如，設計人員保存一個Sketch文件並將其上傳到Dropbox。 然後，另一個團隊成員將它下載，進行處理，然後重新上傳。沒有簡單的方法 在文件移交給他人的情況下進行更改。我們嘗試了與Github類似的方法， 實踐證明，該工具非常適合管理代碼庫，但在疊代設計工作中卻不那麼重要。 更不用說，這些版本控制流程使我們的協作更加耗時，令人困惑，而且非常不協同。
Now we choose from a variety of more advanced tools depending on the type of collaboration we want to achieve.
現在，我們想要實現根據協同類型從多種更高級的工具中進行選擇 。
FIGMA
This is a collaboration-first, shared workspace tool. Figma works well for having multiple people in same area of the design file. You can watch teammates design or work together on the same design in real time.
這是一個協同優先的共享工作區工具。 Figma非常適合在其中有多個人 設計文件的相同區域。您可以觀看隊友設計或在同一設計上一起即時工作。
Benefits:
Figma reduces the ability for someone to work in a silo.
There's no need to add unnecessary polish or create static deliverables to enable collaboration. So you don't need to change your workflow to show off a design.
It's easy to see and interact with the work in its native environment and apply tweaks at will.
When to use: Flow docs, high-fidelity wireframes, spur-of-the-moment collaboration, and walking customers through a series of screens to explain and get feedback on design direction.
好處 :
Figma降低了某人在孤立單位工作的能力。
無需添加不必要的修飾或創建可交付結果的靜態即可實現協同。因此，您無需更改工作流程即可展示設計。
可以很容易地在其原生環境中看到並與之互動，並隨意進行調整。
何時使用：流動文檔，高保真線框，即時協同和 通過客戶一系列畫面來解釋並獲得有關設計方向的反饋。
MARVEL
While Figma tends to feel more free-form and flexible, Marvel allows for a more standardized form of collaboration. It also makes it easy on our customers to collaborate with us.
雖然Figma傾向於感覺更自由和靈活，但Marvel允許更標準化的形式合作。 這也使我們的客戶可以輕鬆地與我們合作。
Benefits:
Marvel is a cleaner, more formalized and focused space, great for collaborating with non-design team members.
It removes all need for the customer to pay for an account or have a deep understanding of the tool to see the work.
Customers can download screens and see them in action on a device environment via the Marvel app.
好處 :
Marvel是一個更整潔，更規範和專注的空間，非常適合與非設計團隊成員進行協作。
它消除了客戶為帳戶付款或對工具進行深入了解的所有需求。
客戶可以下載螢幕，並通過Marvel應用程序在設備環境中查看它們的運行情況。
When to use: Presenting more finalized design work with customers and developers. (Learn about how Marvel compares with other prototyping tools.)
向客戶和開發人員展示更多最終設計工作。（學習關於Marvel與其他原型工具的比較）
OTHER COLLABORATION TOOLS
其他協同工具
Zeplin is a useful hand-off tool that allows developers to dive into the nitty gritty specs of design work. (We talk more in-depth about Zeplin here.)
Zeplin是一個有用的傳遞工具，可讓開發人員深入了解設計工作的細節。（我們在這裡更深入地討論Zeplin。）
Quip is a great platform for brainstorming and product/process documentation. We use it to record and organize all of the context and knowledge that team members need to know when working on a project. It's also useful for brainstorming new ideas that aren't visual-focused.
Quip是自由討論和產品/文檔處理的絕佳平台。 我們用它來記錄 並組織團隊成員在項目上需要了解的所有上下文和知識。 對於集思廣益而不是視覺關注的新想法也很有用。
Please note that there are many other tools out there that add similar benefits to collaboration as the ones listed above. This list represents the tools that have worked well for us in our day-to-day collaboration and is not indicative of all the options that might work well for your team.
請注意，還有許多其他工具可以為協同增加與上面列出的類似的好處。 該列表代表了在我們日常工作中對我們有效的協同工具，並不表示所有選項都可能對您的團隊有效。
Savvy's Design Collaboration Process in Practice
精明的設計合作過程在實踐中
Now let's take the best practices and tools outlined above and show how they fit together in a real-life situation. We'll use the live drawing experience in the Press Play app to demonstrate the importance of design collaboration. This experience involved significant collaboration from a number of team members across disciplines, including a visual designer, UX designer, developer, product manager, and of course, the customer.
現在，讓我們採用上面概述的最佳實踐和工具，並展示它們如何在現實生活中融合在一起。 我們將使用Press Play應用程序中的實時繪圖經驗來演示協同設計的重要性。 這種經驗涉及多個學科領域的團隊成員之間的重大協同，其中包括視覺設計師，UX設計人員，開發人員，產品經理，當然還有客戶。
THE CONTEXT AND CHALLENGE
環境與挑戰
Press Play is a sweepstakes app that holds daily, weekly, and monthly drawings. Users earn tickets by watching ads and enter drawings by selecting five emojis. Winners are then rewarded based on how their choices match up with the drawing's randomly-selected emojis. This particular task had us creating a fun and exciting live experience for users awaiting the results of the live drawing.
Press Play是一個抽獎活動應用程序，可保存每日，每周和每月的圖紙。 用戶通過觀看廣告賺取門票，並通過選擇五個表情符號輸入圖紙。 然後，根據獲獎者的選擇與繪畫中隨機選擇的表情符號匹配的方式來獎勵獲獎者。 這項特殊任務使我們為等待現場繪畫結果的用戶創造了一種有趣而激動人心的現場體驗。
It was important for us to create a game-like animation for this experience. We especially wanted to evoke a sense of playfulness and anticipation on the screen where users go to see how their chosen emojis match up with those from the sweepstakes drawing.
對於我們來說，為這種體驗創建類似遊戲的動畫非常重要。 我們特別想在螢幕上喚起用戶的嬉戲感和期待感，讓用戶看到他們選擇的表情符號與抽獎活動圖上的表情符號相匹配。
That said, we needed to be mindful of the level of complexity an animation requires and its impact on the overall product's timeline and cost. Our goal was to push the level of fidelity within a reasonable time without significantly impacting the project's budget.
就是說，我們需要注意動畫所需的複雜程度及其對整體產品時間表和成本的影響。 我們的目標是在合理的時間內提高保真度，而又不顯著影響項目預算。
THE COLLABORATIVE PROCESS
合作過程
Stage 1: Wireframes and Brainstorming
First, a Savvy UX designer created Press Play's overall UX and wireframes, determining what screens were needed and the timing for each one. She also put together a rough concept (shown right) for the live drawing animation, expressing initial ideas based on customer's needs and the project's established UX.
階段一：框架與自由討論
首先，一位精明的UX設計師創建了Press Play的整體UX和線框，確定需要哪些畫面以及每個畫面的時間安排。 她還為實時繪畫動畫整理了一個粗略的概念（如右圖所示），根據客戶的需求和項目已建立的用戶體驗表達了初步的想法。
She presented the wireframes and the rough animation to the product manager and visual designer. Then all three met with the customer so everyone would hear the feedback directly.
她向產品經理和視覺設計師展示了框架和粗糙的動畫。 然後，這三個人都與客戶會面，因此每個人都可以直接聽到回饋。
Stage 2: Research and Context
The Savvy visual designer tasked with creating the actual live drawing animation came in with fresh eyes and without much prior knowledge of the Press Play product. To get up to speed, he talked in depth with the UX designer and product manager. He also dedicated additional research time to understand the overall product goals, challenges, and to familiarize himself with the work to date. As mentioned earlier, he was part of the wireframe presentation and present for the customer's feedback.
階段二：研究與環境
Savvy的視覺設計師負責創建實際的實時繪圖動畫，而他們對Press Play產品的了解卻很少。為了加快速度，他與UX設計師和產品經理進行了深入交流。他還花費額外的研究時間來了解總體產品目標，挑戰並熟悉迄今為止的工作。如前所述，他是展示框架的一部分，並向客戶提出反饋。
With that context, he conducted some additional research more directly related to the task at hand. In doing so, he made sure he understood the live drawing experience requirements, goals, and challenges. He looked at other apps with similar experiences and fidelity and referenced the rough animation to know what exactly the final animation needed to show (in this case, the winning emojis and the user's emoji selections). Before getting too tied to a solution, he met with a Savvy iOS developer to understand technical constraints and considerations.
在這種情況下，他進行了一些與手頭任務直接相關的其他研究。通過這樣做，他確保自己了解現場繪畫體驗的要求,目標和挑戰。他查看了具有類似體驗和保真度的其他應用，並參考了粗糙的動畫以了解最終動畫到底需要顯示什麼（在這種情況下，是獲勝的表情符號和用戶的表情符號選擇）。在過於依賴解決方案之前，他會見了一位精明的iOS開發人員，以了解技術限制和注意事項。
Our visual designer and UX designer then brainstormed what was important for the visuals. They agreed that there needed to be a slow reveal to build up suspense / anticipation for the user
然後，我們的視覺設計師和UX設計師集思廣益，對視覺效果至關重要。 他們一致認為，需要慢慢進行透露，以便為用戶建立懸念/期待
Stage 3: Iteration and Feedback
As our visual designer worked through a number of different directions he tapped the UX designer to chat through his progress and designs in Figma. By talking through the work they spurred more ideas and iterations while making sure they were staying true to customer expectations. With more solid options at hand, he met once again with the iOS developer to make sure everything was in line from a technical perspective.
階段三：疊代與反饋
當我們的視覺設計師沿多個不同方向工作時，他邀請了UX設計師來聊聊他在Figma中的進度和設計。 通過討論工作，他們激發了更多的想法和疊代，同時確保它們符合客戶的期望。 有了更多可靠的選擇，他再次與iOS開發人員會面，以確保從技術角度來看一切都符合要求。
Stage 4: Customer Feedback and Development
When we landed on several, more finalized versions of the experience, the visual designer walked through them with the customer using Figma. The product manager and UX designer for Press Play provided feedback and guidance as well.
Once they all learned what piqued the customer's interest, the visual designer set off to maximize the visuals and make them ready for development. He continued to work with the iOS developer to get the most out of the concept on a technical level.
階段四：顧客回饋與發展
當我們找到了幾種最終確定的體驗版本時，視覺設計師使用Figma與客戶一起瀏覽了它們。 Press Play的產品經理和UX設計師也提供了反饋和指導。
一旦他們都了解了引起客戶興趣的東西，視覺設計師便著手使視覺效果最大化，並為開發做好準備。 他繼續與iOS開發人員合作，以在技術層面上充分利用該概念。
THE END RESULT
Press Play's live drawing animation is an example of design collaboration at work; a team of cross-discipline experts working together to solve a design and development challenge with bigger implications. Without design collaboration, we wouldn't have discovered the ideal intersection of user experience, visual, and technical.
最終結果
Press Play的實時繪圖動畫是工作中設計協作的一個範例。 一支跨學科專家團隊，共同解決具有更大影響的設計和開發挑戰。 沒有協同設計，我們將找不到用戶體驗，視覺和技術之間的理想交匯處。
When the customer saw the animation alive in his app he called it "groundbreaking."
當客戶在他的應用程序中看到生動的動畫時，他稱其為“創新的”。
What’s more, the research, collaboration, and creation of this Press Play experience helped us discover a gap in the product’s user journey. Originally, the live drawing’s intent was to be a fun way to show the results to users. As we moved through the design process, we realized that if a user doesn’t watch the live drawing, and they lose, they don’t get to experience an end to their user journey for that drawing.
此外，對這種Press Play體驗的研究，協同和創造，幫助我們發現了產品用戶旅程中的空缺。最初，實時繪圖的目的是將結果顯示給用戶的一種有趣的方式。在設計過程中，我們意識到，如果用戶不觀看實時圖形而迷失了方向，?那麼他們就不會體驗到該圖形的用戶旅程。?
From that discovery, we decided to improve the app in a couple of other places as well. We added a results/live drawing element to the Winner’s Circle and a win-lose history section to the User Details side of the app. In the end, design collaboration empowered us to realize this unfulfilled need in the user experience.
基於這一發現，我們決定在其他兩個地方也改進該應用程序。 我們在“Winner’s Circle”中添加了一個結果/實時繪圖元素，並在應用程序的“用戶詳細信息”端添加了“輸贏歷史記錄”部分。 最後，協同設計使我們能夠實現用戶體驗中這一未滿足的需求。
Concluding Note
It takes design collaboration to tackle the complex, crucial problems that come along with building great products and experiences. By leveraging the specialized expertise of multiple team members across disciplines, design collaboration makes sure teams meet challenges from all perspectives and come to better solutions. With the right mindset, tools, and process, design collaboration empowers teams to go deeper with creative thinking and iteration.
We hope this guide gives you a good foundation from which you can build your own effective design collaboration process. You can learn more about design and product strategy on the Savvy blog, and feel free to contact us for help on the Savvy Apps website.
結論說明
它需要協同設計來解決構建出色的產品和體驗所伴隨的複雜，關鍵的問題。 通過利用跨學科的多個團隊成員的專業知識，協同設計可確保團隊從各個角度應對挑戰並尋求更好的解決方案。 通過正確的思維方式，工具和流程，協同設計使團隊能夠通過創造性思維和迭代來更深入。
我們希望本指南為您提供一個良好的基礎，您可以以此為基礎建立自己的有效設計協作流程。 您可以在Savvy博客上了解有關設計和產品策略的更多信息，也可以隨時在Savvy Apps網站上與我們聯繫以獲取幫助。
Webots <<
Previous Next >> 四輪機器人模擬