Refine Card design and taxonomy

[iamjessklein]

Taxonomy friends - please take a look at this list and confirm that you agree with these definitions.

Based on feedback that the taxonomy of the methods can be inconsistent, I took a stab at tweaking the cards. In the wireframe below I have a draft of this. One major tweak is that I added "card type" so that we can accommodate a combination of methods.

The taxonomy includes:

• Card Title: Name of method or guide
• Card Type: Distinguishes between methods and guides.
  • Method: A manner or procedure for performing a design task.
  • Guide: A set of methods combined to achieve a larger collective design task.
• Process Stage: Identifies what part of open design process this card fits into.
• Card Summary: A tweet-length simple-wiki style description of a method or guide.
• Author: An individual who contributed to writing or editing the method or guide.

cc/ @toolness @pamela-drouin @dmichl

[pamela-drouin]

Makes sense to me!

[iamjessklein]

Okay, I'll work on a few examples of what it could look like.

[iamjessklein]

I made a few different iterations. With the help of @davelab6 I played around with the fonts - adding Montserrat to the mix. Also, I played around with representing the process stage as an icon rather than text. Please let me know your preference.

[xuv]

♥️ top-right.

[toolness]

I agree, I like the top-right. As long as you don't plan to introduce more of those funky icons (in which case showing them all dimmed-out might not scale) I think it is a fab solution, especially (as you mentioned on Riot) if a card happens to be associated with more than one icon.

[mjchamplin]

Love the top-right. I think the type weight is nicely balanced and it's generally very readable with good visual hierarchy.

Agree with @toolness about iconography.

[iamjessklein]

Okay! Top right it is!

Here are the details:

The "plus sign" won't be implemented right away, but I did HT to @xuv and forkawesome 🍴 @toolness I'm going to "assign" to you for implementation. Please let me know if you need anything else.

[mjchamplin]

My only tiny nitpick after looking at the spec is that the contributor text is awfully small. I have trouble reading it. Just my $.02!

[iamjessklein]

Good nitpick! I’ll bump up the size.

On Fri, Mar 2, 2018 at 3:42 PM mjchamplin notifications@github.com wrote:

My only tiny nitpick after looking at the spec is that the contributor text is awfully small. I have trouble reading it. Just my $.02!

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub https://github.com/open-design-kit/opendesignkit/issues/278#issuecomment-370046566, or mute the thread https://github.com/notifications/unsubscribe-auth/AAgp5CVRDGyjcfZNBhQ1zCry8Z4pAtIlks5taa6sgaJpZM4SK3jH .

[iamjessklein]

Okay, back at it again. Here's a modified version that will be slightly easier to implement (in an agile way) and that takes into account inclusive design (using text rather than icons so that it can be read with more ease by screenreaders).

[mjchamplin]

I like this, @iamjessklein. The icons were cool, but I do like the accessibility of the tag instead of the icon. It's also more discoverable, since the icons wouldn't necessarily make sense the first time a user saw them.