CDKit: App Stores Design Automation

CDKit is a DevOps framework that helps to deploy mobile apps (iOS and Android) to the app stores (iTunes and Google Play).

This tool create the App Store and Google Play screenshots with different themes and devices and it includes:

iOS and Android screenshots
Support for phones and tablets formats
Support for child themes
A HTML preview for all the screenshots generated with a magnifier!
Easy integration on CI/CD pipelines

Quick video

Getting started

Configure your screens

Create a folder with your app bundle ID (ex. com.company.app):

mkdir app/com.company.app

Create a screens.json (see template below) and add configure each title, subtitle and source filename.

Example of a /app/{bundle ID}/screens.json

[{
    "title": "Pipelines list",
    "subtitle": "Take care of your pipelines.",
    "screenshot": "pipelineList.png"
  },
  {
    "title": "Pipeline history",
    "subtitle": "Get the history of your pipelines.",
    "screenshot": "pipelineHistoryList.png"
  },
  {
    "title": "Console",
    "subtitle": "See why your build failed.",
    "screenshot": "consoleLog.png"
  },
  {
    "title": "Agents list",
    "subtitle": "Take a look at your Go Agents.",
    "screenshot": "agentList.png"
  },
  {
    "title": "Agents details",
    "subtitle": "Go Agent details and last jobs.",
    "screenshot": "agentDetails.png"
  },
  {
    "title": "Environments",
    "subtitle": "Pipelines, agents and variables.",
    "screenshot": "environmentDetails.png"
  },
  {
    "title": "Settings",
    "subtitle": "Configure the way you use the app.",
    "screenshot": "settings.png"
  },
  {
    "title": "Login",
    "subtitle": "Login to your GO.CD server.",
    "screenshot": "login.png"
  }
]

Create a child theme

It's optional, but probably the default colors of the theme will not be the same as your design :)

You can create a child theme based on a theme to customize the colors, font and more!

See the Themes section to create your child theme.

Run the CLI

node src/cli.js --app {bundle ID} --platform {android|ios} --screenshots {path to your device screenshots}

Example:

node src/cli.js --app com.company.app --platform ios --screenshots ~/screenshots

Themes

List of themes

For this early version, there is only one theme: default.

Default

This theme allow you to customize:

device mockup (all available)
font file
background color
title color
title font size
subtitle color
subtitle font size

Create a child theme for your app

You can overwrite a theme for an app by changing the default values (font name, colors, background color, etc.).

To do that, you need to look at the theme configuration (theme.json under the folder /src/layouts/themes/{theme name}/) and add the value(s) that you want to customize.

Your theme will overwrite the defaults values of the theme that your app is using.

Example of a /app/{bundle ID}/theme.json

{
  "theme": "default",
  "backgroundColor": "#86569A",
  "font": "HelveticaNeueLight.ttf",
  "title": {
    "color": "#FFFFFF"
  },
  "subtitle": {
    "color": "#C2AACC"
  }
}

Device mockups

Available

iOS

Android

TODO

Add multi-languages support
Add more recent devices
Create more themes
Generate the HTML preview instead of using a static HTML file (needed for multi-languages support)
Extend the CLI with a wizard to create a new app (bundleID, theme to use, number of screenshots, etc.)

timoa / cdkit.appstore.design Goto Github PK

cdkit.appstore.design's Introduction

CDKit: App Stores Design Automation

Quick video

Getting started

Configure your screens

Create a child theme

Run the CLI

Themes

List of themes

Default

Create a child theme for your app

Device mockups

Available

iOS

Android

TODO

cdkit.appstore.design's People

Contributors

Stargazers

Watchers

Forkers

cdkit.appstore.design's Issues

Repository problems

Pending Approval

Awaiting Schedule

Pending Status Checks

Open

Detected dependencies

Recommend Projects

Recommend Topics

Recommend Org