How To Speak Unicorn: Translating Design for the Digital Age

How To Speak Unicorn: Translating Design for the Digital Age

In order to be effective, a designer needs to do more than simply provide visual solutions to predefined problems. Digital design sits at a crossroads between multiple disciplines – both within an organization (project managers, developers, technologists, stakeholders, copywriters) and outside the organization (audiences, clients, investors, users). We must embrace our role as Translators of Ideas in order to advocate for the value of design in an increasingly technical world. Conversely, we as designers can also gain insight from the constant iteration and incremental improvements of programming methodologies. Michelle will share the lessons she’s learned as a designer, translator, and communicator along her journey from design to frontend development. But this isn’t just a storytelling session – you will walk away with practical insights into using your design thinking skills to create effective solutions for the digital space, bridge gaps between disciplines, avoid the struggle of miscommunication, and develop empathy and understanding for your colleagues and your audience alike.

E195ae45320d9202eaa01c9f1d31a416?s=128

Michelle Schulp

October 04, 2019
Tweet

Transcript

  1. How To Speak Unicorn Translating Design for the Digital Age

  2. @marktimemedia What is DESIGN? What is a DESIGNER?

  3. @marktimemedia Design is bigger than “DESIGN”

  4. @marktimemedia Student of process and principles Connector of patterns and

    people Translator of ideas and emotions Researcher of systems and solutions Educator of theory and application Advocate of value and practice
  5. @marktimemedia The Design UNICORN A mythical, all-powerful design creature with

    a deep knowledge of every part of the project life cycle
  6. @marktimemedia Becoming fluent in the language and concepts of multiple

    disciplines, in order to reach across silos, solve problems creatively, and add value SPEAKING UNICORN
  7. @marktimemedia Adorable badass. Carefully curated spontaneity. Master suitcase packer &

    dedicated maker of fancy tacos. Lover of lists & purveyor of process. Chronic imposter syndrome. Definitely a Ravenclaw. Designer & Developer Conference speaker & organizer AIGA MN Director of Technology HI, I’M MICHELLE. actually not coffee
  8. @marktimemedia Anxious alicorn. Master of magic & dedicated scholar. Lover

    of lists & purveyor of process. Chronic imposter syndrome. Definitely a Ravenclaw. Princess of Friendship Leader of the Mane Six Head of the School of Friendship THIS IS TWILIGHT SPARKLE
  9. @marktimemedia The UNICORN’S JOURNEY Cyclical Purposeful Transformative

  10. @marktimemedia THE HERO’S JOURNEY https://blog.reedsy.com/heros-journey/ Literary storytelling technique following the

    main character's initiation, trials, and triumph over adversary
  11. @marktimemedia THE SCIENTIFIC METHOD A problem is identified, relevant data

    is gathered, a hypothesis is formulated from this data, and the hypothesis is empirically tested
  12. @marktimemedia THE DESIGN THINKING PROCESS https://www.interaction-design.org/literature/article/5-stages-in-the-design-thinking-process https://www.interaction-design.org/literature/article/what-is-design-thinking-and-why-is-it-so-popular

  13. @marktimemedia https://designfuckingthinking.tumblr.com/

  14. @marktimemedia THE DESIGN ABILITIES NON- PROCESS https://medium.com/stanford-d-school/lets-stop-talking-about-the-design-process-7446e52c13e8 Navigate ambiguity Learn

    from others Synthesize information Rapidly experiment Move between concrete & abstract Build & craft intentionally Communicate deliberately Design your design work
  15. @marktimemedia Student Connector Translator Researcher Educator Advocate

  16. @marktimemedia PHASE 1: Designer as Student “Always Learning”

  17. @marktimemedia The Student of Friendship

  18. @marktimemedia DESIGN SKILLS Curiosity Synthesizing Information https://medium.com/stanford-d-school/lets-stop-talking-about-the-design-process-7446e52c13e8

  19. @marktimemedia UNICORN TOOL: A Design Library Favorite design resources •

    Don’t Make Me Think – Steve Krug • The Strategic Designer – David Holston • designbetter.co/design-thinking • deardesignstudent.com • The A List Apart library
  20. @marktimemedia UNICORN TOOL: A Design Library Favorite non-design resources •

    You Are A Badass – Jen Sincero • The Four Agreements – Don Miguel Ruiz • How To Make Sense of Any Mess – Abby Covert • Atomic Habits – James Clear • Anything by Brené Brown
  21. @marktimemedia PHASE 2: Designer as Connector “People over Process over

    Tools”
  22. @marktimemedia Friendship challenges in Ponyville

  23. @marktimemedia DESIGN SKILLS Understanding Synthesizing Information Build & Craft Intentionally

  24. @marktimemedia UNICORN TOOL: The Five Whys “The 5 whys get

    from the initial problem question to a true underlying cause through deduction, ending with a concrete action item/counter-measure.”
  25. @marktimemedia UNICORN TOOL: The Five Whys • Can be a

    single flow, or multiple flows • Best if you have a team highly familiar with the subject • Not to assign blame, but to find incremental solutions
  26. @marktimemedia USING 5 WHYS • Troubleshooting existing problems • Investigate

    something unexpected • Partner with “5 Hows” (counter measures for each revealed problem)
  27. @marktimemedia

  28. @marktimemedia PHASE 3: Designer as Translator “Stop, Collaborate, and Listen”

  29. @marktimemedia The Princess of Friendship

  30. @marktimemedia https://www.interaction-design.org/literature/article/design-thinking-getting-started-with-empathy DESIGN SKILLS Empathy Learning from Others Communicating Deliberately

  31. @marktimemedia UNICORN TOOL: Non-Violent Communication Expressing and Hearing feedback without

    blame or criticism, using ‘I’ statements
  32. @marktimemedia UNICORN TOOL: Non-Violent Communication Observation, Feelings, Needs, Request “When

    I see/hear… I feel… because I need/value… Would you be willing to…?”
  33. @marktimemedia UNICORN TOOL: Active Listening Active listening comprises both a

    desire to comprehend as well as to offer support and empathy to the speaker. It differs from critical listening, in that you are not evaluating the message of the other person with the goal of offering your own opinion.
  34. @marktimemedia UNICORN TOOL: Active Listening • Yes: Neutral, patient, asking

    open ended questions & getting clarification, summarizing/reflecting, eye contact • No: Interrupting, ignoring, one-upping, waiting until you can say "your part"
  35. @marktimemedia PHASE 4: Designer as Researcher “How To Know What

    You Don’t Know”
  36. @marktimemedia Quests of the Friendship Map

  37. @marktimemedia https://www.interaction-design.org/literature/article/stage-2-in-the-design-thinking-process-define-the-problem- and-interpret-the-results DESIGN SKILLS Defining Navigating Ambiguity Moving from

    Abstract to Concrete
  38. @marktimemedia UNICORN TOOL: Atomic Design All designs can be broken

    down into foundational elements that can be assembled into any number of larger and more complex components
  39. @marktimemedia ATOMIC DESIGN BRAD FROST

  40. @marktimemedia ATOMS THE SMALLEST BUILDING BLOCKS

  41. @marktimemedia http://zqsmm.qiniucdn.com/data/20110511083224/index.html

  42. @marktimemedia MOLECULES UNIQUE COMBINATIONS OF ATOMS

  43. @marktimemedia

  44. @marktimemedia ORGANISMS MOLECULES COMING TOGETHER ALLOW ACTION

  45. @marktimemedia

  46. @marktimemedia TEMPLATES ORGANISMS TOGETHER BECOME LAYOUTS

  47. @marktimemedia

  48. @marktimemedia PAGES TEMPLATES WITH SPECIFIC CONTENT

  49. @marktimemedia

  50. @marktimemedia UNICORN TOOL: Atomic Design Use Case: Designing a system

    • Designing rules rather than screens • Designing puzzle pieces • Designing from small to large, general to specific
  51. @marktimemedia UNICORN TOOL: Atomic Design Use Case: Designing for the

    unknown • Designing for content that doesn’t exist • Leveraging pattern finding to build future content types http://atomicdesign.bradfrost.com/ https://www.designbetter.co/design-systems-handbook
  52. @marktimemedia PHASE 5: Designer as Educator “Learning by Teaching”

  53. @marktimemedia Opening a school

  54. @marktimemedia https://www.interaction-design.org/literature/article/stage-3-in-the-design-thinking-process-ideate DESIGN SKILLS Ideating & Prototyping Rapidly Experimenting Learning

    from Others
  55. @marktimemedia UNICORN TOOL: Pair Programming Two people working together on

    the same problem at the same station, usually with different roles, but offering equal collaboration
  56. @marktimemedia UNICORN TOOL: Pair Programming Use Case: Working Together •

    Mentorship and onboarding • Brainstorming and collaboration https://uxdesign.cc/three-models-of-pair-design-f75e3b29a51a https://medium.com/product-labs/how-designers-and-developers- can-pair-together-to-create-better-products-e4b09e3ca096
  57. @marktimemedia PHASE 5: Designer as Advocate “Building Bridges”

  58. @marktimemedia Ambassador to other kingdoms

  59. @marktimemedia DESIGN SKILLS Build & Craft Intentionally Designing your Design

    Work
  60. @marktimemedia UNICORN TOOL: DesignOps/DevOps The combination of cultural philosophies, practices,

    and tools that increases an organization’s ability to deliver well- designed, high-quality applications and services that meet people’s needs, while working at high velocity
  61. @marktimemedia UNICORN TOOL: DesignOps/DevOps The design of best-practice processes, developing

    unified values and workflow across teams, disciplines, and roles https://www.uxmatters.com/mt/archives/2018/09/designops.php https://www.designbetter.co/designops-handbook https://uxdesign.cc/designops-the-questions-youre-probably- asking-yourself-now-fdac491bfe4f
  62. @marktimemedia PHASE 7: Designer as Student (again) “Get Comfortable Being

    Uncomfortable”
  63. @marktimemedia New challenges await

  64. @marktimemedia DESIGN SKILLS The Design Cycle Learning from Others Designing

    your Design Work
  65. @marktimemedia UNICORN TOOL: Agile Principles Individuals and interactions over processes

    and tools Working software over comprehensive documentation Customer collaboration over contract negotiation Responding to change over following a plan http://agilemanifesto.org/principles.html
  66. @marktimemedia

  67. @marktimemedia

  68. @marktimemedia Student Connector Translator Researcher Educator Advocate

  69. @marktimemedia QUESTIONS? Here’s how to get in touch: Michelle Schulp

    michelle@marktimemedia.com @marktimemedia michelleschulp.pink bit.ly/digital-unicorn WHERE TO FIND ME NEXT: ONLINE: Various podcasts (do you have one? Want a guest?) Fitness & Freelance blog EVENTS: Cocktails with Creatives Solopreneurs meetup The Draw In SPEAKING: WordCamp US