40723222 cd2020 協同產品設計實習

  • Home
    • Site Map
    • reveal
    • blog
  • About
  • Develop
  • Weeks
    • Week1~5
    • Week 6~9
    • Week 10~14
    • Week 15~18
  • Mini Projects
  • Assignments
  • Translation
    • BubbleRob tutorial
    • DesignCollaborationBetterProducts
    • MechatronicDesignCases
BubbleRob tutorial << Previous Next >> MechatronicDesignCases

DesignCollaborationBetterProducts

DesignCollaborationBetterProducts

  設計協調更好的產品.txt -- 引印於2/29/2020,4:04:22 晚上 -- 第一頁
Create a Better Product With Design Collaboration — Mindset, Tools, Process
  透過設計協調創作更好的場品 — 心態、工具、過程
Shaun Moynihan

Jul 10, 2019

2019年 7月 10 日 

Digital products are more complex today than ever before. Creating them requires multiple team members, each with their own set of skills and expertise. At Savvy, for example, our customers work closely with: a product manager, UX designer, visual designer, developer(s), content strategist, and a growth specialist.

現今的數位產品比以往都還要複雜。創建他們需要更多的團隊。每位成員都需要擁有自己的技藝與專業知識。例如Savvy,我們的顧客。需要與產品經理、UX設計師、視覺設計師、開發人員、內容策略師還有增長專家密切配合。

We use design collaboration to handle this complexity. Done right, design collaboration empowers each of those experts with the mindset, process, and tools to come together and build a better product faster.

我們藉由設計協同來處理這種複雜性。正確的設計協同可以讓每一位專家擁有思維、流程和工具來快速的建立更好的產品。

We wrote this resource to help other app creators adopt a collaboration culture and process. Read on to learn why design collaboration is important for creating compelling products and experiences. We'll also dive into the elements of a design collaboration mindset and culture, tools for effective design collaboration, and a real-world example of design collaboration at work.

我們撰寫這篇資源是為了幫助其他APP創作者採用文化偕同和流程。深入閱讀了解為何設計協同對於創作引人注目的產品和體驗來說非常重要

What is "Design" Collaboration?

什麼是”設計”協同?

Before we jump into it, we need to get on the same page about what design collaboration is... and is not. At its simplest, design collaboration is collaboration in a design-first environment. But, because of the nature of design, especially the design we do at Savvy, design collaboration tends to go beyond what people normally think of as collaboration.

在直接跳入主題前,我們需要了解什麼是設計協同…什麼不是。簡單來說,設計協同就是在以設計為主的環境中進行協同合作。但是,因為設計的本質,特別是在與Savvy合作的設計之中,設計協同往往會超出人們一般認為的合作範圍。

While collaboration is generally defined as two or more people working together on the same task towards a common goal, design collaboration involves much more.

協同一般被定義為兩個或更多的人一起為同樣的目標工作,然而設計協同所涉及的東西卻更多。

Design collaboration includes more people with different skillsets, tougher challenges, and bigger goals with farther-reaching impacts.

設計協同包羅了更多具有不同技能的人、更艱困的挑戰、更大的目標並產生更深遠的影響

You might think of collaboration as two people hanging a piece of art. It simply requires communication, teamwork, and four hands. Design collaboration is when a team of curators carefully design a visitor's experience. They select the art, choose where and how to hang it, which room it lives in (and the room's lighting, furniture), even the preceding rooms and the building as a whole.

你可能會認為協同就是兩個人懸掛一件藝術品,只需要溝通、團隊工作、和四隻手而已。設計合作是指由策劃團隊精心為參觀者設計的體驗,他們挑取藝術品並挑選掛在什麼地方、如何掛、掛在哪個房間(以及房間的燈光和家具) ,甚至是前一個房間和整棟建築物。

Why Design Collaboration is Important

為什麼設計協同是重要的。

You can design a product without collaboration, but it takes a collaborative design process to make that product great. That's why design collaboration is so fundamental.

你可以在沒有協同的情況下設計出一件產品,但透過一個合作的設計過程可以讓產品變的更加優秀,這就是為什麼設計協同是如此的重要。

We don't just build apps for our customers. Savvy builds multi-platform experiences, complex internal systems, and in some cases, entire brands and businesses. To do so, we leverage expertise across several core disciplines: strategy, design, development, and growth. Each project involves many people, each with their own skillsets and specialties.

我們並不只是為顧客構建應用程式,Savvy構建了多平台體驗、複雜的內部系統,並且在某些情況下,還可以構建整個品牌與業務,為此我們在戰略、設計、開發和成長等領域利用核心專業技術,每個項目都有許多人參加,每個人都有自己的技藝與專長。

Design collaboration puts those minds together, combining their separate, specialized expertise to create solutions that tackle all aspects of a shared goal. Instead of coming at a problem from one angle, design collaboration places that problem in front of all experts, forcing them to consider new perspectives and possibilities.

設計協同將這些人的思想概念結合在一起,將他們獨自的專業知識結合起來,創造出能夠解決共同目標所有方面問題的方案。設計協同不是從一個角度來解決一個問題,而是將所有問題放在專家面前,迫使他們考慮新的觀點與可能性。

For example, we involve our developers early on in the design process to make sure we're accounting for technical opportunities and limitations as soon as possible. This allows us to take advantage of and push our technical capabilities while eliminating costly roadblocks further in the process. It also limits how much a single person can work in a silo, keeping the work in the open and the emphasis on the user needs and product goals.

例如,我們在早期的設計過程就讓開翻人員參予進來,確保盡快解決技術問題與侷限性。這使我們能夠利用在推動技術能力過程時,進一步消除昂貴的路障。這也同時限制一個人在筒倉的工作量,保持工廠的開放性,將重點放在用戶需求與產品目標上。

Cultivating a Design Collaboration Mindset

培養設計協同的心態

The right mindset goes a long way in establishing effective collaboration in the design process. It lays the guidelines for who collaborates, how, and to what end.

正確的心態能幫助在設計過程中建立有效的合作關係,它為由誰來合作、如何合作以及合作的目的制定了準則。

COLLABORATION IS FOR EVERYONE

協同是人人都可以的。

Designers sometimes think that people who are not designers are not qualified to give good feedback. But great design is more than visuals. It encompasses everything about a product, from its branding to its engineering to its growth.

設計師有時候會認為不是設計師的人是沒有資格給出好的反饋的。但是,好的設計是不僅僅有視覺效果而已的,它包含了一個產品的一切,從品牌到工程再到在到期發展的一切。

Design collaboration brings in many people, each with their own perspectives and strengths. It gives everyone a voice. These fresh perspectives give designers more information. Perspectives equip designers to make the right decisions on choices that have lasting impacts on other design, development, and marketing options down the road.

設計協同引進了許多人,每個人都有其自己的觀點與優勢,它使每個人都可以擁有發言權,這些創新的視角給了設計師更多的信息。觀點可以讓設計師能夠做出正確的決定,這些選擇會對以後的設計、開發與營銷產生持久的引響。

Collaboration with customers is as important as collaboration with other designers and team members. At Savvy, we keep our customer involved throughout the creation of their product. We take our time to explain options and have discussions with the customer to make sure we understand their thoughts.

與客戶的合作和與其他設計師、團隊成員的合作同樣重要。在與Savvy的合作中,我們讓客戶參予產品的製作過程,並花時間解釋所選方案,與客戶進行討論,以確保我們了解他們的想法。

This enables us to get buy-in from customers early on and work from clear beginnings and ends. Larger reveals aren't big surprises, and no one gets to the point where they're seeing work for the first time.

這樣一來,我們就可以確保客戶的買帳並使工作有始有終,較大的揭露並不是什麼太大的驚喜,沒有人會因為第一次看到工作而感到驚訝。

Customer collaboration means arriving at a more defined product sooner, without costly back-stepping and unnecessary meetings.

客戶的合作意味著更早產生一個確定的產品,避免了昂貴的迴避與不必要的會議。

It's easy to get caught up in your role and ignore the big picture. By involving more people earlier on, you're fostering closer connections with teammates and cultivating a shared responsibility and interest in the success of the product. You're creating a more open and transparent process, as well a more connected and invested team.

人們很容易沉浸在自己所扮演的角色中而忽略了大局關,透過讓更多的人在早期參與進來,就能將團隊成員之間的聯繫培養的更緊密,並培養出責任感與對產品是否能成功的興趣。你正在創造一個更開放、更透明的過程,以及一個更有聯繫和投入的團體。

COLLABORATION IS CONTEXTUAL

協同是有背景的

Customers come to us with complex challenges and goals. Not to mention, we continue to work with our customers for months, even years, and accumulate vast tomes of knowledge on past decisions, research, and other valuable context.

客戶帶著複雜的挑戰與目標來尋找我們。更別提我們會持續與客戶合作數月甚至數年,累積了大量的知識,包含過去的決策、研究等其他有價值的背景。

By adopting a context-first approach, you can make sure everyone is at the highest level of knowledge. This enables them to make the most informed decisions as they work on the product. To accomplish this, we keep everyone at Savvy updated on relevant information by bringing in all team members early, documenting and recording meetings, establishing some overlap, and treating the next team member in the process like a customer.

透過適者生存的方法,確保每個人都處於最高的知識水平。使他們能夠在開發產品的過程中能夠做出最明確的決定,為了能夠做到這一點,我們透過提前召集所有團隊成員,紀錄和紀錄會議的內容,建立一些重和點,並將下一個團隊成員視為顧客,讓Savvy團隊的每一個人都能及時了解相關資訊。

Context is just as important on a case-by-case collaborative basis. Follow these guidelines to keep context first in collaboration:

在個案合作的基礎上,情境同樣重要,遵循這些準則,在合作中要把情境放在首位。

Provide context before showing your work. Chances are if your work is on the screen while you're giving context, you've lost your audience's attention.

在顯示您的工作之前提供上下文。在提供背景信息的情況下,如果您的作品出現在屏幕上,那麼您可能會失去聽眾的注意力。

Describe the problem you're trying to solve or goal you're trying to achieve.

描述您要解決的問題或要達到的目標。



Present your work as it relates to the problem at hand. Explain your thinking and why you made certain decisions.

介紹與當前問題相關的工作。說明您的想法以及做出某些決定的原因。

Be specific about what you want feedback on.

請具體說明您要反饋的內容。

COLLABORATION IS OPEN, HONEST, AND FEARLESS

合作是開放,誠實和無畏的

It isn't easy to put your work (and yourself) out there. Emotions can get in the way of providing open and honest feedback, especially when you're worried about hurting the other person's feelings.

將您的工作(和您自己)放在那裡並不容易。情緒會阻礙您提供坦誠的反饋,尤其是當您擔心會傷害對方的感受時。

That doesn't mean there's no place for emotion in collaboration. How something makes you feel is important in design. We think of and create solutions for people... people who are emotional, and who use emotions in their decisions. Leaving emotion out of the conversation might short-change a potential idea or solution. At best, having only a pragmatic discussion around facts and data won't provide the full picture. At worst, it may be a red herring or provide a false narrative.

這並不意味著在協作中沒有情感的位置。在設計中,讓您感覺如何是很重要的。我們為人們思考並為他們創建解決方案,有情感並在決策中使用情感的人。在對話中留下的情感可能會縮短潛在的想法或解決方案。充其量,僅就事實和數據進行務實的討論將無法提供全面的信息。在最壞的情況下,它可能是掩人耳目或提供虛假的敘述。

At Savvy, we empower our team to be "fearless" about receiving feedback. This means letting go of any anxieties about being judged for what we create. It also means understanding that we are stronger together and stand a greater chance of creating something great. In being fearless, we better trust and empower each other to give honest and thoughtful feedback.

在與Savvy的合作中,我們使我們的團隊對收到反饋感到“無所畏懼”。這意味著放開對我們所創造的東西進行判斷不會感到任何焦慮。這也意味著我們在一起將會更加強大,更有機會創造偉大的事物。在無所畏懼的情況下,我們會更好地相互信任和相互賦予能力,以提供誠實和周到的反饋。

Our team also believes in being fearless about providing feedback. This means understanding the problem that needs solving as well as the customer's brand and goals. It also means asking lots of questions either to uncover relevant thoughts or to help guide decisions.

我們的團隊還信奉無所畏懼地提供反饋。這意味著能夠了解需要解決的問題以及客戶的品牌和目標。同時也意味著可以問很多問題,以發現相關的思想或幫助指導決策。

Try presenting feedback in an exploratory and guiding manner, with the intent of building up and improving the work rather than tearing it down.

嘗試以探索性和指導性的方式提出反饋意見,目的是建立和改進工作,而不是拆散工作。

Your feedback should be constructive. Instead of saying you don't like something, frame your feedback to point back to the problem you're trying to help solve. Provide actionable steps on improving the work or at the very least the reasoning behind your thinking. And don't forget to express what you like and why.

您的反饋意見應具有建設性。與其說您不喜歡某些東西,不如說出您的反饋意見以指出您要幫助解決的問題。提供可行的步驟來改進工作,或者至少提供您思考背後的理由。並且不要忘了表達您喜歡什麼以及為什麼。

COLLABORATION IS MORE THAN NEW IDEAS

合作不僅僅是新的想法

It's one thing to be open and accepting of collaborative feedback, another to parse those thoughts and use them as catalysts to spark your own. This is a more advanced skill that develops over time. One way to practice this is to become a better listener.

開放並接受協作反饋是一回事,解析這些想法並將其用來催生您自己的想法是另一回事。隨著時間的推移,這是一項更高級的技能。實踐方法將成為更好的聽眾。

Often, during a conversation with others, we think more about what we are going to say next rather than what others are saying. This impacts the feedback process, especially in design, because we often know what we want to say before hearing another opinion or solution.

通常,在與他人交談時,我們會更多地考慮接下來要說的內容,而不是別人在說什麼。這會影響反饋過程,尤其是在設計過程中,因為在聽到其他意見或解決方案之前,我們通常會知道我們要說的話。

When you choose to listen first and react second, it allows you to fully understand the feedback someone else is presenting and sets you up to go deeper — what is the perspective they're using and the place they're coming from? Chances are this is a perspective you didn't consider during the creation process. By listening to and understanding the context and reasoning behind the feedback you're receiving, you're opening yourself to more ways of looking at, thinking of, and experiencing your design. You can then test these new perspectives against the challenges, goals, and use cases you're designing for to see if they better suit the user.

當您選擇先聆聽然後再做出反應時,它可以讓您完全理解其他人的反饋,並讓您更深入地了解自己 — 他們使用的觀點是什麼以及來自何處?很有可能這是您在創建過程中未曾考慮過的觀點。通過聽取並理解收到反饋時背後的上下文和推理,您可以以更多的方式來審視,思考和體驗設計。然後,您可以針對要設計的挑戰,目標和用例來測試這些新觀點,以查看它們是否更適合用戶。

It's easier to be more receptive of feedback when all collaborators practice active listening. Ultimately, the skill of giving great feedback comes from learning how to receive it. As we make an effort to be better listeners, we also find ourselves becoming more humble and, in our opinion, better designers.

當所有協作者都在積極聆聽時,更容易接受反饋。最終,提供良好反饋的技能來自於學習如何獲得反饋。當我們努力成為更好的聽眾時,我們也發現自己變得更加謙虛,並認為我們是更好的設計師。

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.

Figma降低了某人在筒倉中工作的能力。

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.

使用時:流程文檔,高保真線框,即時協作,以及引導客戶瀏覽一系列屏幕,以解釋並獲得有關設計方向的反饋。

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.

Marvel是一個更簡潔、規範和專注的空間,非常適合與非設計團隊成員進行協作。

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應用程序在設備環境中查看它們的運行情況。

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

階段1:線框和自由討論

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.

精明的視覺設計師負責創建實際的繪畫動畫,他們的眼睛新鮮,而且對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

階段3:迭代和反饋

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

階段4:客戶的反饋和發展

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.

當我們找到了幾種最終確定的體驗版本時,視覺設計師使用Figma與客戶一起瀏覽了它們。 Press Play的產品經理和UX設計師也提供了反饋和指導。

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.

一旦他們都了解了會引起客戶興趣的東西,視覺設計師便開始著手讓視覺效果最大化,並為開發做好準備。他繼續與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.

基於這一發現,我們決定在其他兩個地方也改進該應用程序。我們在“獲勝者圈子”中添加了一個結果/實際繪圖元素,並在應用程序的“用戶詳細信息”端添加了“輸贏歷史記錄”部分。最後,設計協作使我們能夠實現用戶體驗中這未滿足的需求。

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網站上與我們聯繫以獲取幫助。


BubbleRob tutorial << Previous Next >> MechatronicDesignCases

Copyright © All rights reserved | This template is made with by Colorlib