pugpig for continuous publishing app design guide · 2014-06-17 · your feeback and queries to...

8
Pugpig for Continuous Publishing App Design Guide

Upload: others

Post on 25-Jun-2020

3 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

Pugpig for ContinuousPublishingApp Design Guide

Page 2: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

APP SPLASH SCREENIN BACKGROUND

@”PrimaryButton for retry button and download progress fill

@Picker.EditionStatusLabel.TextColor@Picker.EditionStatusLabel.Font

@”Picker. in PLIST Keys

Checking for new content...Downloading new content...

Initial app splash screen displays before any content has been downloaded.

Content status messages fade in and display at the bottom with a download progress bar.

All copy can be edited using Localizable

Strings

Page 3: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

<inserts page title, author, summary, section>

Loading...

(displays a spinner icon)

Once the atom file has been downloaded the app will enter the edition and display a page loading screen until the page content is downloaded.

Native toolbar may be visible in this state.

WhiteBackground

Color by default.

Page 4: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

9.43 PMiPad

PAGE TITLE / SLUG/ SECTION OR LOGO ETC

IconsSecondary

Color by default. Custom colour or

icon can be applied.

Toolbar Color & Toolbar

Visibility to determine behaviour

Can displaySection, Page Title

or optional Logo (based on edition

feed)

@”Document. in PLIST Keys

@”Document.IconColor”

@”Document.Toolbar.

Native toolbar and HTML Page (first page of the single edition/app), usually a contents or section highlights page.

In config.plist:

ToolbarVisibility: option of auto (vanishes when one scrolls down and reappears when flicking back up; it can also be toggled by bouncing the content at the top or double-tapping),

autoTop (like auto but is always visible at the top) and always, permanently display at top at all times.

Pane Model: Depending on your content, you can pick scrolling, horizontal or vertical.

Note: ToolbarColor is rendered semi-transparent on iOS 7

Page 5: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

9.43 PMiPad

BRAND NAME OR LOGO

Cover

Contents

Features

Anna Friel

Jenni Kayne

Feature

Day dreams

News

The Inside Story

Panorama

The world in pictures

Cinematters

Fashion

Main Fashion

Get the look

Beauty

Spring Colours

Get the look

Wellbeing

Decor

Regulars

Horoscopes

Subscribers

PrimaryColor or

custom

SecondaryBackgroundColor or

custom

Auto set black or white by

default. Line seperators can be

applied with different section and article

thickness.

PrimaryBackgroundColor or

custom

PAGE TITLE / SLUG/ SECTION ETC

Native Table of Contents opens on left-hand side, and moves the page view and toolbar across.

What displays in the Table of Contents can be configured by your edition feed. Options include

filtering to just show sections only.

In config.plist:

ToolbarVisibility: option of auto (vanishes when one scrolls down and reappears when flicking back up; it can also be

toggled by bouncing the content at the top or double-tapping), autoTop (like auto but is always visible at the top)

and always, permanently display at top at all times.Pane Model: Depending on your content, you can pick scrolling,

Last refresh status...

Page 6: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

9.43 PMiPad

PAGE TITLE / SLUG/ SECTION OR LOGO ETC

Native toolbar and HTML Page. When thumbnail icon is toggled on, page thumbnails will display along the bottom.

PAGE THUMBHERE

PAGE THUMBHERE

PAGE THUMBHERE

PAGE THUMBHERE

PAGE THUMBHERE

Page 7: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

BRAND NAME

Cover

Contents

Features

The Inside Story

Panorama

SettingsGeneral

Help

About

Text Resize

A A A FeedbackAlthough we appreciate and monitor app store reviews, we cannot re-spond directly to them. Please send your feeback and queries to [email protected].

Version 1.0 (1.0)

iPadiPadiPad 9.43 PM

All copy can be edited using Localizable Strings.All fonts across these pages can be custom Brand fonts.

The same colour way is used on both Settings and Account screens.

Custom fonts can be applied.

Auto set black or white by default.

@”Settings. in PLIST Keys

Selection Background

Color by default or custom colourcan be applied.

@”Settings.BackgroundColor”@”Settings.SelectionBackgroundColor”@”Settings.TextColor”@”Settings.SelectionTextColor”@”Settings.LinkTextColor”@”Settings.IconColor”

@”Settings.Title.@”Settings.Header.@”Settings.Menu.@”Settings.TextField.@”Settings.Toolbar.@”Settings.SegmentedControl.

PAGE TITLE / SLUG/ SECTION ETC Last refresh status...

Page 8: Pugpig for Continuous Publishing App Design Guide · 2014-06-17 · your feeback and queries to feed-back@yourdomain.com. Version 1.0 (1.0) iPad 9.43 PM All copy can be edited using

iPadiPadiPad 9.43 PM

AccountExisiting Subscription

App Store Purchases

Already a subscriber

Existing subscribers can get access to the Publications App by signing in with their surename and password.

Username

Password

Log in

Need help?For more information on how to ac-cess Pugpig For Magazines on your device visit: http://www.pugpig.com.

All copy can be edited using Localizable Strings.All fonts across these pages can be custom Brand fonts.

The same colour way is used on both Settings and Account screens.

@”Settings. in PLIST Keys

@”Settings.SubscribeButton.@”Settings.LoginButton.@”Settings.RestoreButton.@”Settings.TextField.

BRAND NAME

Cover

Contents

Features

The Inside Story

Panorama

PAGE TITLE / SLUG/ SECTION ETC Last refresh status...