@dwyl Component Guide in Tachyons? #UXQuest

[nelsonic]

Why?

All Client Projects & dwyl Products (for the next couple of years) will be using the "PETE" Stack.

We need to make it easy for people to ship as consistently, quickly and painlessly as possible. To aid that we need a Component Guide with detailed examples people can "copy-paste" from.

What?

A Component Guide people can use to build/ship their apps fast.

Something similar to:

• http://getbootstrap.com/components
• http://materializecss.com
• http://foundation.zurb.com
• http://designmodo.github.io/Flat-UI

Note: While I'm still a huge fan of the simplicity of "Flat UI" http://designmodo.github.io/Flat-UI I gave up on the idea of using Flat UI because we ended up "over riding" too much. But if we could re-implement it in Tachyons with detailed examples it would be great! e.g: #8

How?

Initially the idea is for a week of Tachyons "Apprenticing" where the outcome is:

• Component Guide for @dwyl projects that can be easily adapted/customised for Client needs.
  e.g: https://ui.dwyl.com
• Tutorial Blog Post for how you made it. (and learned tachyons in the process)
• Video ScreenCast / Workshop to teach the UI framework to other people (to be tested on F&C peeps and .then taught to NHS/MWV/SL etc.) Note: I know recording videos may end up taking us over our 1-Week initial estimate, but we will break down the tasks a lot further.

This will be the first "project" our "Full Time UX person will undertake.
@harrygfox / @nogainbar let us know your thoughts & discuss!!

TBD...

We need to discuss/decide:

• Which UI Framework we are going to draw inspiration from? (see list above)
• Who has availability/interest to embark on this quest?
• What else do you want/need to know before we can get cracking on this?

And Then...?

Longer-term we could help @mrmrs & Co with their "WYSIWYG" UI builder which we can then use to rapid-prototype with Clients and Products. But let's not get ahead of ourselves just yet.

CC: @markwilliamfirth / @iteles this is highly relevant to Product.

[nogainbar]

@nelsonic this sound fantastic!!!

I think its a very sustainable way for everyone to go about... for you as a team as well for your clients.

In terms of the design of the components, I will have a look at your suggestions but would like to say that I personally really like the "power of 2" system that Tachyons itself adopt- no "magic design numbers" means that there is a mathematical thought behind the Tachyon ecosystem- that is why its mostly pleasing to the eye :)

But obv, there is work that can be done using DWYL's brand guidelines to customize it and create DWYL's unique ecosystem..

Would be very glad to contribute and perhaps pair with @harrygfox and help :)

[harrygfox]

Sounds like it could be a lot of fun! 🔬 👩‍🔬

[nelsonic]

@harrygfox + @nogainbar when do you have availability to discuss/start?

[iteles]

@nelsonic: @Cleop is already coming up with a suggested implementation based on her experience with HL and LDMW.
@harrygfox and @Cleop are both in tomorrow so might be good to get together in the afternoon!

[Cleop]

@nelsonic @harrygfox I'd love to share with you my experiences so far. Let's discuss this afternoon! Exciting stuff!

[nelsonic]

@Cleop sweeeet! 🍭
What time this afternoon? 📆
My calendar is reasonably free from 14:00 to 17:00
see: https://calendar.google.com/calendar/embed?src=nelson%40dwyl.io
I have a couple of things Todo: https://github.com/issues?utf8=✓&q=is%3Aopen+is%3Aissue+assignee%3Anelsonic+label%3Apriority-1++label%3Ain-progress+ but can easily work around you & @harrygfox's schedule. 👍

[tonydaly]

I'm not entirely impartial, but think the Lost My Name design system is pretty sweet: http://design-system.lostmy.name/

Just remembered as they just did a blog post on it: https://medium.com/making-lost-my-name/benefits-of-a-connected-design-system-608199816f00

[nelsonic]

@tonydaly that it's a fantastic page and corresponding post! 😍 (thanks for sharing!)
@Cleop I think we may need to be "inspired" by how they are displaying the code example ...

[tonydaly]

Also here's Clearleft's take on component libraries:

• https://clearleft.com/posts/382
• http://fractal.clearleft.com/components/detail/intro.html