Question: How do we do user interface design work in a community process?

warren is asking a question about ui
Follow this topic

by warren | with caufenkamp , julvie , tommystyles January 22, 2018 23:46 | #15587


With generous support from Autodesk, @caufenkamp, @tommystyles, @julvie and I have been meeting for a few months, digging into tough questions about user interface design on PublicLab.org -- see this post, for some of the topics we got into: https://publiclab.org/questions/tommystyles/10-20-2017/need-your-feedback-on-tag-pages#a725

We have a lot to work from here, and you'll see a number of changes to our site leading out of this work and @siyuan's work in this post

Today we had a great discussion about how Public Lab might structure and support user interface design work going forward -- thinking about how designers who want to pitch in can quickly:

  • get up to speed on design conventions and our "style"
  • look through and choose design problems that need help
  • learn about contextual details necessary to good design work
  • find empirical data to work from -- interviews, user studies, survey results -- to inform design work
  • get feedback on designs or test them out
  • evaluate success of their design work

...all working in a small, modular workflow, rather than taking on massive bespoke design projects! Read more about that here.

I'll paste the notes I took from this discussion below. Thanks to the whole Autodesk Pro Bono team!



10 Comments

Our discussion covered a lot of topics! @liz @stevie this is great stuff for planning out how we'll engage design contributions.

Tommy

How do we do this on design? It's hard to do without the big view. Cohesion, unified.

Not a design czar. Small design committee, to own the cohesion goal?

Style guide. Principles for smaller design conventions.

vs. clean sheet design of a large feature

When to say "let's start over with some sketches!"

What's set in stone. What's out of scope?

The need for context!

Craig

Lots of context needed! It takes time getting ppl caught up if they're new to the site!

Coders don't need the "onboarding" context as much -- not as existential.

What's the raw data to work with? Eval team reports? Interviews or user studies to browse through?

What's the Wikipedia article about Public Lab?

We're not trying to revisit the fundamental tenets -- but here are areas where we need work! This is what's up for grabs.

A process: "when we do design, we'd like to see artifacts A B and C -- a workflow convention.

Tommy

Cool to have a place where you provide the starting ingredients for a designer.

LUMA technique about stakeholder mapping -- where could a designer dig into existing information like this?

Recurring design challenges/questions...

What are "old interfaces"?

Relate to yearly survey process!

Either 20 people have added stuff to this page, and not coordinated OR this was never designed... HELP

A "toolbox" of design modules

"Design modules" idea -- widgets to display groups of people, maps, graphs, design elements that recur a lot. A design vocabulary rather than page-based designs.

  • maps module
  • people module
  • "pulse" module

Craig

Engage a group of people to reflect on and respond to a design on a cycle.

A way to do a quick feedback cycle on a design idea.

Feedback on style conventions too -- colors, styles, fonts. The "look".

Tommy

A list of design conventions across the site

(Jeff: https://publiclab.org/wiki/glossary)

This should be part of the style guide!

Jeff

Quick iteration reviews of design work -- a mini design review workflow

Is this a question? Click here to post it to the Questions page.

Also noting this as a reference (though it's for print!) http://publiclab.org/style-guide


It was written in one github issue and illustrated in another that "a consistent 3-column "at a glance" display" is a style we are trying to establish.


We should also address sidebars in a style guide


Reply to this comment...


@liz shared this great resource, re: the discussion below of a "style guide" or "design modules" -- https://lawsofux.com/

Reply to this comment...


The Design Justice Network describes themselves as:

We are striving to create design practices that center those who stand to be most adversely impacted by design decisions in design processes. We work to challenge the ways that design and designers harm Indigenous peoples, communities of color, poor and working class people, the sick and disabled, migrants, LGBTQ people, women and femmes. We use design to imagine and build the world we need to live in — one that is safe and just. We do this by producing work that is based on shared principles of design justice, by growing our international network of design practitioners and advocates, creating critical publications, and curating exhibitions.

Read the design justice network principles: http://designjusticenetwork.org/network-principles/

Reply to this comment...


Here are some great design blocks using Bootstrap (so compatible w our site) that we could use across the site as a style guide at some levels:

https://www.froala.com/design-blocks

I'd like to try a community UI process for the profile page, maybe working from this basic sketch as a starting point:

IMG_20180219_174943.jpg

Reply to this comment...




One more answer! We've had some community-input processes on design in the past, and this Google Presentation has been really helpful to "build" mockups using some standard parts, collaboratively:

https://docs.google.com/presentation/d/1TCZoTfuhamRVrUak8aDgqJAwSgyhRtZg2Pgacl2_4zc/edit#slide=id.g3211328fd3_0_0

It's a bit of a mess, but Google Presentations is not a terrible environment to do highly-collaborative mockups.

Reply to this comment...


Log in to comment