storycopter / storycopter-app Goto Github PK

• data schema
• interactions
• icon font
• breadcrumbs
• breadcrumb tooltips
• prev / next
• hamburger
• take action
• share

• https://jamie.build/styled-theming.html
• https://github.com/styled-components/styled-theming

• allow for 2 columns to start with
• define schema
• accompanying controls
• allow for full-width variation

• define media types supported
• ui components
• data schema
• accompanying controls
• size variations
• …

• data schema
• responsiveness
• first chapter variation
• last chapter variation
• allow for background image w/ blend mode?

• nav anchor variation
• headline building block
• allow for background image
• data schema
• allow for animations
• editable variations
• accompanying controls
• s, m, l variations

• define variations
• data schema
• accompanying controls
• editing capabilities for links, italic, bold?

Replace Catalog w/ Storybook.

• localstorage not

• define media types supported
• ui components
• data schema
• accompanying controls
• …

• image block w/ and w/o caption
• size variations
• data schema
• accompanying controls

• building block
• data schema
• s, m, l size support
• accompanying controls

Steps to reproduce:

In sound experience settings

1. enable soundtrack
2. play media
3. pause media
4. disable soundtrack
5. move focus to another app window
6. hit keyboard media Play key

Result:

Audio restarts playing while it should not.

• credits icon
• volume icon
• full-screen toggle icons

• define supported video and audio formats
• create sample ffmpeg conversion processes w/ support for error/success/loading states

• size variations
• data schema
• accompanying controls
• …

Please check packages/idoc/src/chapters and packages/idoc/src/essentials for naming conventions and folder structure.

When opening a project folder we need:

• ability to read children json files as data
• ability to write over children json data files from within the app

Also… we don’t need to be running any Gatsby tasks till Preview or Export being triggered from the app.

Would be nice to have a preloader and some nice page transitions when navigating between the pages.

• data schema
• media support
• playback/volume change interactions
• …

page inspector controls

• page details
• list components
• rearrange components
• target components to element inspector (also w/ scrollTo)

update document inspector controls

• new color pickers
• plug in motivation controls
• plug in meta data for helmet
• plug in typography controls and brand color controls
• plug in story cover controls
• plug in story logo controls
• plug in story favicon controls
• plug in story sound controls
• plug in headline backgImage controls

misc

• don’t show page avatar image if cover disabled for that particular page
• fix broken gatsby image reference backgImage: { name: 'xyz' } for headlines, ecc.
• last round of tests for all image assets so far

• simple video/audio transcript player block
• allow for background image when playing audio
• define acceptable media formats
• define data schema
• accompanying controls

• themeable variations
• data schema
• reponsiveness
• micro interactions: hovers/active
• abstract anilink/button component variation?

• Topbar
• Shortcuts

As a developer I want to be able to build and package the app:

• mac
• windows

Ideally one command to launch electron chrome and app dev server:

• electron dev env set-up
• cra or gatsby

• Meta information panel
• Brand experience panel
• Sound experience panel
• Motivation panel

• top controls
• bottom controls

We want to be able to switch between document pages

• it’s not ideal how the components responds to all different breakpoints
• hover/active interactions on the items need tweaking
• …

• rewrite headline component
• load the component in the app, idoc
• make an editable variation of the component
• allow for changing properties of the component in the app
• allow for changing inspector properties of the component in the app

• allow for loading ui/ things from within gatsby-default-tpl
• allow for styleguide imports from within Gatsby
• set up MUI theme provider
• set up styleguide infra

Set up material-ui w/ basic custom theme and styled-components infra.

We need an easy to manage and nicely abstracted theming for the idoc:

1. review:

• use of ${color.xyz} -> port to a theme provider where possible
• font sizes ${setType.xyz}
• roundness
• animation times
• …

2. abstract

• colors
• font-families
• features such as borders, underlines, ecc…

• blockquote component
• size variations
• allow for audio to be played
• accompanying controls
• data schema

• data schema
• interactions
• responsiveness
• …

• juxtapose block
• small, medium, full-screen variations
• accompanying controls

• blend modes
• full-size only
• data schema
• responsiveness
• …

• copy block
• test against s, m, l variations
• accompanying controls for bold, italic, link, ecc…

• data schema
• responsiveness
• interaction

• page transitions
• headline elements

We need a way to assemble pages out of a json file containing list of components with their props and order.

• idoc
• styleguide
• app
• site
• ui