Define Cupcake website page content structure

jeffchew commented 5 years ago

chsanche created the following on Sep 10:

User story:

As a Digital Design System website designer

I need to set standards for the website page content structure

so that I can make sure the content presented to the adoptor in a unified and easy to read format.

Additional information

The basic page structure from the Carbon team can be viewed here.
The "on-page navigation" is purposed by Scott and currently reviewed by the Carbon Team right now.

Deliverables

A document to show how the content structure looks like.

Acceptance criteria

[ ] Content structure is agreed by Wonil.
[ ] Content structure document is shared in the DDS team playback.

Original issue: https://github.ibm.com/webstandards/digital-design/issues/1670

jeffchew commented 5 years ago

On Sep 17, chsanche commented: @spbokma @Wonil-Suh1 This is the content template Jillian created for the Carbon Wedding Cake website.

Component Usage Template

The template is from the Carbon team and they will update their component pages with this template as well
We will craft our components page content based on the template. Not all the components will have every section of it, so we will remove or add as needed.

✏️ Full box doc can be viewed here

Template General guidance [Quick overview of what the component enables the user to do (purpose) and any high level UX best practices - answers the question "is this the right component to use?"]

Live demo [Live demo, including options for different variations]

Formatting [requirements and best practices for simple general anatomy - helps answer the question "how do I use it?"]

Behavior [interaction, states, and behavior requirements and best practices - helps answer the question "how do I use it?"]

Content [content requirements and best practices - helps answer the question "how do I use it?"]

Accessibility [simple anatomy and behavior requirements and best practices for accessibility]

Related components [comparison to similar components if they might be misused, as applicable]

Variations [Different variations of the component - reference specific formatting, behavior, and content guidelines as needed]

Theming

Specs

References [any outside resources or citation to support the reasoning or design decisions]

Feedback [some kind of feedback something like fabric, link to FAQ]

**rational is included as needed

jeffchew commented 5 years ago

On Sep 19, spbokma commented: @chsanche & @Wonil-Suh1, this is a good template to start with and to keep aligned to Carbon moving forward. We will not use all sections and add other sections, as we evaluate and create content for each page of the site.

Per our discussion, would it be easier/quicker to create and update the web pages with content as it available? Not design out all the pages, just a few to show the development team the structure, format and look we are wanting to achieve.

I did talk to Linda on 9/18/19 about this project needed a development resource to continue to move forward.

jeffchew commented 5 years ago

On Sep 19, chsanche commented: @spbokma Yes, it will be easier and quicker for us to create or update the website page without mocking up every page. Once we have the development resource, we can define the collaboration process better.

jeffchew commented 5 years ago

On Sep 19, linda-carotenuto commented: @Jeff-Chew per our discussion yesterday about development resource for the website, you feel this can be something our current team can handle. Correct?

jeffchew commented 5 years ago

On Sep 23, Jeff-Chew commented: @chsanche we're actually talking about that earlier today. What we're agreeing on is to have one of our developers do a work session with the designers on how to publish with Gatsby. I noted with Wonil and Linda that I'd like to avoid any custom development and use whatever is available OOTB from the Gatsby theme.

cc: @linda-carotenuto @Wonil-Suh1

jeffchew commented 5 years ago

On Sep 23, linda-carotenuto commented: Sounds like we have a content template, we have a writer, we have concluded that our resources will do the publishing without any add-ons to Gatsby. Sounds like we are ready to go!! What is first piece of content to be added?

jeffchew commented 5 years ago

On Sep 23, chsanche commented: @Jeff-Chew Learn how to publish with the Gatsby theme sounds good to me, as long as it's not crazy coding or complex development process.

Also, l agreed with you on we should avoid any custom development and use whatever is available from the Gatsby theme.

@linda-carotenuto Modal will be the first.

jeffchew commented 5 years ago

On Sep 25, chsanche commented: I reached out to Connor on the Carbon Team and he shared the content template for Patterns with me today. It's saved in our Cupcake website content older and ready for us.

Patterns Usage Template

Component Usage Template

The template is from the Carbon team and they will update their pattern pages with this template as well.
We will craft our patterns page content based on the template. Not all the components will have every section of it, so we will remove or add as needed.

✏️ Full box doc can be viewed here

carbon-design-system / carbon-for-ibm-dotcom