That Conference 2018 – Design Patterns: Not Just for Architects

That Conference 2018, Kalahari Resort, Lake Delton, WI
Design Patterns: Not Just for Architects – Jeremy Clark

Day 2, 7 Aug 2018  1:00 PM

Disclaimer: This post contains my own thoughts and notes based on attending That Conference 2018 presentations. Some content maps directly to what was originally presented. Other content is paraphrased or represents my own thoughts and opinions and should not be construed as reflecting the opinion of the speakers.

Executive Summary

  • There exist lots of design patterns that have been defined
  • We already use many of these without realizing it
  • Worth learning them–helps in communication
  • Examples of several patterns in C#

 

Goal: We’re already using design patterns, so worth putting a name on them

 

What are Design Patterns?

  • (Christopher Alexander quote)
  • Describes solution in a way that you can use it over and over again

 

Gang of Four book (GoF)

  • Gamma, Helm, Johnson, Vlissides
  • “Serious developer” needs to have this
  • Still relevant?  Yes
  • Examples in C++ and Smalltalk

 

Anatomy of a Design Pattern

  • Pattern Name
    • Unique way of referring to pattern
  • Problem
    • Problem that occurs over and over again
  • Solution
    • “Core” of the solution
    • Example implementations are not solutions
  • Consequences
    • Pros and cons
    • Things to watch out for

 

GoF Patterns

  • 23 different patterns
  • Categories
    • Creational
    • Structural
    • Behavioral
  • Book is a bit academic
    • Go through it at some point in your career
    • “You’re not ready for it yet”

 

Good starting point

  • Head First Design Patterns – Freeman, Freeman
  • Covers 12 of the GoF patterns
    • Same descriptions
    • Just explains it in a more approachable way
  • Examples in Java
    • But pretty general, so ok
    • Online, translations into various programming languages

 

Why Should We Care?

  • These are well-described solutions
  • Shared vocabulary
    • Easier to talk with other devs
  • Concise language
    • Quicker/shorter to just mention the pattern, rather than describing it in detail
  • Think in design rather than implementation
  • Encourage other developers to learn patterns

 

Observer pattern

  • When object changes state, dependent objects notified automatically
  • Publish-subscribe relationship

 

Real World Observer

  • Twitter – someone tweets, subscribers are notified

 

Implementation of Observer (C#)

  • Event handlers on button
  • This is ubiquitous in C# and in frameworks
  • Problem => Pattern => implementation of the pattern
    • E.g. pubsub => Observer pattern => event handlers
  • Prism, event aggregator
    • Publisher, subscribers don’t know about each other
  • .NET 4.0 – IObserver<T>
  • Consequences
    • I don’t know how many times I’ll be notified
    • Don’t know how frequently I’ll be notified
    • Don’t know if we’ll ever be notified

 

Iterator Pattern

  • Access elements of object sequentially without knowing about implementation of the thing
  • Get next item, stops at end
  • Real-world: Channel up button on TV Remote
  • In C#, foreach loop uses the iterator

 

Implementation of Iterator (C#)

  • Get List<T>, case to IEnumerable<T>
  • IEnumerable<T> says that object supports get next element (foreach)
  • All collections in .NET implement IEnumerable<T>
  • Nice that this is built into .NET (C#)

 

Facade Pattern

  • Unified interface for a set of interfaces in a sub-system
  • Higher-level interface makes things easier to use
  • Wrap complex stuff in simpler API

 

Real World Facade

  • Universal remote control wrapping access to multiple devices

 

Facade Implementation

  • foreach loop is also an example of facade
  • GetEnumerator
  • while (enumerator.MoveNext()) … do something with enumerator.Current()
  • foreach is a nice wrapper around this
  • Consequences
    • We might lose functionality that lower level stuff has
    • E.g. foreach doesn’t give access to Reset() method

 

Chain of Responsibility

  • Avoid coupling sender to receiver
  • Giving more than one object a chance to handle the request
  • Pass request along thru children until somebody handles it

 

Real-world example

  • Tech Support – first line, person asks questions
    • If not, passes to next person, more detailed look at your question

 

Chain of Responsibility Implementation

  • Throw exception
  • Catch certain types of exceptions at certain levels in call stack
  • If not caught at one level, it propagates up to the next level
  • Consequences
    • What is nobody handles the message?

 

Proxy Pattern

  • Provide surrogate for another object to control access to it
  • Example: Power of Attorney
    • One person makes another their proxy
  • Surrogate vs. placeholder
    • Placeholder–thumbnail or icon that only loads something when you click it
    • Good idea in mobile apps–delay download of some stuff, in case you have slow connection

 

Proxy Pattern Implementation

  • Web API service, controller with Get method
  • Get collection, return via service
  • Can create proxy service class that can call the service
    • HTTP clients
  • Use the proxy in the same way that you’d treat the original class
  • Consequences
    • Hides what’s really going on with the underlying object

 

A Million Implementations

  • Use over and over

 

BUILD 2014 – Experience at the Intersection of Design and Development

BUILD 2014, San Francisco
Experience at the Intersection of Design and Development (9-003) – Charles Torre, Michael Neuman, Shane Ginsberg, Rick Barraza, Nathan Moody

Day 1, 2 Apr 2014, 12:20PM-1:00PM

Disclaimer: This post contains my own thoughts and notes based on watching BUILD 2014 keynotes and presentations. Some content maps directly to what was originally presented. Other content is paraphrased or represents my own thoughts and opinions and should not be construed as reflecting the opinion of Microsoft or of the presenters or speakers.

Let’s talk about importance of design and user experience.

(left-right) Rick Barraza, Michael Neuman, Shane Ginsberg, Nathan Moody, Charles Torre

Charles Torre – Exec Producer – App Experience

Rick Barraza – Lead Design Evangelist, Microsoft

Michael Neuman – Senior UX Designer, Obscura Digital

Shane Ginsberg – President, Evolution Bureau

Nathan Moody – Design Director, Stimulant

Q: Keep hearing about mobile-first, cloud-first, ubiquitous computing, etc. What does that mean for people who design for people?

  • (Nathan) Convergence—need holistic approach to both technology and design; make sure everything is well integrated
  • (Shane) Internet of Things is about people, not things—figure out how to create magical experiences for people
  • (Michael) Create experiences where technology is invisible, seamless
  • (Rick) Need to make interface transparent, not invisible. It’s within context that’s appropriate. How do we enhance people’s lifestyle
  • (Shane) Our job is to make stuff disappear, but then it appears and surprises/delights

Q: How can developers improve our design skills, or improve designs?

  • (Michael) Can solve 80% of what user needs by ??
  • (Rick) Traditional development is design-first; for consumers, “minimum delightful product”, have strategists/designers/developers involved together from the very beginning
    • We’re talking about consumer-based stuff
  • (Shane) Design frames the problem; if you have eyes and some empathy, you can design something
    • Need to see it thru the eyes of the user
    • Framing the problem is 80%, solving the problem is 20%
  • (Rick) Design is not just what something looks like
    • But—are you solving the right problem the right way?
    • Visual Studio gives you intelligent defaults; good place to start, if you don’t know what you doing
    • But this isn’t the most that you can do; but then do brand differentiation
    • To differentiate, you often do need to be a bit different

Q: What design considerations should we have when thinking about Cortana?

  • (Nathan) We normally create mental models of how users think
    • But seeing a trend where we create personas for our devices
    • It’s about natural conversation and natural languages
    • The key is empathy—will give you heuristics for framing decisions about natural languages
  • (Shane) Voice is (maybe) interface of future (?)
    • 20 yrs of investment in building voice-based UIs
    • But if you use voice as principal interface on some devices, it’s still not great
    • E.g. “Silly accents” mess it up
    • Full of promise; a while to go before users feel comfortable with it
  • (Rick) I need to spend some time and think about it (voice)
    • Can be powerful
    • One guidance—for new technologies, e.g. voice/gestures, “form follows fiction”
    • People have seen these interactions already in fiction (e.g. Tony Stark, Master Chief)
    • Technologies will becomes something that we’re not expecting
    • But users will expect it to act a certain way

Q: As designers, how do you feel about Metro (Modern)? Did Microsoft go too far? Is iOS removal of skeumorphism a validation?

  • (Nathan) Have done a lot of work with Metro
    • Metro has made Microsoft better
    • “Authentically digital”
    • But many brands are very skeumorphic—how do you bridge the gaps? Need to be clever
    • Since Metro, has been big shift at Microsoft. Metro is starting point, but need to go where the brand leads you
    • Metro concepts work really well in touch-first environment
    • Bold move
    • Starting to see major ripple effects
  • (Shane) Skeumorphism vs. flat is a side point, not critical
    • Did Metro go far enough?
    • Metro “flattened”, but not just about flatness
    • Rather, need to think about context, humanity, what’s the problem?
  • (Michael) Superficial, would rather see UI where people aren’t also looking down at their hands
    • It really is all about interactivity, rather than about what it looks like
    • How are the displays touching you, rather than you touching the displays?
    • E.g. directional microphones
    • Old-school to think about what handset looks like
  • (Rick) Windows Design Language—apps are somewhere from transactional to immersive
    • I joined Microsoft because of trajectory of Metro and design language
    • Design is about solving problems
    • For transactional app (most apps), Metro forces you to think about how to solve the problem
    • Became two things
    • Prescriptive—people took it to be too prescriptive, even for immersive experience
    • Operating system shouldn’t be defining what immersive apps should look like
    • You don’t have to strip things down
    • This is Microsoft’s visual identity, for Microsoft apps and for traditional transactional apps
    • But customer’s apps should bring their own design look to it

Q: Charles – if you create design language, is it a base for everything? Why can’t I create my own visual experience (e.g. 3D gel)?

  • (Rick) That’s not the visual identity that Microsoft uses
    • There’s just “good design”, regardless of platform
    • Our visual design language is for Microsoft “first party” apps
    • So if you want to do something different, visually, you should do that and can do that
  • (Charles) So I can make a skeumorphic app; it’s “not scripture”
  • (Michael) Skeumorphic is less relevant as we do augmented reality
  • (Shane) Design is also subject to fashion
    • 20 yrs ago—flat, then skeumorphic, now flat again
    • Ultimate testament is how people use it; if consumers “dig it”
    • Very short cycle now to learn how users respond to stuff

Q: What advice for devs to improve UI skills?

  • (Shane) Go to favorite UI and ask “why” about everything
  • (Rick) Try to rebuild something
  • (Michael) Use case not predicate on software, e.g. animate a dream

Q: Universal App and impact on design?

  • (Charles) Shared experience across different devices? How do you design for this? Maintain empathy for customers..
  • (Rick) Hire a professional
    • If doing transactional app, you’re fine
    • But for immersive, need professional; no “magic pill”
  • (Shane) Responsive design
    • Design in context of its use; playing Halo is very different context to sitting at home
    • This is a challenge—universal, but with context awareness, design applicability
    • It’s hard
  • (Nathan) It’s hard, yes
    • Think about what service you’re providing—and think about what you want in the context in which you’re in
    • Context changes this a lot
  • (Rick) There’s range of software that won’t be apps
    • E.g. Obscura Digital, amazing experiences—e.g. sound, projection mapping
    • Shouldn’t just funnel it down to apps in Windows Store
  • (Michael) What excites us is things like luminescent paint on roads that shows that snow is coming
    • Not just about computers
    • User-centered experience
  • (Shane) World beyond the screen is what’s important
  • (Charles) Just be empathetic—think about who is using the software
  • (Rick) Commenting code, e.g.

Rick’s Kinect demo

Showing Kinect V2 sensor in Windows Store app

We need to encourage “play” on our platform. That’s how we get Natural User Interfaces

Channel 9 video