Skip to content

Latest commit

 

History

History
83 lines (56 loc) · 2.96 KB

scoping-library-template.md

File metadata and controls

83 lines (56 loc) · 2.96 KB
Raw
description
Use this page to fill out an item in the scoping catalog

Scoping Library Template

{% hint style="info" %} INTRODUCTION: Explain the basics of the component, and explain any variations to that component. {% endhint %}

A Promo component image at the top (or to the side) with the rich-text below or alongside, while a Promo Card is a full-width image with the rich-text overlaid (right or left align).

Functional Specifications

{% hint style="info" %} FUNCTIONAL SPECS: What does this component provide. What does a developer need to know to make it work? {% endhint %}

The promo features:

  • Image (image size/dimensions to be determined in design and followed via editorial tip)
  • Editorial (rich-text) area

The editorial area allows for headings and links to be dropped in freely according to editorial standards. Layout (add as necessary to scope):

a) Image on top with editorial below

b) Image to the left/right with editorial to the opposite side

c) Image full-width with editorial overlaid (and aligned to right or left)

Additional Functionality

{% hint style="info" %} ADDED FUNCTIONALITY: Add this as necessary for one-offs or other occasional extras, to be integrated into the scope as necessary. {% endhint %}

Some projects may want more specialized and structured versions of these, and so this scope will need to be modified to allow for those as dictated by wireframes / design.

Content Model

{% hint style="info" %} CONTENT MODEL: List all potential fields in component, and include fields that tie to the additional functionality as necessary. {% endhint %}

  • Standard fields
    • Image upload
    • Editorial (rich-text) field
  • Additional fields
    • Additional field 1
    • Additional field 2

Estimate Hours

{% hint style="info" %} ESTIMATE: Insert the number of front-end and back-end estimate hours {% endhint %}

Build Plan

{% hint style="info" %} BUILD PLAN: If a build plan is known, add this to the ticket {% endhint %}

Example

{% hint style="info" %} EXAMPLE BLOCK: Add an example of the block (visual or wireframe) {% endhint %}

In a live scoping scenario, this component will be filled out with the actual element within the wireframe.

Testing Scenario

{% hint style="info" %} SCENARIO LIST: Add the full scope testing required to confirm that this component or page is working correctly. This will be integrated into initial ticket. {% endhint %}

  1. Image appears with the correct proportions as dictated by the block
  2. Alt text appears correctly, pulled from the asset manager (for image upload) or as assigned in the rich-text editor.
  3. Rich-text content appears correctly, along with heading levels
  4. Links are styled and work correctly
  5. Image upload field includes recommended size, as dictated by design