What I learned at the PixelUp2019 — Day 2

1. Katya Kostyukova  — People First. Designing Facebook Spaces.
2. Jina Anne  — Design systems are for people
3. Sebabatso Mtimkulu  — Creating a safe space for designers to fail
4. Andrew Harder  — Unleashing the power of design in growing organisations
5. Mina Markham  — Full-featured art direction for the web
6. Eva-Lotta Lamm  — You can sketch. (You might just not know it yet.)

With Virtual Reality, we have an opportunity to build a first people centered platform. If for decades the computers and smartphones have been organized around applications, in VR we can switch that around entirely and design experiences where people are at the core, and then build utility and services on top.

VR is the next big leap for connecting and bringing people together. It has the power to connect people across time and distances in a new powerful way that makes you feel like you are right next to that person.

That’s exactly what we’ve been trying to do with the first product we’ve built, Facebook Spaces. With Facebook Spaces you can be with your friends and feel like you’re in the same room, even if you’re thousands of miles away from each other. Everyone has an avatar, and sits around a virtual table. That’s the core of the experience. People. Nothing is more important in Spaces than the people you’re with.

• Present in a non physical world — self presence; social presence; spacial presence
• Use avatars — whaen using realistic heads, it felt wierd and creepy, entering into the uncanny vally. It sill allows expressiveness.
• Hands are important — movement and gestures helped in recognising people
• Gestures rendered facial expressions (there was no way to track faces)

• Environment: Where is the interface in this world?
  Consider the field of view: Curved UI and Depth
• Confront physical movement: How does the interface re-orientate?
  Sitting vs Standing. A table served as an anchor, and keept people anchored. They set up a ‘personal boundary’ — so people could not get to close.

“Tech should bring people closer, rather than keep them apart”

Design Systems grew out of a need to build consistent, cohesive visual experiences across devices and platforms, and to centralize and consolidate design efforts.

While they create a better user experience, increase the efficiency of teams, and improve the quality of products, Design Systems need to be more than just inventories and deliverables, if they are to be successful.

As Jina Anne shows us in her seminar, Design Systems empower change within an organization and form the bedrock of a company’s culture and community. Your design system ultimately serves people: both your customers and your colleagues.

Design systems fail when they lack a vision, a shared language, and purpose. Designers, developers, product managers, and anyone interested in building a successful design system in their business will benefit from this seminar.

• Why design systems? Tools; automation; patterns; closing the gap between dev and design.
• The purpose of design systems? For people (the end users)
• For success and productivity, design ststems do’nt inherently make this happen, people make this happen.
• Design systems empower change in culture, how people work and communicate.
• Material outputs: Files
  Non-material outputs: Principles
• Principles should be relatable and memorable, keep people connected and be included in presentations.
• Design systems fail because of a lack of unified vision, shared purpose and language.

‘You cannot innovate on product unless you innovate on the way you build them”

• Great products are the ones you create with great customer support. Create a community, everyone should be the owner.
• Listen : Build relationships and solve problems together; Focus on the individual; Help other go further
• Work/pairing sessions : Mutual learings. Design systems as a advisory board.

1. Takers — serve me
2. Giver — do for you
3. Matcher — do for me and I do for you

“Designs are for people”

Design is the conception and realisation of new things. There is a natural fear present when a new thing is being created. This comes in various forms; maybe a fear of being perceived as incompetent, insignificant, and more commonly, a fear of failure. This can be daunting if part of your everyday reality. Most often than not, Designers operate in this state of mind.

This talk is for all Designers and those that look after Design teams.

Learn about the acceptable, natural ups and downs necessary to fuel the successful creation of new products Learn how to identify unhealthy states of discomfort, and How to apply tools that help create spaces where Designers have permission to test assumptions, learn and ultimately thrive.

“Vulnerability is the birthplace of creativity, innovation and change” — Brene Brown

1. Intelligent failer — openly communicate when an idea wont work
2. When a team kills a project, they still get a bonus
3. Failures are celebrated by peers and applauded by management
4. Failed prototypes are showcased
5. Annual celebration of failed work — people hear what when wrong and the learnings
6. Failed projects get a formal sense of closure, people let go of the emotional baggage

1. Teach stakeholders how to treat and communicate with design teams (so they give valuable feedback)
2. Teach members of the design team how to communicate and interact with each other.

1. How are you feeling?
2. Anything you are uncomfortable with?
3. Do you have feedback for me?

“Software + Hardware = Heartware”

Design has a unique power to let us delight customers, build successful businesses and create new technological possibilities. However as our teams grow in size and complexity, many factors can limit the potential of design.

In this talk, Andrew shares his perspective on the three core principles of successful design and how we can overcome the unique challenges of large organisations to create beautiful products that can change the world.

• A deeper understanding of the human experience
• Emotions and stories are the cornerstone of empathy
• Empathy guides desisions through understanding experience

Internal complexity is easier to solve than external certainty

• Iteration allows you to find the small changes that make a big difference
• Product complexity increases with scale
• Build a holistic product vision (the north star)

Now that we have the tools to superpower our layouts, we can start to reimagine how we approach art direction and design on the web.

By taking advantage of technologies, some new and some overlooked, we can create a progressively-enhanced design that’s powered by feature queries; one that’s localized for an increasingly global audience.

In this talk drawn from her work for Slack and other properties, Mina walks through her process for enhancing design and shows how little changes lead to big design payoffs.

• The combination of art and design to evoke a remotional response.
• Is progressive, localised, cross-functional, systematic

• Everything has their own experience rather than the experience designers demand of them
• A default experience
• Build the markup first, a rethingk of how we engineer our projects (not a fallback)
• It’s a feature, not a bug (not looking the same everywhere)

• Localising is not translation
• Context is everything

• On the web, front-end is more important than design
• Designers and devs need to work in the same space (pair designing)
• Collaboration breeds inclusivity
• Inclusive design is a process, not a result
• Don’t remove defaults (they are assessable and functional)

• Have a design system
• A foundation of rules
• Rules can be broken — 
  Strict (products) vs Loose (More editorial)
• Stop fighting the snowflakes, enable snowflakes
• A visual language per locale?

“Art direction is powered by design systems”

• Make an inventory of shapes needed
• Play with preportions
• Practice

• Practice the choreography — the order of drawing out shapes
• Choose the most iconic view
• If there isn’t one, combine views to create a flat perspective (font+side)

• For shadows, use a consistent light source (top-left)
• Shading gives an object more dimension
• Shadows on the outside makes an object grounded

• Combine space and shadow
• Draw a horizon line
• Leave gaps between shapes

• Through position (grouping and separation)
• Size
• Outlines (Contrast)
• Fill
• Texture and detail
• Additional objects — lines and shapes (eg: arrow)