Building a New Prose

Blog

Estimated
3 min read

For many of the sites we build Jekyll is a prominent tool we use to build dynamic sites served by static pages. When we launched Prose last year, we set out to build a lightweight editor to create and manage Jekyll sites hosted on GitHub. We open sourced Prose, and the response from the GitHub community was overwhelming. Prose is a project with over 900 followers, and many actively use it each day.

Along with the relaunch of Healthcare.gov in June, we will dedicate time to improving the user experience and reliability of Prose, as well as adding new features.

This new version will also establish a clear direction to move forward — to make Prose a great interface for authoring content. We will focus Prose entirely on writing Markdown based documents, streamlining the interface for content creators.

A New Interface

As part of envisioning a new version of Prose, we have started on wireframes. You can view the entire set on Flickr, and below are an early look at key screens.

Authenticated Landing Page

aabbf7b9db2e  0Ae4puAQZ9 xsuf q

For logged in users, the landing page features a filterable directory of projects per organization.

Project Page Settings

aabbf7b9db2e  0yJFm6qUS2r 2 DNS

The project settings panel controls page deletion, publishes modes, and sets front matter values in clean form fields populated by a project schema.

Project Page Settings Prototype

aabbf7b9db2e  0IzJisWh FOFIuHQ6

Here’s a more detailed version of the page settings panel with vertical navigation.

These wires should represent an interface that has a good balance between users belonging to many projects and organizations or just one. Filenames and directories should be quickly scannable and filterable through autocomplete search. Filenames can be long and there can be many per directory. The interface should scale to accommodate volume and have subtle styled queues when content would otherwise overflow. The main navigation in the wires is presented in a vertical format and split into page level sections. It scales depending on the context of the page:

Main Navigation

  • Authenticated Landing

Project Navigation

  • Project Page

  • Create New File

Page Navigation

  • Editing

  • Preview

  • Media/Assets

  • Page Settings

New features

Prose already provides the ability to specify configurable options in _config.yml

`auto: true
server: true
prose:
    rooturl: '_posts'
    metadata:
        - name: layout
          field:
            element: select
            defaultText: 'Select a Layout'
            options:
              - value: default
              - value: page`

We want to expand on this by providing developers a way to specify a project schema in YAML that props up a sandboxed world of a site, free of system files. A metadata schema provides helpful defaults to YAML front matter, specifies an element type, and lists out values available to the site. Other ideas include specifying an assets directory for images or media.

We will also enhance the editing interface overall, including improving markup formatting and building out a simple mechanism to drop in images or media into a page.

Stay tuned. Work will begin in the master branch of Prose on GitHub — watch there for new development.

Prose users: Let us know your thoughts over on GitHub

What we're doing.

Latest