[
  {
    "path": ".editorconfig",
    "content": "# editorconfig.org\nroot = true\n\n[*]\nindent_style = space\nindent_size = 2\nend_of_line = lf\ncharset = utf-8\ntrim_trailing_whitespace = true\ninsert_final_newline = true\n\n[*.md]\ntrim_trailing_whitespace = false\n"
  },
  {
    "path": ".gitattributes",
    "content": "src/assets/javascripts/plugins/* linguist-vendored\nsrc/assets/javascripts/vendor/* linguist-vendored\nsrc/assets/stylesheets/vendor/* linguist-vendored\n"
  },
  {
    "path": ".gitignore",
    "content": "_asset_bundler_cache\n_site\n.asset-cache\n.bundle\n.DS_Store\n.jekyll-cache\n.jekyll-metadata\n.sass-cache\n.tmp\n*.sublime-project\n*.sublime-workspace\ncodekit-config.json\ndist\nnode_modules\nnpm-debug.log*\nrsync-credentials.json\ntmp\n"
  },
  {
    "path": ".gitmodules",
    "content": "[submodule \"images\"]\n\tpath = src/assets/images\n\turl = https://github.com/mmistakes/made-mistakes-images.git\n"
  },
  {
    "path": ".scss-lint.yml",
    "content": "# Default application configuration that all configurations inherit from.\n\nscss_files: \"src/assets/stylesheets/**/*.scss\"\nexclude:\n  - \"src/assets/stylesheets/_reset.scss\"\n  - \"src/assets/stylesheets/vendor/**\"\nplugin_directories: ['.scss-linters']\n\n# List of gem names to load custom linters from (make sure they are already\n# installed)\nplugin_gems: []\n\n# Default severity of all linters.\nseverity: warning\n\nlinters:\n  BangFormat:\n    enabled: true\n    space_before_bang: true\n    space_after_bang: false\n\n  BemDepth:\n    enabled: false\n    max_elements: 1\n\n  BorderZero:\n    enabled: false\n    convention: zero # or `none`\n\n  ChainedClasses:\n    enabled: false\n\n  ColorKeyword:\n    enabled: true\n\n  ColorVariable:\n    enabled: false\n\n  Comment:\n    enabled: false\n    style: silent\n\n  DebugStatement:\n    enabled: true\n\n  DeclarationOrder:\n    enabled: true\n\n  DisableLinterReason:\n    enabled: false\n\n  DuplicateProperty:\n    enabled: true\n\n  ElsePlacement:\n    enabled: true\n    style: same_line # or 'new_line'\n\n  EmptyLineBetweenBlocks:\n    enabled: true\n    ignore_single_line_blocks: true\n\n  EmptyRule:\n    enabled: true\n\n  ExtendDirective:\n    enabled: false\n\n  FinalNewline:\n    enabled: true\n    present: true\n\n  HexLength:\n    enabled: true\n    style: short # or 'long'\n\n  HexNotation:\n    enabled: true\n    style: lowercase # or 'uppercase'\n\n  HexValidation:\n    enabled: true\n\n  IdSelector:\n    enabled: true\n\n  ImportantRule:\n    enabled: false\n\n  ImportPath:\n    enabled: true\n    leading_underscore: false\n    filename_extension: false\n\n  Indentation:\n    enabled: true\n    allow_non_nested_indentation: false\n    character: space # or 'tab'\n    width: 2\n\n  LeadingZero:\n    enabled: true\n    style: include_zero # or 'exclude_zero'\n\n  MergeableSelector:\n    enabled: true\n    force_nesting: true\n\n  NameFormat:\n    enabled: true\n    allow_leading_underscore: true\n    convention: hyphenated_lowercase # or 'camel_case', or 'snake_case', or a regex pattern\n\n  NestingDepth:\n    enabled: false\n    max_depth: 3\n    ignore_parent_selectors: false\n\n  PlaceholderInExtend:\n    enabled: true\n\n  PrivateNamingConvention:\n    enabled: false\n    prefix: _\n\n  PropertyCount:\n    enabled: false\n    include_nested: false\n    max_properties: 10\n\n  PropertySortOrder:\n    enabled: true\n    # order: smacss\n    ignore_unspecified: true\n    min_properties: 2\n    separate_groups: false\n\n  PropertySpelling:\n    enabled: true\n    extra_properties: []\n    disabled_properties: []\n\n  PropertyUnits:\n    enabled: true\n    global: [\n      'ch', 'em', 'ex', 'rem',                 # Font-relative lengths\n      'cm', 'in', 'mm', 'pc', 'pt', 'px', 'q', # Absolute lengths\n      'vh', 'vw', 'vmin', 'vmax',              # Viewport-percentage lengths\n      'deg', 'grad', 'rad', 'turn',            # Angle\n      'ms', 's',                               # Duration\n      'Hz', 'kHz',                             # Frequency\n      'dpi', 'dpcm', 'dppx',                   # Resolution\n      '%']                                     # Other\n    properties: {}\n\n  PseudoElement:\n    enabled: true\n\n  QualifyingElement:\n    enabled: false\n    allow_element_with_attribute: true\n    allow_element_with_class: false\n    allow_element_with_id: false\n\n  SelectorDepth:\n    enabled: false\n    max_depth: 3\n\n  SelectorFormat:\n    enabled: true\n    convention: hyphenated_lowercase # or 'strict_BEM', or 'hyphenated_BEM', or 'snake_case', or 'camel_case', or a regex pattern\n\n  Shorthand:\n    enabled: true\n    allowed_shorthands: [1, 2, 3, 4]\n\n  SingleLinePerProperty:\n    enabled: true\n    allow_single_line_rule_sets: true\n\n  SingleLinePerSelector:\n    enabled: true\n\n  SpaceAfterComma:\n    enabled: true\n    style: one_space # or 'no_space', or 'at_least_one_space'\n\n  SpaceAfterComment:\n    enabled: false\n    style: one_space # or 'no_space', or 'at_least_one_space'\n    allow_empty_comments: true\n\n  SpaceAfterPropertyColon:\n    enabled: true\n    style: one_space # or 'no_space', or 'at_least_one_space', or 'aligned'\n\n  SpaceAfterPropertyName:\n    enabled: true\n\n  SpaceAfterVariableColon:\n    enabled: true\n    style: one_space # or 'no_space', 'at_least_one_space' or 'one_space_or_newline'\n\n  SpaceAfterVariableName:\n    enabled: true\n\n  SpaceAroundOperator:\n    enabled: true\n    style: one_space # or 'at_least_one_space', or 'no_space'\n\n  SpaceBeforeBrace:\n    enabled: true\n    style: space # or 'new_line'\n    allow_single_line_padding: false\n\n  SpaceBetweenParens:\n    enabled: true\n    spaces: 0\n\n  StringQuotes:\n    enabled: true\n    style: single_quotes # or double_quotes\n\n  TrailingSemicolon:\n    enabled: true\n\n  TrailingWhitespace:\n    enabled: true\n\n  TrailingZero:\n    enabled: false\n\n  TransitionAll:\n    enabled: false\n\n  UnnecessaryMantissa:\n    enabled: true\n\n  UnnecessaryParentReference:\n    enabled: true\n\n  UrlFormat:\n    enabled: true\n\n  UrlQuotes:\n    enabled: true\n\n  VariableForProperty:\n    enabled: false\n    properties: []\n\n  VendorPrefix:\n    enabled: false\n    identifier_list: base\n    additional_identifiers: []\n    excluded_identifiers: []\n\n  ZeroUnit:\n    enabled: true\n\n  Compass::*:\n    enabled: false\n"
  },
  {
    "path": ".snyk",
    "content": "# Snyk (https://snyk.io) policy file, patches or ignores known vulnerabilities.\nversion: v1.13.5\nignore: {}\n# patches apply the minimum changes required to fix a vulnerability\npatch:\n  SNYK-JS-AXIOS-174505:\n    - browser-sync > localtunnel > axios:\n        patched: '2019-05-30T14:05:47.800Z'\n  SNYK-JS-LODASH-450202:\n    - snyk > inquirer > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - rev-del > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - gulp-uglify > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - gulp-responsive > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - critical > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > snyk-nuget-plugin > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - browser-sync > easy-extender > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - node-sass > sass-graph > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - critical > filter-css > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - critical > cheerio > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > snyk-php-plugin > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > @snyk/dep-graph > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > snyk-config > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > snyk-mvn-plugin > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > snyk-nodejs-lockfile-parser > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > snyk-go-plugin > graphlib > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - node-sass > gaze > globule > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > @snyk/dep-graph > graphlib > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - gulp-sass > node-sass > sass-graph > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - snyk > snyk-nodejs-lockfile-parser > graphlib > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - gulp-sass > node-sass > gaze > globule > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - critical > postcss-image-inliner > request > form-data > async > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n    - critical > postcss-image-inliner > asset-resolver > request > form-data > async > lodash:\n        patched: '2019-07-04T05:09:22.472Z'\n"
  },
  {
    "path": ".vscode/settings.json",
    "content": "{\n  \"cSpell.enabledLanguageIds\": [\n    \"c\",\n    \"cpp\",\n    \"csharp\",\n    \"go\",\n    \"handlebars\",\n    \"javascriptreact\",\n    \"json\",\n    \"latex\",\n    \"markdown\",\n    \"php\",\n    \"plaintext\",\n    \"python\",\n    \"restructuredtext\",\n    \"text\",\n    \"typescript\",\n    \"typescriptreact\",\n    \"yml\"\n  ],\n  \"search.usePCRE2\": true\n}"
  },
  {
    "path": "Gemfile",
    "content": "# Made Mistakes Gemfile\nsource 'https://rubygems.org'\n\ngem 'breakpoint'\ngem 'html-proofer'\ngem 'rake'\n# Windows does not include zoneinfo files, so bundle the tzinfo-data gem\ngem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]\n# Performance-booster for watching directories on Windows\ngem 'wdm', '~> 0.1.1', :install_if => Gem.win_platform?\n\n# Jekyll\ngem 'jekyll'\ngem 'liquid-c'\ngroup :jekyll_plugins do\n  gem 'jekyll-sitemap'\n  gem 'jemoji', '>= 0.10.2'\n  gem 'jekyll-seo-tag'\n  gem 'jekyll-paginate-v2', '~> 2.0.0'\n  gem 'jekyll-typogrify'\n  gem 'jekyll-figure'\n  gem 'jekyll-algolia', '>= 1.4.7'\n  gem 'jekyll-tagging-related_posts'\n  gem 'jekyll-include-cache'\n  gem 'jekyll-toc', '>= 0.9.0'\nend\n"
  },
  {
    "path": "LICENSE",
    "content": "The MIT License (MIT)\n\nCopyright (c) 2004-2019 Michael Rose\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
  },
  {
    "path": "README.md",
    "content": "# [Made Mistakes](https://mademistakes.com) Source Code\n\nThis is the source code of Made Mistakes, a personal blog and portfolio built \nwith [Jekyll](http://jekyllrb.com) [Gulp](http://gulpjs.com/), and \n[Netlify](https://www.netlify.com/).\n\n*Please note: Made Mistakes hasn't been \"themed\" like some of my other \n[Jekyll repos](https://mademistakes.com/work/jekyll-themes/) and isn't compatible \nwith the \"default\" GitHub Pages workflow without substantial alterations.*\n\n### Plugins used\n\n- [Jekyll Sitemap](https://github.com/jekyll/jekyll-sitemap) (GitHub Pages supported)\n- [Jemoji](https://github.com/jekyll/jemoji)\n- [Jekyll Paginate v2](https://github.com/sverrirs/jekyll-paginate-v2)\n- [Jekyll TOC](https://github.com/toshimaru/jekyll-toc)\n\n### Images\n\n[Made Mistakes](https://mademistakes.com) has a lot of image assets. \n`src/assets/images/` has been split into its [own repo](https://github.com/mmistakes/made-mistakes-images) and included as a Git submodule.\n\n`page.image.feature` should be placed in `src/assets/images/feature`. These \n`feature` images will be converted into various sizes to be responsively served \nby browsers that support the [`srcset` attribute](https://responsiveimages.org/).\n\n### Content helpers\n\n#### Notices\n\nCall-out text. Accepts the following types: `info`, `danger`, `warning`, and `success`. See [style guide](https://mademistakes.com/style-guide/) for visual examples.\n\n**Default notice example:**\n\n```liquid\n{% notice %}\nCall out some text. **Markdown** is acceptable.\n{% endnotice %}\n```\n\n**Danger notice example:**\n\n```liquid\n{% notice danger %}\n**Danger! Danger!** Use caution.\n{% endnotice %}\n```\n\n#### Figure\n\nEasily generate `figure` elements with optional `caption` and `class` parameters.\n\n**Examples:**\n\nIn simplest usage:\n\n```liquid\n{% figure %}\n![Image](/path/to/image.jpg)\n{% endfigure %}\n```\n\n```html\n<figure>\n  <img src=\"/path/to/image.jpg\" alt=\"Image\" />\n</figure>\n```\n\nIf a figure contains an image (or multiple images), the surrounding `<p>` will be stripped:\n\n```liquid\n{% figure %}\n![Image](/path/to/image.jpg)\n{% endfigure %}\n```\n\n```html\n<figure>\n  <img src=\"/path/to/image.jpg\" alt=\"Image\" />\n</figure>\n```\n\nYou can provide a caption. Any markdown will be rendered:\n\n```liquid\n{% figure caption:\"*Markdown* caption\" %}\n![Image](/path/to/image.jpg)\n{% endfigure %}\n```\n\n```html\n<figure>\n  <img src=\"/path/to/image.jpg\" alt=\"Image\" />\n  <figcaption><em>Markdown</em> caption</figcaption>\n</figure>\n```\n\nYou can also provide a class name(es) for CSS styling:\n\n```liquid\n{% figure caption:\"A caption\" class:\"classname\" %}\n![Image](/path/to/image.jpg)\n{% endfigure %}\n```\n\n```html\n<figure class=\"classname\">\n  <img src=\"/path/to/image.jpg\" alt=\"Image\" />\n  <figcaption>A caption</figcaption>\n</figure>\n```\n\nFinally, the caption parameter will accept liquid output markup:\n\n```liquid\n{% figure caption:\"{{ page.title }}\" %}\n![Image](/path/to/image.jpg)\n{% endfigure %}\n```\n\n```html\n<figure>\n  <img src=\"/path/to/image.jpg\" alt=\"Image\" />\n  <figcaption>The title of my post</figcaption>\n</figure>\n```\n\n#### Lazyload\n\nLazyload images using [**lazysizes**](https://github.com/aFarkas/lazysizes) \nuntil they're actually needed for improved page performance.\n\n| Attribute  | Required     | Description                                                                                                                                             |\n|------------|--------------|---------------------------------------------------------------------------------------------------------------------------------------------------------|\n| `data-src` | **Required** | Full path to image eg: `/assets/images/filename.jpg`. Use absolute URLS for those hosted externally.                                                    |\n| `src`      | Optional     | Full path to low-quality image eg: `/assets/images/filename.jpg`. Use absolute URLS for those hosted externally. Defaults to inline transparent `.gif`. |\n| `alt`      | Optional     | Image alternate text.                                                                                                                                   |\n\n**Example:**\n\n```liquid\n{% lazyload data-src=\"/assets/images/my-image.jpg\" src=\"/assets/images/my-image-low-quality.jpg\" alt=\"my lazyloaded image\" %}\n```\n\n#### Responsive video embed\n\nEmbed a video from YouTube or Vimeo that responsively sizes to fit the width of \nits parent using [`/_plugins/video_embed.rb`](src/_plugins.video_embed.rb).\n\n##### YouTube\n\nTo embed the following YouTube video at url `https://www.youtube.com/watch?v=XsxDH4HcOWA` \n(long version) or `https://youtu.be/XsxDH4HcOWA` (short version) into a post or \npage's main content you'd use: \n\n```liquid\n{% youtube XsxDH4HcOWA %}\n```\n\n##### Vimeo\n\nTo embed the following Vimeo video at url `https://vimeo.com/97649261` into a \npost or page's main content you'd use: \n\n```liquid\n{% vimeo 97649261 %}\n```\n\n### Local development\n\nLet Jekyll do what it does best and transform your content into HTML. Asset \nmanagement is handled by Gulp:\n\n- build `style.css` (preprocess SCSS, add vendor prefixes, concatenate, minify, \n  hash, and gzip)\n- build critical path CSS\n- build `index.js` (concatenate, minify, hash, and gzip)\n- optimize images\n- optimize and resize `feature` images\n- optimize and combine SVG icon set\n- serve site locally for testing with Browser Sync\n- deploy site to production server via Rsync\n- submit XML sitemap to Google & Bing\n\nDefault structure (paths can be modified in `gulpfile.js` and `_config.yml`):\n\n```bash\n├── gulp                      # => gulp tasks\n├── src                       # => source Jekyll files and assets\n|  ├── _includes\n|  ├── _layouts\n|  ├── _plugins\n|  ├── ...\n|  ├── _posts\n|  ├── assets\n|  |  ├── icons\n|  |  ├── images\n|  |  |   └── feature\n|  |  ├── javascript\n|  |  |   ├── plugins\n|  |  |   ├── vendor\n|  |  |   └── main.js\n|  |  ├── stylesheets\n|  |  |   ├── vendor\n|  |  |   ├── ...\n|  |  |   └── style.scss\n├── .editorconfig\n├── .gitignore\n├── _config.dev.yml\n├── _config.yml\n├── Gemfile\n├── gulpfile.js\n├── package.json\n├── rsync-credentials.json\n├── ...\n```\n\n## Getting started\n\n### Dependencies:\n\n- **Ruby**: >2.1 with Bundler >1.10\n- **Node**: >4.2 and Yo >1.7.0\n- **Yarn**\n- **Gulp**: Since the release candidate is running Gulp 4.0 you need to install \n  `gulp-cli`: `npm install gulp-cli -g`\n\n**Step 1:** Install [Bundler](http://bundler.io/), then run `bundle install`.\n\n**Step 2.** Install [Node.js](https://nodejs.org/en/) and [Yarn](https://yarnpkg.com/en/docs/install),\nthen run `yarn install`.\n\n**Step 3:** Install [node-gyp](https://github.com/nodejs/node-gyp#installation).\n\n**Step 4.** To start run `gulp`. A development version of the site should be \ngenerated and opened in a browser with Browser Sync at `http://localhost:4000`.\n\n## Usage\n\n### `gulp [--prod]`\n\nThis is the default command, and probably the one you'll use the most. This\ncommand will build your assets and site with development settings. You'll get\nsourcemaps, your drafts will be generated. As you are changing your posts, pages \nand assets they will automatically update and inject into your browser via \n[BrowserSync][browsersync].\n\n> `--prod`\n\nOnce you are done and want to verify that everything works with production\nsettings you add the flag `--prod` and your assets will be optimized. Your CSS,\nJS and HTML will be minified and gzipped, plus the CSS and JS will be cache\nbusted. The images will be compressed and Jekyll will generate a site with all\nyour posts and no drafts.\n\n### `gulp build [--prod]`\n\nThis command is identical to the normal `gulp [--prod]` however it will not\ncreate a BrowserSync session in your browser.\n\n### `gulp (build) [--prod]` main subtasks\n\n> `gulp jekyll [--prod]`\n\nWithout production settings Jekyll will only create both future posts and drafts. \nWith `--prod` none of that is true and it will generate all your posts.\n\n> `gulp styles|scripts [--prod]`\n\nBoth your CSS and JS will have sourcemaps generated for them under development\nsettings. Once you generate them with production settings sourcemap generation\nis disabled. Both will be minified, gzipped and cache busted with production\nsettings.\n\n> `gulp images:optimize`\n\nOptimizes standard images and copies to `/dist` folder.\n\n> `gulp images:feature`\n\nSimilar to the previous task but for images in `src/assets/images/feature`. \nResizes each image into various sizes to be served responsively with `<img>` \n`srcset` or `<picture>` elements, optimizes, and then copies to `/dist` folder.\n\n> `gulp html --prod`\n\n**Does nothing without `--prod`.** Minifies and gzips your HTML files.\n\n> `gulp serve`\n\nIf you just want to watch your site you can run this command. If wanted you can\nalso edit the `serve` task to allow it to tunnel via [localtunnel][localtunnel]\nso people outside your local network can view it as well:\n\n```js\n  // tunnel: true,\n```\n\nYou can also change the behavior for how it opens the URL when you run `gulp\n[--prod]`, you can see the options [here][browsersync-open]:\n\n```js\n  // open: false,\n```\n\n### `gulp icons`\n\nSVG assets are optimized and smashed together into `assets/icons/icons.svg` and can \nbe referenced by name. To update or add new assets place appropriately named \n`.svg` files into the `src/assets/icons` folder.\n\n### `gulp deploy`\n\nWhen you're done developing and have built your site with either `gulp --prod`\nor `gulp build --prod` you can deploy your site with Rsync.\n\nIf you need any help with configuring it, checkout the [`gulp-rsync`][rsync] repo.\n\n> `gulp submit:sitemap`\n\nSubmit sitemap XML file to Google and Bing.\n\n### `gulp check`\n\nBuilds site with production settings then tests HTML for broken links with \n[html-proofer][htmlproofer].\n\n### `gulp clean`\n\nDeletes your assets from their `.tmp` directory as well as in `dist` and deletes\nany gzipped files. **NOTE:** Does not delete your images from `.tmp` to reduce\nthe time to build your site due to image optimizations.\n\n### `gulp rebuild`\n\nOnly use this if you want to regenerate everything, this will delete everything \n(images, assets, your generated Jekyll site). You really shouldn't need to do\nthis unless you have phantom image assets floating around you want to clear.\n\n### `gulp critical`\n\nExtract critical path CSS from `home`, `archive`, `post`, and `page` layouts \nto inline via Jekyll `_includes`.\n\n**Note:** Clear `critical-<layout>.css` includes, run `gulp build`, then `gulp critical`.\n\n## Subtasks\n\nAll of the subtasks lives in their own files in the `gulp` directory and are\nnamed after what they do. You can edit or look at any of them to see how they\nactually work. They're all commented.\n\n## Inject more than one JavaScript file\n\nIf you want to split up your JavaScript files into say a `index.js` and a\n`vendor.js` file with files from [Bower][https://bower.io/] you can do this \nquite easily. Create a copy of the `scripts` gulp task and rename it to \n`scripts:vendor` and change the\n`gulp.src` files you need:\n\n```js\ngulp.src([\n  'bower_components/somelibrary.js/dist/somelibrary.js',\n  'bower_components/otherthing.js/dist/otherthing.js'\n])\n```\n\nand then change `.pipe(concat('index.js'))` into\n`.pipe(concat('vendor.js'))`. Then you go to the bottom of the gulpfile and\nchange the `assets` task:\n\n```js\ngulp.task('assets', gulp.series(\n  gulp.series('clean:assets'),\n  gulp.parallel('styles', 'scripts:vendor', 'scripts', 'fonts', 'images')\n));\n```\n\nNotice the `scripts:vendor` task that has been added. Also be aware that things\nare injected in alphabetical order, so if you need your vendor scripts before\nthe `index.js` file you have to either rename the `index.js` file or rename the\n`vendor.js` file. When you now run `gulp` or `gulp build` it will create a\n`vendor.js` file and automatically inject it at the bottom of your HTML. When\nrunning with `--prod` it'll automatically optimize as well.\n\nFor more advanced uses, refer to the [`gulp-inject`][inject] documentation on\nhow to create individual inject tags and inject specific files into them.\n\n**Gulp tasks inspired by [generator-jekyllized](https://github.com/sondr3/generator-jekyllized) by [Sondre Nilsen](https://github.com/sondr3).**\n\n[browsersync]: https://github.com/shakyShane/browser-sync\n[browsersync-open]: https://browsersync.io/docs/options/#option-open\n[gulp]: http://gulpjs.com/\n[inject]: https://github.com/klei/gulp-inject\n[jekyll-url]: http://jekyllrb.com/docs/github-pages/#project-page-url-structure\n[jekyll]: https://jekyllrb.com\n[localtunnel]: http://localtunnel.me/\n[rsync]: https://github.com/jerrysu/gulp-rsync\n[htmlproofer]: https://github.com/gjtorikian/html-proofer\n\n---\n\n### Posts and Pages\n\nComments are disabled by default. To enable add `comments: true` to the YAML \nFront Matter. Preferred method is to enable via YAML Front Matter defaults in `_config.yml`.\n\n## License\n\nThe MIT License (MIT)\n\nCopyright (c) 2004-2019 Michael Rose\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\nMade Mistakes incorporates icons from [The Noun Project](https://thenounproject.com/).\nIcons are distributed under Creative Commons Attribution 3.0 United States (CC BY 3.0 US).\nHome by Mahmure Alp from the Noun Project\n\nMade Mistakes incorporates photographs from [Unsplash](https://unsplash.com).\n\nMade Mistakes incorporates [Breakpoint](http://breakpoint-sass.com/).\nBreakpoint is distributed under the terms of the [MIT/GPL Licenses](http://opensource.org/licenses/MIT).\n\nMade Mistakes incorporates [Bigfoot](http://bigfootjs.com/),\nCopyright (c) 2013-2014, Chris Sauve.\nBigfoot is distributed under the terms of the MIT License](http://opensource.org/licenses/MIT).\n\nMade Mistakes incorporates [Lity](http://sorgalla.com/lity/),\nCopyright (c) 2015-2016, Jan Sorgalla.\nLity is distributed under the terms of the MIT License](http://opensource.org/licenses/MIT).\n\nMade Mistakes incorporates [Smooth Scroll](https://github.com/cferdinandi/smooth-scroll),\nCopyright (c) 2019, Chris Ferdinandi.\nSmooth Scroll is distributed under the terms of the [MIT License](http://opensource.org/licenses/MIT).\n\nMade Mistakes incorporates [Lazysizes](https://github.com/aFarkas/lazysizes),\nCopyright (c) 2015, Alexander Farkas.\nLazysizes is distributed under the terms of the [MIT License](http://opensource.org/licenses/MIT).\n\nMade Mistakes incorporates [SVG for Everybody](https://jonathantneal.github.io/svg4everybody/),\nCopyright (c) Jonathan Neal.\nSVG for Everybody is distributed under the terms of the [CC0 1.0 Universal License](https://creativecommons.org/publicdomain/zero/1.0/).\n"
  },
  {
    "path": "Rakefile",
    "content": "require 'html-proofer'\n\ntask :test do\n  options = {\n    :internal_domains => ['mademistakes.com'],\n    :cache => {\n      :timeframe => '30d'\n    },\n    :url_ignore => [/(twitter|instagram|sktchy|mix.fiftythree|paper.fiftythree).com/],\n    # disable SSL certificates\n    :typhoeus => {\n      :ssl_verifypeer => false,\n      :ssl_verifyhost => 0\n    },\n    :allow_hash_href => true,\n    :assume_extension => true,\n    :empty_alt_ignore => true,\n    :check_opengraph => true\n  }\n  HTMLProofer.check_directory('./dist', options).run\nend\n"
  },
  {
    "path": "_config.dev.yml",
    "content": "# Site wide configuration\n\nurl: \"\"\n\nprofile: true\nfuture: true\nshow_drafts: true\n\ngoogle_site_verification: \"\"\nbing_site_verification: \"\"\nalexa_site_verification: \"\"\nyandex_site_verification: \"\"\n\ngoogle_ad-client: \"\"\ngoogle_ad-slot: \"\"\ngoogle_analytics: \"\"\n"
  },
  {
    "path": "_config.yml",
    "content": "# Site wide configuration\nsource: .tmp/src\ndestination: .tmp/dist\n\ntitle: \"Made Mistakes\"\ndescription: \"Personal website of designer Michael Rose (@mmistakes)\"\nlogo: &logo \"/assets/images/android-chrome-384x384.png\"\nlocale: \"en_US\"\nwords_per_minute: 200\n\nrepository: \"mmistakes/made-mistakes-jekyll\"\nurl: \"https://mademistakes.com\"\n\nsocial:\n  name: \"Michael Rose\"\n  links:\n    - \"https://twitter.com/mmistakes\"\n    - \"https://www.facebook.com/michaelrose\"\n    - \"https://www.instagram.com/mmistakes/\"\n    - \"https://github.com/mmistakes\"\n    - \"https://micro.blog/mmistakes\"\n\ngoogle_site_verification: \"geapSKtvpBNDSfXVmF09E9CnaHGglbO61r4XgLZtEmo\"\nbing_site_verification: \"D81F4C18A6CB3018F64D7C827D953DFD\"\nalexa_site_verification: \"Y5DYjZ4VWlrQzBP5kcQJeOKLNas\"\nyandex_site_verification: \"55a5419baf76a498\"\n\ngoogle_ad-client: \"ca-pub-7328585512091257\"\ngoogle_ad-slot: \"3049671934\"\ngoogle_analytics: \"UA-2011187-1\"\n\nfeed:\n  path: \"https://mademistakes.com/atom.xml\"\n\nfavicon_version: \"9BPnoQEY43\"\n\npingback_url: \"https://webmention.io/mademistakes.com/xmlrpc\"\nwebmention_url: \"https://webmention.io/mademistakes.com/webmention\"\nmicropub_url: \"https://mm-micropub-to-github.herokuapp.com/micropub/main\"\ntoken_endpoint_url: \"https://tokens.indieauth.com/token\"\nauthorization_endpoint_url: \"https://indieauth.com/auth\"\nmicroblog_url: \"https://micro.blog/mmistakes\"\n\n# Site owner\nauthor:\n  name: \"Michael Rose\"\n  uri: &uri \"https://mademistakes.com/about/\"\n  url: *uri\n  bio: \"Just another boring, tattooed, time traveling designer.\"\n  picture: \"/assets/images/michael-rose-glitched.jpg\"\n  twitter: \"https://twitter.com/mmistakes\"\n  facebook: \"https://www.facebook.com/michaelrose\"\n  instagram: \"https://www.instagram.com/mmistakes/\"\n  github: \"https://github.com/mmistakes\"\n\ntwitter:\n  username: \"mmistakes\"\n\n# Staticman comments (full configuration in staticman.yml)\nstaticman:\n  branch: \"master\"\n\n# reCAPTCHA keys\nreCaptcha:\n  siteKey: \"6LdRBykTAAAAAFB46MnIu6ixuxwu9W1ihFF8G60Q\"\n  secret: \"PznnZGu3P6eTHRPLORniSq+J61YEf+A9zmColXDM5icqF49gbunH51B8+h+i2IvewpuxtA9TFoK68TuhUp/X3YKmmqhXasegHYabY50fqF9nJh9npWNhvITdkQHeaOqnFXUIwxfiEeUt49Yoa2waRR7a5LdRAP3SVM8hz0KIBT4=\"\n\n# Jekyll configuration\npermalink: /:categories/:title/\nlsi: true\nfuture: false\nshow_drafts: false\nmarkdown: kramdown\nkramdown:\n  toc_levels: 1..3\n  input: GFM\n  hard_wrap: false\n  auto_ids: true\n  entity_output: as_char\n  smart_quotes: lsquo,rsquo,ldquo,rdquo\n  enable_coderay: false\nhighlighter: rouge\nstrict_front_matter: true\nkeep_files:\n  - .git\ninclude:\n  - _pages\n  - _redirects\nexclude:\n  - .jekyll-cache\n  - .sass-cache\n  - Gemfile\n  - Gemfile.lock\n  - gemfiles/\n  - Gruntfile.js\n  - gulpfile.js\n  - log\n  - node_modules\n  - package.json\n  - Rakefile\n  - README\n  - tmp\n  - vendor/bundle/\n  - vendor/cache/\n  - vendor/gems/\n  - vendor/ruby/\n\n# Plugins\nplugins:\n  - jekyll-sitemap\n  - jemoji\n  - jekyll-seo-tag\n  - jekyll-paginate-v2\n  - jekyll-typogrify\n  - jekyll-figure\n  - jekyll-algolia\n  - jekyll/tagging\n  - jekyll-tagging-related_posts\n  - jekyll-include-cache\n  - jekyll-toc\n\n# Collections\ncollections:\n  faqs:\n    output: true\n    permalink: /:collection/:path/\n    title: FAQs\n  work:\n    output: true\n    permalink: /:collection/:path/\n    title: Works\n  components:\n    output: false\n  colors:\n    output: false\n\n# Front Matter Defaults\ndefaults:\n  # Blog Articles\n  - scope:\n      path: _posts/articles\n      type: posts\n    values:\n      layout: post\n      byline: false\n      read_time: true\n      support: true\n      breadcrumbs:\n        - label: \"Blog articles\"\n          url: /articles/\n      image:\n        facebook: *logo\n        twitter: *logo\n      twitter:\n        card: summary\n  # Mastering Paper\n  - scope:\n      path: _posts/mastering-paper\n      type: posts\n    values:\n      layout: post\n      byline: false\n      read_time: true\n      comments: true\n      support: true\n      breadcrumbs:\n        - label: \"Mastering Paper for iOS\"\n          url: /mastering-paper/\n      image:\n        facebook: *logo\n        twitter: *logo\n      twitter:\n        card: summary\n  # Notes\n  - scope:\n      path: _posts/notes\n      type: posts\n    values:\n      layout: post\n      byline: false\n      read_time: true\n      breadcrumbs:\n        - label: \"Notes\"\n          url: /notes/\n      image:\n        facebook: *logo\n        twitter: *logo\n      twitter:\n        card: summary\n  # PaperFaces\n  - scope:\n      path: _posts/paperfaces\n      type: posts\n    values:\n      layout: post\n      byline: false\n      breadcrumbs:\n        - label: \"Works\"\n          url: /work/\n        - label: \"PaperFaces portraits\"\n          url: /paperfaces/\n      work: \"Illustration\"\n      seo:\n        type: \"CreativeWork\"\n  # Procreate Paintings\n  - scope:\n      path: _posts/procreate\n      type: posts\n    values:\n      layout: post\n      byline: false\n      breadcrumbs:\n        - label: \"Works\"\n          url: /work/\n        - label: \"Procreate paintings\"\n          url: /procreate-paintings/\n      work: \"Illustration\"\n      seo:\n        type: \"CreativeWork\"\n  # Tiny Paintings\n  - scope:\n      path: _posts/tiny-paintings\n      type: posts\n    values:\n      layout: post\n      byline: false\n      breadcrumbs:\n        - label: \"Works\"\n          url: /work/\n        - label: \"Tiny paintings\"\n          url: /tiny-paintings/\n      work: \"Illustration\"\n      seo:\n        type: \"CreativeWork\"\n  # Work (posts and collection)\n  - scope:\n      path: _posts/work\n      type: posts\n    values:\n      layout: post\n      breadcrumbs:\n        - label: \"Works\"\n          url: /work/\n      seo:\n        type: \"CreativeWork\"\n  - scope:\n      path: _work\n      type: work\n    values:\n      layout: work\n      category: work\n      breadcrumbs:\n        - label: \"Works\"\n          url: /work/\n      seo:\n        type: \"CreativeWork\"\n  # FAQs\n  - scope:\n      path: _faqs\n      type: faqs\n    values:\n      layout: page\n      read_time: true\n      breadcrumbs:\n        - label: \"Frequently asked questions\"\n          url: /faqs/\n      image:\n        facebook: *logo\n        twitter: *logo\n      twitter:\n        card: summary\n  # Pages\n  - scope:\n      path: _pages\n      type: pages\n    values:\n      layout: page\n      image:\n        facebook: *logo\n        twitter: *logo\n      twitter:\n        card: summary\n\n# Plugin: Pagination (jekyll-paginate-v2)\npagination:\n  enabled: true\n  debug: false\n  per_page: 15\n  permalink: \"/page/:num/\"\n  title: \":title\"\n  limit: 0\n  sort_field: \"date\"\n  sort_reverse: true\n\n# Plugin: Auto Pages (jekyll-paginate-v2)\nautopages:\n  enabled: true\n  categories:\n    enabled: false\n  collections:\n    enabled: false\n  tags:\n    enabled: true\n    slugify:\n      mode: raw\n      cased: true\n    layouts:\n      - \"autopage_tags.html\"\n    title: \":tag\" # :tag is replaced by the tag name\n    permalink: \"/tag/:tag\"\n\n# Plugin: Figure (jekyll-figure)\njekyll-figure:\n  paragraphs: false\n\n# Plugin: Table of Contents (jekyll-toc)\ntoc:\n  min_level: 2\n  max_level: 2\n  list_class: \"toc__menu\"\n  item_class: \"toc__entry\"\n  item_prefix: \"toc__\"\n\n# Plugin: Jekyll Algolia\nalgolia:\n  application_id: KT124ONH1Z\n  index_name: mademistakes\n  search_only_api_key: 5a6e106e8083321a8ccca41b11aca95c\n  nodes_to_index: \"p,blockquote\"\n  files_to_exclude:\n    - index.html\n    - index.md\n    - _pages/404.md\n    - _pages/articles.md\n    - _pages/faqs.md\n    - _pages/mastering-paper.md\n    - _pages/portraits.md\n    - _pages/sitemap.md\n    - _pages/tag.md\n    - _pages/notes.md\n    - _pages/work.md\n"
  },
  {
    "path": "gulp/paths.js",
    "content": "\"use strict\";\nvar paths = {};\n\n// Folder naming conventions.\npaths.assetsFolderName = \"assets\";\npaths.dataFolderName = \"_data\";\npaths.iconFolderName = \"icons\";\npaths.includesFolderName = \"_includes\";\npaths.imageFolderName = \"images\";\npaths.layoutsFolderName = \"_layouts\";\npaths.scriptFolderName = \"javascripts\";\npaths.siteFolderName = \"dist\";\npaths.sourceFolderName = \"src\";\npaths.stylesFolderName = \"stylesheets\";\npaths.tempFolderName = \".tmp\";\n\npaths.prodUrl = \"https://mademistakes.com\";\n\n// Directory locations.\npaths.sourceDir = paths.sourceFolderName + \"/\";\npaths.assetsDir = paths.assetsFolderName + \"/\";\npaths.tempDir = paths.tempFolderName + \"/\";\npaths.siteDir = paths.siteFolderName + \"/\";\n\n// Source asset files locations.\npaths.sassFiles = paths.sourceDir + paths.assetsDir + paths.stylesFolderName;\npaths.jsFiles = paths.sourceDir + paths.assetsDir + paths.scriptFolderName;\npaths.iconFiles = paths.sourceDir + paths.assetsDir + paths.iconFolderName;\npaths.imageFiles = paths.sourceDir + paths.assetsDir + paths.imageFolderName;\npaths.fontFiles = paths.sourceDir + paths.assetsDir + paths.fontFolderName;\n\n// Temp asset files locations.\npaths.assetFilesTemp = paths.tempDir + paths.assetsFolderName;\npaths.sassFilesTemp = paths.tempDir + paths.assetsDir + paths.stylesFolderName;\npaths.jsFilesTemp = paths.tempDir + paths.assetsDir + paths.scriptFolderName;\npaths.iconFilesTemp = paths.tempDir + paths.assetsDir + paths.iconFolderName;\npaths.imageFilesTemp = paths.tempDir + paths.assetsDir + paths.imageFolderName;\npaths.fontFilesTemp = paths.tempDir + paths.assetsDir + paths.fontFolderName;\n\n// Site asset files locations.\npaths.assetFilesSite = paths.siteDir + paths.assetsFolderName;\npaths.sassFilesSite = paths.siteDir + paths.assetsDir + paths.stylesFolderName;\npaths.jsFilesSite = paths.siteDir + paths.assetsDir + paths.scriptFolderName;\npaths.iconFilesSite = paths.siteDir + paths.assetsDir + paths.iconFolderName;\npaths.imageFilesSite = paths.siteDir + paths.assetsDir + paths.imageFolderName;\npaths.fontFilesSite = paths.siteDir + paths.assetsDir + paths.fontFolderName;\n\n// Glob patterns by file type.\npaths.sassPattern = \"/**/*.scss\";\npaths.jsPattern = \"/**/*.js\";\npaths.imagePattern =\n  \"/**/*.+(jpg|JPG|jpeg|JPEG|png|PNG|svg|SVG|gif|GIF|webp|WEBP|tif|TIF)\";\npaths.markdownPattern = \"/**/*.+(md|MD|markdown|MARKDOWN)\";\npaths.htmlPattern = \"/**/*.html\";\npaths.txtPattern = \"/**/*.txt\";\npaths.xmlPattern = \"/**/*.{xml,json}\";\npaths.ymlPattern = \"/**/*.yml\";\n\n// File globs\npaths.htmlFilesGlob = paths.sourceFolderName + paths.htmlPattern;\npaths.imageFilesGlob = paths.imageFiles + paths.imagePattern;\npaths.jsFilesGlob = paths.jsFiles + paths.jsPattern;\npaths.mdFilesGlob = paths.sourceFolderName + paths.markdownPattern;\npaths.sassFilesGlob = paths.sassFiles + paths.sassPattern;\npaths.txtFilesGlob = paths.sourceFolderName + paths.txtPattern;\npaths.xmlFilesGlob = paths.sourceFolderName + paths.xmlPattern;\npaths.ymlFilesGlob = paths.sourceFolderName + paths.ymlPattern;\n\nvar imageFilesCachePath;\n\nif (process.env.CONTEXT === \"production\") {\n  paths.imageFilesCachePath = \"/opt/build/cache/assets/images\";\n} else {\n  paths.imageFilesCachePath = paths.imageFilesSite;\n}\n\nmodule.exports = paths;\n"
  },
  {
    "path": "gulp/tasks/assets.js",
    "content": "\"use strict\";\nvar argv = require(\"yargs\").argv;\nvar autoprefixer = require(\"autoprefixer\");\nvar browserSync = require(\"browser-sync\").create();\nvar cheerio = require(\"gulp-cheerio\");\nvar concat = require(\"gulp-concat\");\nvar cssnano = require(\"cssnano\");\nvar gulp = require(\"gulp\");\nvar gzip = require(\"gulp-gzip\");\nvar newer = require(\"gulp-newer\");\nvar postcss = require(\"gulp-postcss\");\nvar rename = require(\"gulp-rename\");\nvar rev = require(\"gulp-rev\");\nvar revDel = require(\"rev-del\");\nvar sass = require(\"gulp-sass\");\nvar size = require(\"gulp-size\");\nvar sourcemaps = require(\"gulp-sourcemaps\");\nvar svgmin = require(\"gulp-svgmin\");\nvar svgstore = require(\"gulp-svgstore\");\nvar uglify = require(\"gulp-uglify\");\nvar when = require(\"gulp-if\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp scripts' -- creates a index.js file with Sourcemap from your JavaScript files\n// 'gulp scripts --prod' -- creates a index.js file from your JavaScript files,\n//   minifies, and cache busts it (does not create a Sourcemap)\ngulp.task(\"scripts\", () => {\n  // NOTE: The order here is important since it's concatenated in order from\n  // top to bottom, so you want vendor scripts etc on top\n  return (\n    gulp\n      .src([\n        paths.jsFiles + \"/vendor/jquery/*.js\",\n        paths.jsFiles + \"/plugins/**/*.js\",\n        paths.jsFiles + \"/main.js\"\n      ])\n      .pipe(\n        newer(paths.jsFilesTemp + \"/index.js\", {\n          dest: paths.jsFilesTemp,\n          ext: \".js\"\n        })\n      )\n      .pipe(when(!argv.prod, sourcemaps.init()))\n      // concatenate scripts\n      .pipe(concat(\"index.js\"))\n      .pipe(size({ showFiles: true }))\n      // minify for production\n      .pipe(\n        when(argv.prod, when(\"*.js\", uglify({ output: { comments: \"some\" } })))\n      )\n      // output sourcemap for development\n      .pipe(when(!argv.prod, sourcemaps.write(\".\")))\n      .pipe(gulp.dest(paths.jsFilesTemp))\n      // hash JS for production\n      .pipe(when(argv.prod, rev()))\n      .pipe(when(argv.prod, size({ showFiles: true })))\n      // output hashed files\n      .pipe(when(argv.prod, gulp.dest(paths.jsFilesTemp)))\n      // generate manifest of hashed CSS files\n      .pipe(rev.manifest(\"js-manifest.json\"))\n      .pipe(gulp.dest(paths.tempDir + paths.sourceDir + paths.dataFolderName))\n      .pipe(when(argv.prod, size({ showFiles: true })))\n  );\n});\n\n// 'gulp scripts:gzip --prod' -- gzips JS\ngulp.task(\"scripts:gzip\", () => {\n  return gulp\n    .src([paths.jsFilesTemp + \"/*.js\"])\n    .pipe(when(argv.prod, when(\"*.js\", gzip({ append: true }))))\n    .pipe(\n      when(\n        argv.prod,\n        size({\n          gzip: true,\n          showFiles: true\n        })\n      )\n    )\n    .pipe(when(argv.prod, gulp.dest(paths.jsFilesTemp)));\n});\n\n// 'gulp styles' -- creates a CSS file from SCSS, adds prefixes and creates a Sourcemap\n// 'gulp styles --prod' -- creates a CSS file from your SCSS, adds prefixes,\n//   minifies, and cache busts it (does not create a Sourcemap)\ngulp.task(\"styles\", () => {\n  return (\n    gulp\n      .src([paths.sassFiles + \"/main.scss\"])\n      .pipe(when(!argv.prod, sourcemaps.init()))\n      // preprocess Sass\n      .pipe(sass({ precision: 10 }).on(\"error\", sass.logError))\n      // add-remove vendor prefixes\n      .pipe(when(!argv.prod, postcss([autoprefixer({ grid: true })])))\n      // minify for production\n      .pipe(\n        when(\n          argv.prod,\n          when(\n            \"*.css\",\n            postcss([\n              autoprefixer({\n                grid: true\n              }),\n              cssnano()\n            ])\n          )\n        )\n      )\n      .pipe(size({ showFiles: true }))\n      // output sourcemap for development\n      .pipe(when(!argv.prod, sourcemaps.write(\".\")))\n      .pipe(when(argv.prod, gulp.dest(paths.sassFilesTemp)))\n      // hash CSS for production\n      .pipe(when(argv.prod, rev()))\n      .pipe(when(argv.prod, size({ showFiles: true })))\n      // output hashed files\n      .pipe(gulp.dest(paths.sassFilesTemp))\n      // generate manifest of hashed CSS files\n      .pipe(rev.manifest(\"css-manifest.json\"))\n      .pipe(gulp.dest(paths.tempDir + paths.sourceDir + paths.dataFolderName))\n      .pipe(when(argv.prod, size({ showFiles: true })))\n      .pipe(when(!argv.prod, browserSync.stream()))\n  );\n});\n\n// 'gulp styles:gzip --prod' -- gzips CSS\ngulp.task(\"styles:gzip\", () => {\n  return gulp\n    .src([paths.sassFilesTemp + \"/*.css\"])\n    .pipe(when(argv.prod, when(\"*.css\", gzip({ append: true }))))\n    .pipe(\n      when(\n        argv.prod,\n        size({\n          gzip: true,\n          showFiles: true\n        })\n      )\n    )\n    .pipe(when(argv.prod, gulp.dest(paths.sassFilesTemp)));\n});\n\n// 'gulp icons' -- combine all svg icons into single file\ngulp.task(\"icons\", () => {\n  return gulp\n    .src(paths.iconFiles + \"/*.svg\")\n    .pipe(svgmin())\n    .pipe(rename({ prefix: \"icon-\" }))\n    .pipe(svgstore({ fileName: \"icons.svg\", inlineSvg: true }))\n    .pipe(\n      cheerio({\n        run: function($, file) {\n          $(\"svg\").attr(\"style\", \"display:none\");\n          $(\"[fill]\").removeAttr(\"fill\");\n        },\n        parserOptions: { xmlMode: true }\n      })\n    )\n    .pipe(\n      size({\n        showFiles: true\n      })\n    )\n    .pipe(gulp.dest(paths.iconFilesTemp));\n});\n\n// function to properly reload your browser\nfunction reload(done) {\n  browserSync.reload();\n  done();\n}\n// 'gulp serve' -- open site in browser and watch for changes\n// in source files and update them when needed\ngulp.task(\"serve\", done => {\n  browserSync.init({\n    // tunnel: true,\n    // open: false,\n    port: 4000, // change port to match default Jekyll\n    ui: {\n      port: 4001\n    },\n    server: [paths.tempFolderName, paths.siteFolderName]\n  });\n  done();\n\n  // watch various files for changes and do the needful\n  gulp.watch(\n    [paths.mdFilesGlob, paths.htmlFilesGlob, paths.ymlFilesGlob],\n    gulp.series(\"build:site\", reload)\n  );\n  gulp.watch(\n    [paths.xmlFilesGlob, paths.txtFilesGlob],\n    gulp.series(\"site\", reload)\n  );\n  gulp.watch(paths.jsFilesGlob, gulp.series(\"scripts\", reload));\n  gulp.watch(paths.sassFilesGlob, gulp.series(\"styles\", reload));\n  gulp.watch(\n    paths.imageFilesGlob,\n    gulp.series(\"copy:images\", \"images:feature\", reload)\n  );\n});\n"
  },
  {
    "path": "gulp/tasks/build.js",
    "content": "\"use strict\";\nvar argv = require(\"yargs\").argv;\nvar gulp = require(\"gulp\");\nvar shell = require(\"shelljs\");\nvar size = require(\"gulp-size\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp site:tmp' -- copies Jekyll site to a temporary directory to be processed\ngulp.task(\"site:tmp\", () => {\n  return gulp\n    .src(\n      [\n        paths.sourceFolderName + \"/**/*\",\n        \"!\" + paths.sourceDir + paths.assetsFolderName + \"/**/*\",\n        \"!\" + paths.sourceDir + paths.assetsFolderName\n      ],\n      { dot: true }\n    )\n    .pipe(gulp.dest(paths.tempDir + paths.sourceFolderName))\n    .pipe(size({ title: \"Jekyll\" }));\n});\n\n// 'gulp site' -- builds site with development settings\n// 'gulp site --prod' -- builds site with production settings\ngulp.task(\"site\", done => {\n  if (!argv.prod) {\n    shell.exec(\"bundle exec jekyll build --config _config.yml,_config.dev.yml\");\n    done();\n  } else if (argv.prod) {\n    shell.exec(\"bundle exec jekyll algolia\");\n    shell.exec(\"bundle exec jekyll build\");\n    done();\n  }\n});\n\n// 'gulp site:check' -- builds site with production settings then tests with html-proofer\ngulp.task(\"site:check\", done => {\n  shell.exec(\"gulp build --prod\");\n  shell.exec(\"bundle exec rake test\");\n  done();\n});\n"
  },
  {
    "path": "gulp/tasks/clean.js",
    "content": "\"use strict\";\nvar del = require(\"del\");\nvar gulp = require(\"gulp\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp clean:assets' -- removes temporary and built CSS/JS assets\ngulp.task(\"clean:assets\", () => {\n  return del([\n    paths.tempFolderName + \"/**/*\",\n    \"!\" + paths.assetFilesTemp,\n    paths.assetFilesSite + \"/**/*\",\n    \"!\" + paths.imageFilesSite,\n    \"!\" + paths.imageFilesSite + \"/**/*\"\n  ]);\n});\n\n// 'gulp clean:images' -- removes only image assets\ngulp.task(\"clean:images\", () => {\n  return del([paths.imageFilesSite]);\n});\n\n// 'gulp clean:dist' -- removes built site but keep images\ngulp.task(\"clean:dist\", () => {\n  return del(\n    [\n      paths.siteFolderName + \"/**/*\",\n      \"!\" + paths.assetFilesSite,\n      \"!\" + paths.imageFilesSite,\n      \"!\" + paths.imageFilesSite + \"/**/*\"\n    ],\n    { dot: true }\n  );\n});\n\n// 'gulp clean:gzip' -- removes gzip files\ngulp.task(\"clean:gzip\", () => {\n  return del([paths.siteFolderName + \"/**/*.gz\"]);\n});\n\n// 'gulp clean:site' -- removes temporary source\ngulp.task(\"clean:site\", () => {\n  return del([paths.tempDir + paths.sourceFolderName]);\n});\n"
  },
  {
    "path": "gulp/tasks/copy.js",
    "content": "\"use strict\";\nvar gulp = require(\"gulp\");\nvar newer = require(\"gulp-newer\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp copy:assets' -- copies assets to /dist/\n//   to avoid Jekyll overwriting the whole directory\ngulp.task(\"copy:assets\", () => {\n  return gulp\n    .src([paths.assetFilesTemp + \"/**/*\", paths.imageFiles + \"/*.ico\"])\n    .pipe(gulp.dest(paths.assetFilesSite));\n});\n\n// 'gulp copy:images' -- copies unoptimized images to /dist/\ngulp.task(\"copy:images\", () => {\n  return gulp\n    .src([\n      paths.imageFilesGlob,\n      \"!src/assets/images/{feature,feature/**}\"\n    ]) // do not process feature images\n    .pipe(newer(paths.imageFilesSite))\n    .pipe(gulp.dest(paths.imageFilesSite));\n});\n\n// 'gulp copy:images:cached' -- copies cached images to /dist/\ngulp.task(\"copy:images:cached\", () => {\n  return gulp\n    .src(paths.imageFilesCachePath + \"/**/*\")\n    .pipe(newer(paths.imageFilesSite))\n    .pipe(gulp.dest(paths.imageFilesSite));\n});\n\n// 'gulp copy:icons' -- copies .ico assets to /dist/\ngulp.task(\"copy:icons\", () => {\n  return gulp\n    .src(paths.imageFiles + \"/*.ico\")\n    .pipe(newer(paths.imageFilesSite))\n    .pipe(gulp.dest(paths.imageFilesSite));\n});\n\n// 'gulp copy:manifest' -- copies image json to /dist/\ngulp.task(\"copy:manifest\", () => {\n  return gulp\n    .src(paths.imageFiles + \"/*.json\")\n    .pipe(newer(paths.imageFilesSite))\n    .pipe(gulp.dest(paths.imageFilesSite));\n});\n\n// 'gulp copy:site' -- copies processed Jekyll site to /dist/\ngulp.task(\"copy:site\", () => {\n  return gulp\n    .src([\n      paths.tempDir + paths.siteFolderName + \"/**/*\",\n      paths.tempDir + paths.siteFolderName + \"/**/.*\"\n    ])\n    .pipe(gulp.dest(paths.siteFolderName));\n});\n"
  },
  {
    "path": "gulp/tasks/fonts.js",
    "content": "\"use strict\";\nvar gulp = require(\"gulp\");\nvar size = require(\"gulp-size\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp fonts' -- copies fonts to temporary assets directory\ngulp.task(\"fonts\", () => {\n  return gulp\n    .src(paths.fontFiles + \"/**/*\")\n    .pipe(gulp.dest(paths.fontFilesTemp))\n    .pipe(size({ title: \"fonts\" }));\n});\n"
  },
  {
    "path": "gulp/tasks/html.js",
    "content": "\"use strict\";\nvar argv = require(\"yargs\").argv;\nvar critical = require(\"critical\").stream;\nvar gulp = require(\"gulp\");\nvar gzip = require(\"gulp-gzip\");\nvar htmlmin = require(\"gulp-htmlmin\");\nvar prettyData = require(\"gulp-pretty-data\");\nvar size = require(\"gulp-size\");\nvar when = require(\"gulp-if\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp html' -- does nothing\n// 'gulp html --prod' -- minifies and gzips HTML files for production\ngulp.task(\"html\", () => {\n  return gulp\n    .src(paths.siteFolderName + paths.htmlPattern)\n    .pipe(\n      when(\n        argv.prod,\n        htmlmin({\n          removeComments: true,\n          collapseWhitespace: true,\n          collapseBooleanAttributes: false,\n          removeAttributeQuotes: false,\n          removeRedundantAttributes: false,\n          minifyJS: true,\n          minifyCSS: true\n        })\n      )\n    )\n    .pipe(when(argv.prod, size({ title: \"optimized HTML\" })))\n    .pipe(when(argv.prod, gulp.dest(paths.siteFolderName)))\n    .pipe(when(argv.prod, gzip({ append: true })))\n    .pipe(\n      when(\n        argv.prod,\n        size({\n          title: \"gzipped HTML\",\n          gzip: true\n        })\n      )\n    )\n    .pipe(when(argv.prod, gulp.dest(paths.siteFolderName)));\n});\n\n// 'gulp xml' -- does nothing\n// 'gulp xml' --prod'  -- minifies XML and JSON files for production\ngulp.task(\"xml\", () => {\n  return gulp\n    .src(paths.siteFolderName + paths.xmlPattern)\n    .pipe(\n      when(\n        argv.prod,\n        prettyData({\n          type: \"minify\",\n          preserveComments: true\n        })\n      )\n    )\n    .pipe(when(argv.prod, size({ title: \"optimized XML\" })))\n    .pipe(when(argv.prod, gulp.dest(paths.siteFolderName)));\n});\n\n// Page dimensions for critical CSS\nvar pageDimensions = [\n  {\n    width: 320,\n    height: 480\n  },\n  {\n    width: 768,\n    height: 1024\n  },\n  {\n    width: 1024,\n    height: 1024\n  },\n  {\n    width: 1440,\n    height: 1280\n  }\n];\n\n// 'gulp styles:critical:archive' -- extract layout.archive critical CSS\n//   into /_includes/critical-archive.css\ngulp.task(\"styles:critical:archive\", () => {\n  return gulp\n    .src(paths.tempDir + paths.siteDir + \"mastering-paper/index.html\")\n    .pipe(\n      critical({\n        base: paths.tempDir,\n        inline: false,\n        css: [paths.sassFilesTemp + \"/main.css\"],\n        dimensions: pageDimensions,\n        dest:\n          paths.sourceDir + paths.includesFolderName + \"/critical-archive.css\",\n        minify: true,\n        extract: false,\n        ignore: [\"@font-face\", \"/print/\", /url\\(/, \".popular-list\"] // defer loading of webfonts and background images\n      })\n    );\n});\n\n// 'gulp styles:critical:post' -- extract layout.post critical CSS\n//   into /_includes/critical-post.css\ngulp.task(\"styles:critical:post\", () => {\n  return gulp\n    .src(paths.tempDir + paths.siteDir + \"articles/ipad-pro/index.html\")\n    .pipe(\n      critical({\n        base: paths.tempDir,\n        inline: false,\n        css: [paths.sassFilesTemp + \"/main.css\"],\n        dimensions: pageDimensions,\n        dest: paths.sourceDir + paths.includesFolderName + \"/critical-post.css\",\n        minify: true,\n        extract: false,\n        ignore: [\"@font-face\", \"/print/\", /url\\(/, \".popular-list\"] // defer loading of webfonts and background images\n      })\n    );\n});\n\n// 'gulp styles:critical:home' -- extract layout.home critical CSS\n//   into /_includes/critical-home.css\ngulp.task(\"styles:critical:home\", () => {\n  return gulp.src(paths.tempDir + paths.siteDir + \"index.html\").pipe(\n    critical({\n      base: paths.tempDir,\n      css: [paths.sassFilesTemp + \"/main.css\"],\n      dimensions: pageDimensions,\n      dest: paths.sourceDir + paths.includesFolderName + \"/critical-home.css\",\n      minify: true,\n      extract: false,\n      ignore: [\"@font-face\", \"/print/\", /url\\(/, \".popular-list\"] // defer loading of webfonts and background images\n    })\n  );\n});\n"
  },
  {
    "path": "gulp/tasks/images.js",
    "content": "\"use strict\";\nvar assetCache = require(\"gulp-asset-cache\");\nvar gulp = require(\"gulp\");\nvar newer = require(\"gulp-newer\");\nvar responsive = require(\"gulp-responsive\");\nvar size = require(\"gulp-size\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp images:optimize' -- optimize images\ngulp.task(\"images:optimize\", () => {\n  return gulp\n    .src([\n      paths.imageFilesGlob,\n      \"!src/assets/images/{feature,feature/**}\"\n    ]) // do not process feature images\n    .pipe(newer(paths.imageFilesSite))\n    .pipe(\n      imagemin(\n        [\n          imagemin.gifsicle({ interlaced: true }),\n          imagemin.jpegtran({ progressive: true }),\n          imagemin.optipng(),\n          imagemin.svgo({ plugins: [{ cleanupIDs: false }] })\n        ],\n        { verbose: true }\n      )\n    )\n    .pipe(gulp.dest(paths.imageFilesSite))\n    .pipe(size({ title: \"images\" }));\n});\n\n// 'gulp images:feature' -- resize images\ngulp.task(\"images:feature\", () => {\n  return gulp\n    .src([\n      paths.imageFiles + \"/feature\" + paths.imagePattern,\n      \"!\" + paths.imageFiles + \"/feature/**/*.{gif,svg}\"\n    ])\n    .pipe(assetCache.filter(paths.imageFilesCachePath + '/.feature-image-cache'))\n    .pipe(\n      responsive(\n        {\n          // resize all images\n          \"*.*\": [\n            {\n              width: 20,\n              rename: { suffix: \"-lq\" }\n            },\n            {\n              width: 320,\n              rename: { suffix: \"-320\" }\n            },\n            {\n              width: 768,\n              rename: { suffix: \"-768\" }\n            },\n            {\n              width: 1024,\n              rename: { suffix: \"-1024\" }\n            },\n            {\n              width: 1920,\n              rename: { suffix: \"\" }\n            }\n          ]\n        },\n        {\n          // global configuration for all images\n          errorOnEnlargement: false,\n          withMetadata: false,\n          errorOnUnusedConfig: false\n        }\n      )\n    )\n    .pipe(gulp.dest(paths.imageFilesCachePath)) // write to cache\n    .pipe(assetCache.cache());\n});\n"
  },
  {
    "path": "gulp/tasks/uploading.js",
    "content": "\"use strict\";\nvar fs = require(\"fs\");\nvar gulp = require(\"gulp\");\nvar rsync = require(\"gulp-rsync\");\n\n// include paths file\nvar paths = require(\"../paths\");\n\n// 'gulp upload' -- reads rsync credentials file and incrementally uploads site to server\ngulp.task(\"upload\", () => {\n  var credentials = JSON.parse(\n    fs.readFileSync(\"rsync-credentials.json\", \"utf8\")\n  );\n\n  return gulp.src(paths.siteFolderName).pipe(\n    rsync({\n      // dryrun: true,\n      root: paths.siteDir,\n      hostname: credentials.hostname,\n      username: credentials.username,\n      destination: credentials.destination,\n      incremental: true,\n      recursive: true,\n      compress: true,\n      clean: false,\n      chmod: \"Du=rwx,Dgo=rx,Fu=rw,Fgo=r\",\n      silent: true\n    })\n  );\n});\n\n// 'gulp submit:sitemap` -- submit sitemap XML file to Google and Bing\ngulp.task(\"submit:sitemap\", cb => {\n  var SitemapUrl = paths.prodUrl + \"/sitemap.xml\";\n\n  require(\"submit-sitemap\").submitSitemap(SitemapUrl, function(err) {\n    if (err) console.warn(err);\n    cb();\n  });\n});\n"
  },
  {
    "path": "gulpfile.js",
    "content": "// modified from generator-jekyllized 1.0.0-rc.6\n\"use strict\";\nvar gulp = require(\"gulp\");\nvar requireDir = require(\"require-dir\");\nvar tasks = requireDir(\"./gulp/tasks\", { recurse: true }); // eslint-disable-line\n\n// include paths file\nvar paths = require(\"./gulp/paths\");\n\n// 'gulp build:site' -- copies, replaces rev'd references, builds, and then copies it again\ngulp.task(\"build:site\", gulp.series(\"site:tmp\", \"site\", \"copy:site\"));\n\n// 'gulp assets' -- removes assets and rebuilds them\n// 'gulp assets --prod' -- same as above but with production settings\ngulp.task(\n  \"assets\",\n  gulp.series(\n    gulp.series(\"scripts\", \"styles\", \"fonts\", \"icons\"),\n    gulp.series(\n      \"scripts:gzip\",\n      \"styles:gzip\",\n      \"images:feature\",\n      \"copy:assets\",\n      \"copy:images:cached\",\n      \"copy:images\",\n      \"copy:icons\",\n      \"copy:manifest\"\n    )\n  )\n);\n\n// 'gulp clean' -- removes assets and gzipped files\ngulp.task(\n  \"clean\",\n  gulp.parallel(\"clean:assets\", \"clean:gzip\", \"clean:dist\", \"clean:site\")\n);\n\n// 'gulp build' -- same as 'gulp' but doesn't serve site\n// 'gulp build --prod' -- same as above but with production settings\ngulp.task(\"build\", gulp.series(\"clean\", \"assets\", \"build:site\", \"html\", \"xml\"));\n\n// 'gulp critical' -- builds critical path CSS includes\n//   WARNING: run this after substantial CSS changes\n//   WARNING: .html files referenced need to exist, run after `gulp build` to ensure.\ngulp.task(\n  \"critical\",\n  gulp.series(\n    \"styles:critical:home\",\n    \"styles:critical:archive\",\n    \"styles:critical:post\"\n  )\n);\n\n// 'gulp deploy' -- deploy site to production and submit sitemap XML\ngulp.task(\"deploy\", gulp.series(\"upload\", \"submit:sitemap\"));\n\n// 'gulp rebuild' -- WARNING: removes all assets, images, and built site\ngulp.task(\"rebuild\", gulp.series(\"clean\", \"clean:images\"));\n\n// 'gulp check' -- checks your Jekyll site for errors\ngulp.task(\"check\", gulp.series(\"site:check\"));\n\n// 'gulp' -- removes assets and gzipped files, creates assets and revs version\n//   in includes or layouts, builds site, serves site\n// 'gulp --prod' -- same as above but with production settings\ngulp.task(\"default\", gulp.series(\"build\", \"serve\"));\n"
  },
  {
    "path": "netlify.toml",
    "content": "[build]\n  command = \"gulp build --prod\"\n  publish = \"dist\"\n\n[[headers]]\n  for = \"/*\"\n  [headers.values]\n    Strict-Transport-Security = \"max-age=31536000; includeSubDomains; preload\"\n    X-Frame-Options = \"DENY\"\n    X-XSS-Protection = \"1; mode=block\"\n    Referrer-Policy = \"no-referrer\"\n    X-Content-Type-Options = \"nosniff\"\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"made-mistakes\",\n  \"version\": \"1.2.0\",\n  \"description\": \"Made Mistakes built with Jekyll, Gulp, and Netlify.\",\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git://github.com/mmistakes/made-mistakes-jekyll.git\"\n  },\n  \"keywords\": [\n    \"jekyll\",\n    \"gulp\",\n    \"netlify\"\n  ],\n  \"author\": \"Michael Rose\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/mmistakes/made-mistakes-jekyll/issues\"\n  },\n  \"dependencies\": {\n    \"autoprefixer\": \"^9.4.7\",\n    \"breakpoint-sass\": \"^2.7.1\",\n    \"browser-sync\": \"^2.26.4\",\n    \"concurrent-transform\": \"^1.0.0\",\n    \"critical\": \"0.7.3\",\n    \"cssnano\": \"^4.1.10\",\n    \"del\": \"^2.2.0\",\n    \"glob\": \"^7.0.6\",\n    \"gulp\": \"^4.0.0\",\n    \"gulp-asset-cache\": \"^1.1.5\",\n    \"gulp-cheerio\": \"^0.6.2\",\n    \"gulp-concat\": \"^2.6.0\",\n    \"gulp-empty\": \"^0.1.1\",\n    \"gulp-filter\": \"^5.1.0\",\n    \"gulp-gzip\": \"^1.4.2\",\n    \"gulp-htmlmin\": \"^4.0.0\",\n    \"gulp-if\": \"^2.0.1\",\n    \"gulp-imagemin\": \"^5.0.3\",\n    \"gulp-newer\": \"^1.4.0\",\n    \"gulp-notify\": \"^3.2.0\",\n    \"gulp-postcss\": \"^8.0.0\",\n    \"gulp-pretty-data\": \"^0.1.2\",\n    \"gulp-rename\": \"^1.4.0\",\n    \"gulp-responsive\": \"2.12.0\",\n    \"gulp-rev\": \"^9.0.0\",\n    \"gulp-rsync\": \"^0.0.8\",\n    \"gulp-sass\": \"^4.0.2\",\n    \"gulp-size\": \"^3.0.0\",\n    \"gulp-sourcemaps\": \"^2.6.4\",\n    \"gulp-svgmin\": \"^2.1.0\",\n    \"gulp-svgstore\": \"^7.0.1\",\n    \"gulp-uglify\": \"^3.0.1\",\n    \"gulp-util\": \"^3.0.7\",\n    \"lity\": \"^2.3.1\",\n    \"modularscale-sass\": \"^3.0.8\",\n    \"node-sass\": \"^4.11.0\",\n    \"postcss\": \"^6.0.13\",\n    \"require-dir\": \"^1.2.0\",\n    \"rev-del\": \"^2.0.0\",\n    \"shelljs\": \"^0.8.3\",\n    \"submit-sitemap\": \"^0.1.3\",\n    \"through2\": \"^3.0.0\",\n    \"yargs\": \"^13.1.0\",\n    \"snyk\": \"^1.189.0\"\n  },\n  \"browserslist\": [\n    \"last 2 versions\",\n    \"> 5%\"\n  ],\n  \"scripts\": {\n    \"snyk-protect\": \"snyk protect\",\n    \"prepublish\": \"npm run snyk-protect\"\n  },\n  \"snyk\": true\n}\n"
  },
  {
    "path": "src/.htaccess",
    "content": "# MadeMistakes\n# Apache Server Configs v2.14.0 | MIT License\n# https://github.com/h5bp/server-configs-apache\n\n# (!) Using `.htaccess` files slows down Apache, therefore, if you have\n# access to the main server configuration file (which is usually called\n# `httpd.conf`), you should add this logic there.\n#\n# https://httpd.apache.org/docs/current/howto/htaccess.html.\n\n\n# Allow SSI\nOptions +Includes\nAddHandler server-parsed .shtml .html .htm\n\n# ##############################################################################\n# # CROSS-ORIGIN RESOURCE SHARING (CORS)                                       #\n# ##############################################################################\n\n# ----------------------------------------------------------------------\n# | Cross-origin requests                                              |\n# ----------------------------------------------------------------------\n\n# Allow cross-origin requests.\n#\n# https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS\n# http://enable-cors.org/\n# http://www.w3.org/TR/cors/\n\n# <IfModule mod_headers.c>\n#     Header set Access-Control-Allow-Origin \"*\"\n# </IfModule>\n\n# ----------------------------------------------------------------------\n# | Cross-origin images                                                |\n# ----------------------------------------------------------------------\n\n# Send the CORS header for images when browsers request it.\n#\n# https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image\n# https://blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html\n\n<IfModule mod_setenvif.c>\n    <IfModule mod_headers.c>\n        <FilesMatch \"\\.(bmp|cur|gif|ico|jpe?g|png|svgz?|webp)$\">\n            SetEnvIf Origin \":\" IS_CORS\n            Header set Access-Control-Allow-Origin \"*\" env=IS_CORS\n        </FilesMatch>\n    </IfModule>\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Cross-origin web fonts                                             |\n# ----------------------------------------------------------------------\n\n# Allow cross-origin access to web fonts.\n\n<IfModule mod_headers.c>\n    <FilesMatch \"\\.(eot|otf|tt[cf]|woff2?)$\">\n        Header set Access-Control-Allow-Origin \"*\"\n    </FilesMatch>\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Cross-origin resource timing                                       |\n# ----------------------------------------------------------------------\n\n# Allow cross-origin access to the timing information for all resources.\n#\n# If a resource isn't served with a `Timing-Allow-Origin` header that\n# would allow its timing information to be shared with the document,\n# some of the attributes of the `PerformanceResourceTiming` object will\n# be set to zero.\n#\n# http://www.w3.org/TR/resource-timing/\n# http://www.stevesouders.com/blog/2014/08/21/resource-timing-practical-tips/\n\n# <IfModule mod_headers.c>\n#     Header set Timing-Allow-Origin: \"*\"\n# </IfModule>\n\n\n# ######################################################################\n# # ERRORS                                                             #\n# ######################################################################\n\n# ----------------------------------------------------------------------\n# | Custom error messages/pages                                        |\n# ----------------------------------------------------------------------\n\n# Customize what Apache returns to the client in case of an error.\n# https://httpd.apache.org/docs/current/mod/core.html#errordocument\n\nErrorDocument 404 /404/\n\n# ----------------------------------------------------------------------\n# | Error prevention                                                   |\n# ----------------------------------------------------------------------\n\n# Disable the pattern matching based on filenames.\n#\n# This setting prevents Apache from returning a 404 error as the result\n# of a rewrite when the directory with the same name does not exist.\n#\n# https://httpd.apache.org/docs/current/content-negotiation.html#multiviews\n\nOptions -MultiViews\n\n\n# ######################################################################\n# # INTERNET EXPLORER                                                  #\n# ######################################################################\n\n# ----------------------------------------------------------------------\n# | Document modes                                                     |\n# ----------------------------------------------------------------------\n\n# Force Internet Explorer 8/9/10 to render pages in the highest mode\n# available in the various cases when it may not.\n#\n# https://hsivonen.fi/doctype/#ie8\n#\n# (!) Starting with Internet Explorer 11, document modes are deprecated.\n# If your business still relies on older web apps and services that were\n# designed for older versions of Internet Explorer, you might want to\n# consider enabling `Enterprise Mode` throughout your company.\n#\n# https://msdn.microsoft.com/en-us/library/ie/bg182625.aspx#docmode\n# http://blogs.msdn.com/b/ie/archive/2014/04/02/stay-up-to-date-with-enterprise-mode-for-internet-explorer-11.aspx\n\n<IfModule mod_headers.c>\n\n    Header set X-UA-Compatible \"IE=edge\"\n\n    # `mod_headers` cannot match based on the content-type, however,\n    # the `X-UA-Compatible` response header should be send only for\n    # HTML documents and not for the other resources.\n\n    <FilesMatch \"\\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|webmanifest|woff2?|xloc|xml|xpi)$\">\n        Header unset X-UA-Compatible\n    </FilesMatch>\n\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Iframes cookies                                                    |\n# ----------------------------------------------------------------------\n\n# Allow cookies to be set from iframes in Internet Explorer.\n#\n# https://msdn.microsoft.com/en-us/library/ms537343.aspx\n# http://www.w3.org/TR/2000/CR-P3P-20001215/\n\n# <IfModule mod_headers.c>\n#     Header set P3P \"policyref=\\\"/w3c/p3p.xml\\\", CP=\\\"IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT\\\"\"\n# </IfModule>\n\n\n# ######################################################################\n# # MEDIA TYPES AND CHARACTER ENCODINGS                                #\n# ######################################################################\n\n# ----------------------------------------------------------------------\n# | Media types                                                        |\n# ----------------------------------------------------------------------\n\n# Serve resources with the proper media types (f.k.a. MIME types).\n#\n# https://www.iana.org/assignments/media-types/media-types.xhtml\n# https://httpd.apache.org/docs/current/mod/mod_mime.html#addtype\n\n<IfModule mod_mime.c>\n\n  # Data interchange\n\n    AddType application/atom+xml                        atom\n    AddType application/json                            json map topojson\n    AddType application/ld+json                         jsonld\n    AddType application/rss+xml                         rss\n    AddType application/vnd.geo+json                    geojson\n    AddType application/xml                             rdf xml\n\n\n  # JavaScript\n\n    # Normalize to standard type.\n    # https://tools.ietf.org/html/rfc4329#section-7.2\n\n    AddType application/javascript                      js\n\n\n  # Manifest files\n\n    AddType application/manifest+json                   webmanifest\n    AddType application/x-web-app-manifest+json         webapp\n    AddType text/cache-manifest                         appcache\n\n\n  # Media files\n\n    AddType audio/mp4                                   f4a f4b m4a\n    AddType audio/ogg                                   oga ogg opus\n    AddType image/bmp                                   bmp\n    AddType image/svg+xml                               svg svgz\n    AddType image/webp                                  webp\n    AddType video/mp4                                   f4v f4p m4v mp4\n    AddType video/ogg                                   ogv\n    AddType video/webm                                  webm\n    AddType video/x-flv                                 flv\n\n    # Serving `.ico` image files with a different media type\n    # prevents Internet Explorer from displaying then as images:\n    # https://github.com/h5bp/html5-boilerplate/commit/37b5fec090d00f38de64b591bcddcb205aadf8ee\n\n    AddType image/x-icon                                cur ico\n\n\n  # Web fonts\n\n    AddType application/font-woff                       woff\n    AddType application/font-woff2                      woff2\n    AddType application/vnd.ms-fontobject               eot\n\n    # Browsers usually ignore the font media types and simply sniff\n    # the bytes to figure out the font type.\n    # https://mimesniff.spec.whatwg.org/#matching-a-font-type-pattern\n    #\n    # However, Blink and WebKit based browsers will show a warning\n    # in the console if the following font types are served with any\n    # other media types.\n\n    AddType application/x-font-ttf                      ttc ttf\n    AddType font/opentype                               otf\n\n\n  # Other\n\n    AddType application/octet-stream                    safariextz\n    AddType application/x-bb-appworld                   bbaw\n    AddType application/x-chrome-extension              crx\n    AddType application/x-opera-extension               oex\n    AddType application/x-xpinstall                     xpi\n    AddType text/vcard                                  vcard vcf\n    AddType text/vnd.rim.location.xloc                  xloc\n    AddType text/vtt                                    vtt\n    AddType text/x-component                            htc\n\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Character encodings                                                |\n# ----------------------------------------------------------------------\n\n# Serve all resources labeled as `text/html` or `text/plain`\n# with the media type `charset` parameter set to `UTF-8`.\n#\n# https://httpd.apache.org/docs/current/mod/core.html#adddefaultcharset\n\nAddDefaultCharset utf-8\n\n# - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n# Serve the following file types with the media type `charset`\n# parameter set to `UTF-8`.\n#\n# https://httpd.apache.org/docs/current/mod/mod_mime.html#addcharset\n\n<IfModule mod_mime.c>\n    AddCharset utf-8 .atom \\\n                     .bbaw \\\n                     .css \\\n                     .geojson \\\n                     .js \\\n                     .json \\\n                     .jsonld \\\n                     .manifest \\\n                     .rdf \\\n                     .rss \\\n                     .topojson \\\n                     .vtt \\\n                     .webapp \\\n                     .webmanifest \\\n                     .xloc \\\n                     .xml\n</IfModule>\n\n\n# ######################################################################\n# # REWRITES                                                           #\n# ######################################################################\n\n# ----------------------------------------------------------------------\n# | Rewrite engine                                                     |\n# ----------------------------------------------------------------------\n\n# (1) Turn on the rewrite engine (this is necessary in order for\n#     the `RewriteRule` directives to work).\n#\n#     https://httpd.apache.org/docs/current/mod/mod_rewrite.html#RewriteEngine\n#\n# (2) Enable the `FollowSymLinks` option if it isn't already.\n#\n#     https://httpd.apache.org/docs/current/mod/core.html#options\n#\n# (3) If your web host doesn't allow the `FollowSymlinks` option,\n#     you need to comment it out or remove it, and then uncomment\n#     the `Options +SymLinksIfOwnerMatch` line (4), but be aware\n#     of the performance impact.\n#\n#     https://httpd.apache.org/docs/current/misc/perf-tuning.html#symlinks\n#\n# (4) Some cloud hosting services will require you set `RewriteBase`.\n#\n#     https://www.rackspace.com/knowledge_center/frequently-asked-question/why-is-modrewrite-not-working-on-my-site\n#     https://httpd.apache.org/docs/current/mod/mod_rewrite.html#rewritebase\n#\n# (5) Depending on how your server is set up, you may also need to\n#     use the `RewriteOptions` directive to enable some options for\n#     the rewrite engine.\n#\n#     https://httpd.apache.org/docs/current/mod/mod_rewrite.html#rewriteoptions\n#\n# (6) Set %{ENV:PROTO} variable, to allow rewrites to redirect with the\n#     appropriate schema automatically (http or https).\n\n<IfModule mod_rewrite.c>\n\n    # (1)\n    RewriteEngine On\n\n    # (2)\n    Options +FollowSymlinks\n\n    # (3)\n    # Options +SymLinksIfOwnerMatch\n\n    # (4)\n    # RewriteBase /\n\n    # (5)\n    # RewriteOptions <options>\n\n    # (6)\n    RewriteCond %{HTTPS} =on\n    RewriteRule ^ - [env=proto:https]\n    RewriteCond %{HTTPS} !=on\n    RewriteRule ^ - [env=proto:http]\n\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Forcing `https://`                                                 |\n# ----------------------------------------------------------------------\n\n# Redirect from the `http://` to the `https://` version of the URL.\n# https://wiki.apache.org/httpd/RewriteHTTPToHTTPS\n\n# <IfModule mod_rewrite.c>\n#   RewriteEngine On\n#   RewriteCond %{HTTPS} !=on\n#   RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1 [R=301,L]\n# </IfModule>\n\n# ----------------------------------------------------------------------\n# | Suppressing / Forcing the `www.` at the beginning of URLs          |\n# ----------------------------------------------------------------------\n\n# The same content should never be available under two different\n# URLs, especially not with and without `www.` at the beginning.\n# This can cause SEO problems (duplicate content), and therefore,\n# you should choose one of the alternatives and redirect the other\n# one.\n#\n# By default `Option 1` (no `www.`) is activated.\n# http://no-www.org/faq.php?q=class_b\n#\n# If you would prefer to use `Option 2`, just comment out all the\n# lines from `Option 1` and uncomment the ones from `Option 2`.\n#\n# (!) NEVER USE BOTH RULES AT THE SAME TIME!\n\n# - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n# Option 1: rewrite www.example.com → example.com\n\n<IfModule mod_rewrite.c>\n    RewriteEngine On\n    RewriteCond %{HTTPS} !=on\n    RewriteCond %{HTTP_HOST} ^www\\.(.+)$ [NC]\n    RewriteRule ^ %{ENV:PROTO}://%1%{REQUEST_URI} [R=301,L]\n</IfModule>\n\n# - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n# Option 2: rewrite example.com → www.example.com\n#\n# Be aware that the following might not be a good idea if you use \"real\"\n# subdomains for certain parts of your website.\n\n# <IfModule mod_rewrite.c>\n#     RewriteEngine On\n#     RewriteCond %{HTTPS} !=on\n#     RewriteCond %{HTTP_HOST} !^www\\. [NC]\n#     RewriteCond %{SERVER_ADDR} !=127.0.0.1\n#     RewriteCond %{SERVER_ADDR} !=::1\n#     RewriteRule ^ %{ENV:PROTO}://www.%{HTTP_HOST}%{REQUEST_URI} [R=301,L]\n# </IfModule>\n\n\n# ######################################################################\n# # SECURITY                                                           #\n# ######################################################################\n\n# ----------------------------------------------------------------------\n# | Clickjacking                                                       |\n# ----------------------------------------------------------------------\n\n# Protect website against clickjacking.\n#\n# The example below sends the `X-Frame-Options` response header with\n# the value `DENY`, informing browsers not to display the content of\n# the web page in any frame.\n#\n# This might not be the best setting for everyone. You should read\n# about the other two possible values the `X-Frame-Options` header\n# field can have: `SAMEORIGIN` and `ALLOW-FROM`.\n# https://tools.ietf.org/html/rfc7034#section-2.1.\n#\n# Keep in mind that while you could send the `X-Frame-Options` header\n# for all of your website’s pages, this has the potential downside that\n# it forbids even non-malicious framing of your content (e.g.: when\n# users visit your website using a Google Image Search results page).\n#\n# Nonetheless, you should ensure that you send the `X-Frame-Options`\n# header for all pages that allow a user to make a state changing\n# operation (e.g: pages that contain one-click purchase links, checkout\n# or bank-transfer confirmation pages, pages that make permanent\n# configuration changes, etc.).\n#\n# Sending the `X-Frame-Options` header can also protect your website\n# against more than just clickjacking attacks:\n# https://cure53.de/xfo-clickjacking.pdf.\n#\n# https://tools.ietf.org/html/rfc7034\n# http://blogs.msdn.com/b/ieinternals/archive/2010/03/30/combating-clickjacking-with-x-frame-options.aspx\n# https://www.owasp.org/index.php/Clickjacking\n\n# <IfModule mod_headers.c>\n\n#     Header set X-Frame-Options \"DENY\"\n\n#     # `mod_headers` cannot match based on the content-type, however,\n#     # the `X-Frame-Options` response header should be send only for\n#     # HTML documents and not for the other resources.\n\n#     <FilesMatch \"\\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|webmanifest|woff2?|xloc|xml|xpi)$\">\n#         Header unset X-Frame-Options\n#     </FilesMatch>\n\n# </IfModule>\n\n# ----------------------------------------------------------------------\n# | Content Security Policy (CSP)                                      |\n# ----------------------------------------------------------------------\n\n# Mitigate the risk of cross-site scripting and other content-injection\n# attacks.\n#\n# This can be done by setting a `Content Security Policy` which\n# whitelists trusted sources of content for your website.\n#\n# The example header below allows ONLY scripts that are loaded from\n# the current website's origin (no inline scripts, no CDN, etc).\n# That almost certainly won't work as-is for your website!\n#\n# To make things easier, you can use an online CSP header generator\n# such as: http://cspisawesome.com/.\n#\n# http://content-security-policy.com/\n# http://www.html5rocks.com/en/tutorials/security/content-security-policy/\n# http://www.w3.org/TR/CSP11/).\n\n# <IfModule mod_headers.c>\n\n#     Header set Content-Security-Policy \"script-src 'self'; object-src 'self'\"\n\n#     # `mod_headers` cannot match based on the content-type, however,\n#     # the `Content-Security-Policy` response header should be send\n#     # only for HTML documents and not for the other resources.\n\n#     <FilesMatch \"\\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|webmanifest|woff2?|xloc|xml|xpi)$\">\n#         Header unset Content-Security-Policy\n#     </FilesMatch>\n\n# </IfModule>\n\n# ----------------------------------------------------------------------\n# | File access                                                        |\n# ----------------------------------------------------------------------\n\n# Block access to directories without a default document.\n#\n# You should leave the following uncommented, as you shouldn't allow\n# anyone to surf through every directory on your server (which may\n# includes rather private places such as the CMS's directories).\n\n<IfModule mod_autoindex.c>\n    Options -Indexes\n</IfModule>\n\n# - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n# Block access to all hidden files and directories with the exception of\n# the visible content from within the `/.well-known/` hidden directory.\n#\n# These types of files usually contain user preferences or the preserved\n# state of an utility, and can include rather private places like, for\n# example, the `.git` or `.svn` directories.\n#\n# The `/.well-known/` directory represents the standard (RFC 5785) path\n# prefix for \"well-known locations\" (e.g.: `/.well-known/manifest.json`,\n# `/.well-known/keybase.txt`), and therefore, access to its visible\n# content should not be blocked.\n#\n# https://www.mnot.net/blog/2010/04/07/well-known\n# https://tools.ietf.org/html/rfc5785\n\n<IfModule mod_rewrite.c>\n    RewriteEngine On\n    RewriteCond %{REQUEST_URI} \"!(^|/)\\.well-known/([^./]+./?)+$\" [NC]\n    RewriteCond %{SCRIPT_FILENAME} -d [OR]\n    RewriteCond %{SCRIPT_FILENAME} -f\n    RewriteRule \"(^|/)\\.\" - [F]\n</IfModule>\n\n# - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n# Block access to files that can expose sensitive information.\n#\n# By default, block access to backup and source files that may be\n# left by some text editors and can pose a security risk when anyone\n# has access to them.\n#\n# http://feross.org/cmsploit/\n#\n# (!) Update the `<FilesMatch>` regular expression from below to\n# include any files that might end up on your production server and\n# can expose sensitive information about your website. These files may\n# include: configuration files, files that contain metadata about the\n# project (e.g.: project dependencies), build scripts, etc..\n\n<FilesMatch \"(^#.*#|\\.(bak|conf|dist|fla|in[ci]|log|psd|sh|sql|sw[op])|~)$\">\n\n    # Apache < 2.3\n    <IfModule !mod_authz_core.c>\n        Order allow,deny\n        Deny from all\n        Satisfy All\n    </IfModule>\n\n    # Apache ≥ 2.3\n    <IfModule mod_authz_core.c>\n        Require all denied\n    </IfModule>\n\n</FilesMatch>\n\n# ----------------------------------------------------------------------\n# | HTTP Strict Transport Security (HSTS)                              |\n# ----------------------------------------------------------------------\n\n# Force client-side SSL redirection.\n#\n# If a user types `example.com` in their browser, even if the server\n# redirects them to the secure version of the website, that still leaves\n# a window of opportunity (the initial HTTP connection) for an attacker\n# to downgrade or redirect the request.\n#\n# The following header ensures that browser will ONLY connect to your\n# server via HTTPS, regardless of what the users type in the browser's\n# address bar.\n#\n# (!) Remove the `includeSubDomains` optional directive if the website's\n# subdomains are not using HTTPS.\n#\n# http://www.html5rocks.com/en/tutorials/security/transport-layer-security/\n# https://tools.ietf.org/html/draft-ietf-websec-strict-transport-sec-14#section-6.1\n# http://blogs.msdn.com/b/ieinternals/archive/2014/08/18/hsts-strict-transport-security-attacks-mitigations-deployment-https.aspx\n\n# <IfModule mod_headers.c>\n#     Header always set Strict-Transport-Security \"max-age=16070400; includeSubDomains\"\n# </IfModule>\n\n# ----------------------------------------------------------------------\n# | Reducing MIME type security risks                                  |\n# ----------------------------------------------------------------------\n\n# Prevent some browsers from MIME-sniffing the response.\n#\n# This reduces exposure to drive-by download attacks and cross-origin\n# data leaks, and should be left uncommented, especially if the server\n# is serving user-uploaded content or content that could potentially be\n# treated as executable by the browser.\n#\n# http://www.slideshare.net/hasegawayosuke/owasp-hasegawa\n# http://blogs.msdn.com/b/ie/archive/2008/07/02/ie8-security-part-v-comprehensive-protection.aspx\n# https://msdn.microsoft.com/en-us/library/ie/gg622941.aspx\n# https://mimesniff.spec.whatwg.org/\n\n<IfModule mod_headers.c>\n    Header set X-Content-Type-Options \"nosniff\"\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Reflected Cross-Site Scripting (XSS) attacks                       |\n# ----------------------------------------------------------------------\n\n# (1) Try to re-enable the cross-site scripting (XSS) filter built\n#     into most web browsers.\n#\n#     The filter is usually enabled by default, but in some cases it\n#     may be disabled by the user. However, in Internet Explorer for\n#     example, it can be re-enabled just by sending the\n#     `X-XSS-Protection` header with the value of `1`.\n#\n# (2) Prevent web browsers from rendering the web page if a potential\n#     reflected (a.k.a non-persistent) XSS attack is detected by the\n#     filter.\n#\n#     By default, if the filter is enabled and browsers detect a\n#     reflected XSS attack, they will attempt to block the attack\n#     by making the smallest possible modifications to the returned\n#     web page.\n#\n#     Unfortunately, in some browsers (e.g.: Internet Explorer),\n#     this default behavior may allow the XSS filter to be exploited,\n#     thereby, it's better to inform browsers to prevent the rendering\n#     of the page altogether, instead of attempting to modify it.\n#\n#     https://hackademix.net/2009/11/21/ies-xss-filter-creates-xss-vulnerabilities\n#\n# (!) Do not rely on the XSS filter to prevent XSS attacks! Ensure that\n#     you are taking all possible measures to prevent XSS attacks, the\n#     most obvious being: validating and sanitizing your website's inputs.\n#\n# http://blogs.msdn.com/b/ie/archive/2008/07/02/ie8-security-part-iv-the-xss-filter.aspx\n# http://blogs.msdn.com/b/ieinternals/archive/2011/01/31/controlling-the-internet-explorer-xss-filter-with-the-x-xss-protection-http-header.aspx\n# https://www.owasp.org/index.php/Cross-site_Scripting_%28XSS%29\n\n# <IfModule mod_headers.c>\n\n#     #                           (1)    (2)\n#     Header set X-XSS-Protection \"1; mode=block\"\n\n#     # `mod_headers` cannot match based on the content-type, however,\n#     # the `X-XSS-Protection` response header should be send only for\n#     # HTML documents and not for the other resources.\n\n#     <FilesMatch \"\\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|webmanifest|woff2?|xloc|xml|xpi)$\">\n#         Header unset X-XSS-Protection\n#     </FilesMatch>\n\n# </IfModule>\n\n# ----------------------------------------------------------------------\n# | Server-side technology information                                 |\n# ----------------------------------------------------------------------\n\n# Remove the `X-Powered-By` response header that:\n#\n#  * is set by some frameworks and server-side languages\n#    (e.g.: ASP.NET, PHP), and its value contains information\n#    about them (e.g.: their name, version number)\n#\n#  * doesn't provide any value as far as users are concern,\n#    and in some cases, the information provided by it can\n#    be used by attackers\n#\n# (!) If you can, you should disable the `X-Powered-By` header from the\n# language / framework level (e.g.: for PHP, you can do that by setting\n# `expose_php = off` in `php.ini`)\n#\n# https://php.net/manual/en/ini.core.php#ini.expose-php\n\n<IfModule mod_headers.c>\n    Header unset X-Powered-By\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Server software information                                        |\n# ----------------------------------------------------------------------\n\n# Prevent Apache from adding a trailing footer line containing\n# information about the server to the server-generated documents\n# (e.g.: error messages, directory listings, etc.)\n#\n# https://httpd.apache.org/docs/current/mod/core.html#serversignature\n\nServerSignature Off\n\n# - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n# Prevent Apache from sending in the `Server` response header its\n# exact version number, the description of the generic OS-type or\n# information about its compiled-in modules.\n#\n# (!) The `ServerTokens` directive will only work in the main server\n# configuration file, so don't try to enable it in the `.htaccess` file!\n#\n# https://httpd.apache.org/docs/current/mod/core.html#servertokens\n\n#ServerTokens Prod\n\n\n# ######################################################################\n# # WEB PERFORMANCE                                                    #\n# ######################################################################\n\n# ----------------------------------------------------------------------\n# | Compression                                                        |\n# ----------------------------------------------------------------------\n\n<IfModule mod_deflate.c>\n\n    # Force compression for mangled `Accept-Encoding` request headers\n    # https://developer.yahoo.com/blogs/ydn/pushing-beyond-gzipping-25601.html\n\n    <IfModule mod_setenvif.c>\n        <IfModule mod_headers.c>\n            SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\\s*,?\\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding\n            RequestHeader append Accept-Encoding \"gzip,deflate\" env=HAVE_Accept-Encoding\n        </IfModule>\n    </IfModule>\n\n    # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n    # Compress all output labeled with one of the following media types.\n    #\n    # (!) For Apache versions below version 2.3.7 you don't need to\n    # enable `mod_filter` and can remove the `<IfModule mod_filter.c>`\n    # and `</IfModule>` lines as `AddOutputFilterByType` is still in\n    # the core directives.\n    #\n    # https://httpd.apache.org/docs/current/mod/mod_filter.html#addoutputfilterbytype\n\n    <IfModule mod_filter.c>\n        AddOutputFilterByType DEFLATE \"application/atom+xml\" \\\n                                      \"application/javascript\" \\\n                                      \"application/json\" \\\n                                      \"application/ld+json\" \\\n                                      \"application/manifest+json\" \\\n                                      \"application/rdf+xml\" \\\n                                      \"application/rss+xml\" \\\n                                      \"application/schema+json\" \\\n                                      \"application/vnd.geo+json\" \\\n                                      \"application/vnd.ms-fontobject\" \\\n                                      \"application/x-font-ttf\" \\\n                                      \"application/x-javascript\" \\\n                                      \"application/x-web-app-manifest+json\" \\\n                                      \"application/xhtml+xml\" \\\n                                      \"application/xml\" \\\n                                      \"font/eot\" \\\n                                      \"font/opentype\" \\\n                                      \"image/bmp\" \\\n                                      \"image/svg+xml\" \\\n                                      \"image/vnd.microsoft.icon\" \\\n                                      \"image/x-icon\" \\\n                                      \"text/cache-manifest\" \\\n                                      \"text/css\" \\\n                                      \"text/html\" \\\n                                      \"text/javascript\" \\\n                                      \"text/plain\" \\\n                                      \"text/vcard\" \\\n                                      \"text/vnd.rim.location.xloc\" \\\n                                      \"text/vtt\" \\\n                                      \"text/x-component\" \\\n                                      \"text/x-cross-domain-policy\" \\\n                                      \"text/xml\"\n\n    </IfModule>\n\n    # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -\n\n    # Map the following filename extensions to the specified\n    # encoding type in order to make Apache serve the file types\n    # with the appropriate `Content-Encoding` response header\n    # (do note that this will NOT make Apache compress them!).\n    #\n    # If these files types would be served without an appropriate\n    # `Content-Enable` response header, client applications (e.g.:\n    # browsers) wouldn't know that they first need to uncompress\n    # the response, and thus, wouldn't be able to understand the\n    # content.\n    #\n    # https://httpd.apache.org/docs/current/mod/mod_mime.html#addencoding\n\n    <IfModule mod_mime.c>\n        AddEncoding gzip              svgz\n    </IfModule>\n\n</IfModule>\n\n# ----------------------------------------------------------------------\n# | Content transformation                                             |\n# ----------------------------------------------------------------------\n\n# Prevent intermediate caches or proxies (e.g.: such as the ones\n# used by mobile network providers) from modifying the website's\n# content.\n#\n# https://tools.ietf.org/html/rfc2616#section-14.9.5\n#\n# (!) If you are using `mod_pagespeed`, please note that setting\n# the `Cache-Control: no-transform` response header will prevent\n# `PageSpeed` from rewriting `HTML` files, and, if the\n# `ModPagespeedDisableRewriteOnNoTransform` directive isn't set\n# to `off`, also from rewriting other resources.\n#\n# https://developers.google.com/speed/pagespeed/module/configuration#notransform\n\n# <IfModule mod_headers.c>\n#     Header merge Cache-Control \"no-transform\"\n# </IfModule>\n\n# ----------------------------------------------------------------------\n# | ETags                                                              |\n# ----------------------------------------------------------------------\n\n# Remove `ETags` as resources are sent with far-future expires headers.\n#\n# https://developer.yahoo.com/performance/rules.html#etags\n# https://tools.ietf.org/html/rfc7232#section-2.3\n\n# `FileETag None` doesn't work in all cases.\n<IfModule mod_headers.c>\n    Header unset ETag\n</IfModule>\n\nFileETag None\n\n# ----------------------------------------------------------------------\n# | Expires headers                                                    |\n# ----------------------------------------------------------------------\n\n# Serve resources with far-future expires headers.\n#\n# (!) If you don't control versioning with filename-based\n# cache busting, you should consider lowering the cache times\n# to something like one week.\n#\n# https://httpd.apache.org/docs/current/mod/mod_expires.html\n\n<IfModule mod_expires.c>\n\n    ExpiresActive on\n    ExpiresDefault                                      \"access plus 1 month\"\n\n  # CSS\n\n    ExpiresByType text/css                              \"access plus 1 year\"\n\n\n  # Data interchange\n\n    ExpiresByType application/atom+xml                  \"access plus 1 hour\"\n    ExpiresByType application/rdf+xml                   \"access plus 1 hour\"\n    ExpiresByType application/rss+xml                   \"access plus 1 hour\"\n\n    ExpiresByType application/json                      \"access plus 0 seconds\"\n    ExpiresByType application/ld+json                   \"access plus 0 seconds\"\n    ExpiresByType application/schema+json               \"access plus 0 seconds\"\n    ExpiresByType application/vnd.geo+json              \"access plus 0 seconds\"\n    ExpiresByType application/xml                       \"access plus 0 seconds\"\n    ExpiresByType text/xml                              \"access plus 0 seconds\"\n\n\n  # Favicon (cannot be renamed!) and cursor images\n\n    ExpiresByType image/vnd.microsoft.icon              \"access plus 1 week\"\n    ExpiresByType image/x-icon                          \"access plus 1 week\"\n\n  # HTML\n\n    ExpiresByType text/html                             \"access plus 0 seconds\"\n\n\n  # JavaScript\n\n    ExpiresByType application/javascript                \"access plus 1 year\"\n    ExpiresByType application/x-javascript              \"access plus 1 year\"\n    ExpiresByType text/javascript                       \"access plus 1 year\"\n\n\n  # Manifest files\n\n    ExpiresByType application/manifest+json             \"access plus 1 week\"\n    ExpiresByType application/x-web-app-manifest+json   \"access plus 0 seconds\"\n    ExpiresByType text/cache-manifest                   \"access plus 0 seconds\"\n\n\n  # Media files\n\n    ExpiresByType audio/ogg                             \"access plus 1 month\"\n    ExpiresByType image/bmp                             \"access plus 1 month\"\n    ExpiresByType image/gif                             \"access plus 1 month\"\n    ExpiresByType image/jpeg                            \"access plus 1 month\"\n    ExpiresByType image/png                             \"access plus 1 month\"\n    ExpiresByType image/svg+xml                         \"access plus 1 month\"\n    ExpiresByType image/webp                            \"access plus 1 month\"\n    ExpiresByType video/mp4                             \"access plus 1 month\"\n    ExpiresByType video/ogg                             \"access plus 1 month\"\n    ExpiresByType video/webm                            \"access plus 1 month\"\n\n\n  # Web fonts\n\n    # Embedded OpenType (EOT)\n    ExpiresByType application/vnd.ms-fontobject         \"access plus 1 month\"\n    ExpiresByType font/eot                              \"access plus 1 month\"\n\n    # OpenType\n    ExpiresByType font/opentype                         \"access plus 1 month\"\n\n    # TrueType\n    ExpiresByType application/x-font-ttf                \"access plus 1 month\"\n\n    # Web Open Font Format (WOFF) 1.0\n    ExpiresByType application/font-woff                 \"access plus 1 month\"\n    ExpiresByType application/x-font-woff               \"access plus 1 month\"\n    ExpiresByType font/woff                             \"access plus 1 month\"\n\n    # Web Open Font Format (WOFF) 2.0\n    ExpiresByType application/font-woff2                \"access plus 1 month\"\n\n\n  # Other\n\n    ExpiresByType text/x-cross-domain-policy            \"access plus 1 week\"\n\n</IfModule>\n\n\n# ##############################################################################\n# # OTHER REDIRECTS                                                            #\n# ##############################################################################\n\n# ----------------------------------------------------------------------\n# Block site referrers\n# ----------------------------------------------------------------------\n\nRewriteEngine on\nRewriteCond %{HTTP_REFERER} http\\://mademistakes\\.com/11m\\.php [NC]\nRewriteRule .* - [F]\n\n# ----------------------------------------------------------------------\n# Remove index.html\n# ----------------------------------------------------------------------\n\n# If it's a request to index(.html)\nRewriteCond %{THE_REQUEST} \\ /(.+/)?index(\\.html)?(\\?.*)?\\  [NC]\n# Remove it.\nRewriteRule ^(.+/)?index(\\.html)?$ /%1 [R=301,L]\n\n# ----------------------------------------------------------------------\n# Remove .html extensions\n# ----------------------------------------------------------------------\n\n# If it's a request from a browser, not an internal request by Apache/mod_rewrite.\nRewriteCond %{ENV:REDIRECT_STATUS} ^$\n# And the request has a HTML extension. Redirect to remove it.\nRewriteRule ^(.+)\\.html$ /$1 [R=301,L]\n\n# If the request exists with a .html extension.\nRewriteCond %{SCRIPT_FILENAME}.html -f\n# And there is no trailing slash, rewrite to add the .html extension.\nRewriteRule [^/]$ %{REQUEST_URI}.html [QSA,L]\n\n# ----------------------------------------------------------------------\n# Remove trailing double slashes //\n# ----------------------------------------------------------------------\n\nRewriteCond %{REQUEST_URI} ^(.*?)(?:/){2,}$\nRewriteRule . $1/ [R=301,L]\n\n# ----------------------------------------------------------------------\n# Feed redirects\n# ----------------------------------------------------------------------\n\nredirect 301 /atom/ https://mademistakes.com/atom.xml\nredirect 301 /rss/ https://mademistakes.com/atom.xml\nredirect 301 /feed.xml https://mademistakes.com/atom.xml\nredirect 301 /everything.xml https://mademistakes.com/atom.xml\nredirect 301 /articles-feed.xml https://mademistakes.com/articles.xml\nredirect 301 /mastering-paper-feed.xml https://mademistakes.com/mastering-paper.xml\nredirect 301 /paperfaces-feed.xml https://mademistakes.com/paperfaces.xml\n\n# ----------------------------------------------------------------------\n# Sitemap redirects\n# ----------------------------------------------------------------------\n\nredirect 301 /sitemap.xml.gz https://mademistakes.com/sitemap.xml\nredirect 301 /post-sitemap.xml https://mademistakes.com/sitemap.xml\nredirect 301 /category-sitemap.xml https://mademistakes.com/sitemap.xml\n\n# ----------------------------------------------------------------------\n# Page redirects\n# ----------------------------------------------------------------------\n\nRedirectMatch permanent /lifestream https://mademistakes.com/articles/\nredirect 301 /about-made-mistakes/ https://mademistakes.com/about/\nredirect 301 /articles/face https://mademistakes.com/articles/paperfaces-ipad-portrait-project/\nredirect 301 /articles/faces-made-with-paper-ipad https://mademistakes.com/articles/paperfaces-ipad-portrait-project/\nredirect 301 /articles/paperfaces-portrait-gallery https://mademistakes.com/paperfaces/\nredirect 301 /paperfaces/slave-leia-jabba-the-hutt https://mademistakes.com/paperfaces/slave-leia-jabba-the-hutt-portrait/\nredirect 301 /paperfaces/lorenzo-raffio-portrait/ https://mademistakes.com/paperfaces/lorenzo-portrait/\nredirect 301 /paperfaces/lorenzo-raffio-portrait https://mademistakes.com/paperfaces/lorenzo-portrait/\nredirect 301 /tags https://mademistakes.com/tag/\nredirect 301 /tag/baby/ https://mademistakes.com/tag/twins/\nredirect 301 /articles/mastering-paper-53-guide https://mademistakes.com/mastering-paper/\nredirect 301 /works https://mademistakes.com/work/\nredirect 301 /minimal-mistakes https://mademistakes.com/work/minimal-mistakes-jekyll-theme/\nredirect 301 /so-simple https://mademistakes.com/work/so-simple-jekyll-theme/\nredirect 301 /hpstr https://mademistakes.com/work/hpstr-jekyll-theme/\nredirect 301 /articles/paper-53-introduction https://mademistakes.com/mastering-paper/introduction-tool-guide/\nredirect 301 /articles/paper-53-drawing-trees https://mademistakes.com/mastering-paper/drawing-trees/\nredirect 301 /articles/paper-53-drawing-sky-clouds https://mademistakes.com/mastering-paper/drawing-clouds/\nredirect 301 /articles/paper-53-drawing-water-waves https://mademistakes.com/mastering-paper/drawing-water/\nredirect 301 /articles/paper-53-book-review https://mademistakes.com/mastering-paper/moleskine-book/\nredirect 301 /articles/paper-53-drawing-textures https://mademistakes.com/mastering-paper/drawing-textures/\nredirect 301 /articles/paper-53-basics https://mademistakes.com/mastering-paper/basics/\nredirect 301 /mastering-paper/basic https://mademistakes.com/mastering-paper/basics/\nredirect 301 /articles/madewithpaper-drawing-guide https://mademistakes.com/mastering-paper/short-guide/\nredirect 301 /articles/how-to-draw-hair-paper-53 https://mademistakes.com/mastering-paper/drawing-hair/\nredirect 301 /articles/drawing-faces-paper-53 https://mademistakes.com/mastering-paper/drawing-blank-faces/\nredirect 301 /articles/blend-first-look https://mademistakes.com/mastering-paper/pencil-first-look/\nredirect 301 /articles/blend-first-look/ https://mademistakes.com/mastering-paper/pencil-first-look/\nredirect 301 /articles/contour-drawing https://mademistakes.com/mastering-paper/contour-drawing/\nredirect 301 /articles/remix-me https://mademistakes.com/mastering-paper/mix/\nredirect 301 /articles/pencil-53-review https://mademistakes.com/mastering-paper/pencil-53-review/\nredirect 301 /drawing-textures https://mademistakes.com/mastering-paper/drawing-textures/\nredirect 301 /blog/those-city-folk-in-animal-crossing-still-love-the-gossip https://mademistakes.com/articles/animal-crossing-city-folk-impressions/\nredirect 301 /code-highlighting-post/ https://mademistakes.com/work/jekyll-themes/\nredirect 301 /tag/fiftythree https://mademistakes.com/tag/paper-by-53/\nredirect 301 /tag/fiftythree/ https://mademistakes.com/tag/paper-by-53/\nredirect 301 /portraits https://mademistakes.com/paperfaces/\nredirect 301 /portraits/ https://mademistakes.com/paperfaces/\nredirect 301 /articles/skinny-bones-jekyll/ https://mademistakes.com/work/skinny-bones-jekyll/\nredirect 301 /articles/skinny-bones-jekyll https://mademistakes.com/work/skinny-bones-jekyll/\nredirect 301 /articles/hpstr-jekyll-theme/ https://mademistakes.com/work/hpstr-jekyll-theme/\nredirect 301 /articles/so-simple-jekyll-theme/ https://mademistakes.com/work/so-simple-jekyll-theme/\nredirect 301 /articles/so-simple-jekyll-theme https://mademistakes.com/work/so-simple-jekyll-theme/\nredirect 301 /articles/minimal-mistakes-jekyll-theme/ https://mademistakes.com/work/minimal-mistakes-jekyll-theme/\nredirect 301 /articles/minimal-mistakes-jekyll-theme https://mademistakes.com/work/minimal-mistakes-jekyll-theme/\nredirect 301 /articles/pogo-connect-smart-pen/ https://mademistakes.com/mastering-paper/pogo-connect-smart-pen/\nredirect 301 /articles/pogo-connect-sensitivity/ https://mademistakes.com/mastering-paper/pogo-connect-sensitivity/\nredirect 301 /blog/ https://mademistakes.com/articles/\nredirect 301 /blog https://mademistakes.com/articles/\nredirect 301 /subscribe https://mademistakes.com/support/\nredirect 301 /subscribe/ https://mademistakes.com/support/\nredirect 301 /procreate-paintings/jenyy-x-portrait/ https://mademistakes.com/procreate-paintings/jenny-x-portrait/\n"
  },
  {
    "path": "src/_colors/colors-neutral.html",
    "content": "---\ntitle: \"Neutral Colors\"\ntype: colors\nscss: src/assets/stylesheets/_variables.scss\nusage: \"Base set used to mix tints and tones.\"\n---\n\n<div class=\"color__tile color__tile--white-bg\">\n  <code class=\"color__name\">white</code>\n</div>\n\n<div class=\"color__tile color__tile--black-bg\">\n  <code class=\"color__name\">black</code>\n</div>\n"
  },
  {
    "path": "src/_colors/colors-secondary.html",
    "content": "---\ntitle: \"Secondary Colors\"\ntype: colors\nscss: src/assets/stylesheets/_variables.scss\nusage: \"Additional colors commonly used for buttons and notices.\"\n---\n\n<div class=\"color__tile color__tile--accent\">\n  <code class=\"color__name\">$accent-color</code>\n</div>\n\n<div class=\"color__tile color__tile--primary\">\n  <code class=\"color__name\">$primary-color</code>\n</div>\n\n<div class=\"color__tile color__tile--success\">\n  <code class=\"color__name\">$success-color</code>\n</div>\n\n<div class=\"color__tile color__tile--warning\">\n  <code class=\"color__name\">$warning-color</code>\n</div>\n\n<div class=\"color__tile color__tile--danger\">\n  <code class=\"color__name\">$danger-color</code>\n</div>\n\n<div class=\"color__tile color__tile--info\">\n  <code class=\"color__name\">$info-color</code>\n</div>\n"
  },
  {
    "path": "src/_colors/colors-social-brand.html",
    "content": "---\ntitle: \"Social Brand Colors\"\ntype: colors\nscss: src/assets/stylesheets/_variables.scss\nusage: \"Social media brand colors.\"\n---\n\n<div class=\"color__tile color__tile--facebook\">\n  <code class=\"color__name\">$facebook-color</code>\n</div>\n\n<div class=\"color__tile color__tile--flickr\">\n  <code class=\"color__name\">$flickr-color</code>\n</div>\n\n<div class=\"color__tile color__tile--github\">\n  <code class=\"color__name\">$github-color</code>\n</div>\n\n<div class=\"color__tile color__tile--google-plus\">\n  <code class=\"color__name\">$google-plus-color</code>\n</div>\n\n<div class=\"color__tile color__tile--instagram\">\n  <code class=\"color__name\">$instagram-color</code>\n</div>\n\n<div class=\"color__tile color__tile--rss\">\n  <code class=\"color__name\">$rss-color</code>\n</div>\n\n<div class=\"color__tile color__tile--twitter\">\n  <code class=\"color__name\">$twitter-color</code>\n</div>\n\n<div class=\"color__tile color__tile--youtube\">\n  <code class=\"color__name\">$youtube-color</code>\n</div>\n"
  },
  {
    "path": "src/_components/buttons-block.html",
    "content": "---\ntitle: \"Block Level Buttons\"\ntype: buttons\nscss:\nusage: \"Buttons that span the width of their parent container.\"\n---\n\n<a href=\"#\" class=\"btn btn--block\">Block Level Button</a>\n<button class=\"btn btn--block\"><svg class=\"icon\"><use xlink:href=\"#icon-comments\"></use></svg> View Comments</button>\n"
  },
  {
    "path": "src/_components/buttons-danger.html",
    "content": "---\ntitle: \"Danger Button\"\ntype: buttons\nscss:\nusage:\n---\n\n<a href=\"#\" class=\"btn btn--danger\">Danger</a>\n"
  },
  {
    "path": "src/_components/buttons-default.html",
    "content": "---\ntitle: \"Default Button\"\ntype: buttons\nscss:\nusage:\n---\n\n<a href=\"#\" class=\"btn\">Default</a>\n"
  },
  {
    "path": "src/_components/buttons-disabled.html",
    "content": "---\ntitle: \"Disabled Button\"\ntype: buttons\nscss:\nusage:\n---\n\n<a href=\"#\" class=\"btn btn--disabled\">Disabled</a>\n"
  },
  {
    "path": "src/_components/buttons-info.html",
    "content": "---\ntitle: \"Information Button\"\ntype: buttons\nscss:\nusage:\n---\n\n<a href=\"#\" class=\"btn btn--info\">Information</a>\n"
  },
  {
    "path": "src/_components/buttons-inverse.html",
    "content": "---\ntitle: \"Inverse Button\"\ntype: buttons\nscss:\nusage: \"On dark backgrounds.\"\n---\n\n<a href=\"#\" class=\"btn btn--inverse\">Inverse</a>\n"
  },
  {
    "path": "src/_components/buttons-success.html",
    "content": "---\ntitle: \"Success Button\"\ntype: buttons\nscss:\nusage:\n---\n\n<a href=\"#\" class=\"btn btn--success\">Success</a>\n"
  },
  {
    "path": "src/_components/buttons-warning.html",
    "content": "---\ntitle: \"Warning Button\"\ntype: buttons\nscss:\nusage:\n---\n\n<a href=\"#\" class=\"btn btn--warning\">Warning</a>\n"
  },
  {
    "path": "src/_components/forms-paypal.html",
    "content": "---\ntitle: \"PayPal Form\"\ntype: forms\nscss:\nusage: \"Order form using PayPal's API.\"\n---\n\n<fieldset>\n  <form action=\"#\" method=\"post\" target=\"_top\">\n    <input type=\"hidden\" name=\"cmd\" value=\"_s-xclick\">\n    <input type=\"hidden\" name=\"hosted_button_id\" value=\"#\">\n    <input type=\"hidden\" name=\"on0\" value=\"Type of Drawing\">\n    <label style=\"margin:10px 0;\">Type of Drawing</label>\n    <select name=\"os0\" style=\"width: 100%;\">\n      <option value=\"One face - black and white\">One face - black and white</option>\n      <option value=\"One face - color\">One face - color</option>\n      <option value=\"Multiple faces - black and white\">Multiple faces - black and white</option>\n      <option value=\"Multiple faces - color\">Multiple faces - color</option>\n    </select>\n    <input type=\"hidden\" name=\"on1\" value=\"Portrait Reference URL\">\n    <label style=\"margin:10px 0;\">Portrait Reference URL</label>\n    <input type=\"text\" name=\"os1\" maxlength=\"200\">\n    <input type=\"hidden\" name=\"currency_code\" value=\"USD\">\n    <input type=\"submit\" value=\"Order Now\" class=\"btn\" name=\"submit\" style=\"margin:10px 0;\">\n  </form>\n</fieldset>\n"
  },
  {
    "path": "src/_components/forms-wufoo.html",
    "content": "---\ntitle: \"Wufoo Contact Form\"\ntype: forms\nscss:\nusage: \"Contact form using Wufoo's API.\"\n---\n\n<form id=\"form1\" name=\"form1\" class=\"page__form\" accept-charset=\"UTF-8\" autocomplete=\"off\" enctype=\"multipart/form-data\" method=\"post\" novalidate action=\"https://mademistakes.wufoo.com/forms/zr2w1zk1hbcjv0/#public\">\n  <ul>\n    <li id=\"foli7\">\n      <label id=\"title7\" for=\"Field7\">Name</label>\n      <input id=\"Field7\" name=\"Field7\" type=\"text\" maxlength=\"255\" />\n    </li>\n    <li id=\"foli2\">\n      <label id=\"title2\" for=\"Field2\">Email address<span id=\"req_2\" class=\"req\">*</span> <small>(will remain private)</small></label>\n      <input id=\"Field2\" name=\"Field2\" type=\"email\" spellcheck=\"false\" maxlength=\"255\" required />\n    </li>\n    <li id=\"foli1\">\n      <label id=\"title1\" for=\"Field1\">Message<span id=\"req_1\" class=\"req\">*</span></label>\n      <textarea id=\"Field1\" name=\"Field1\" spellcheck=\"true\" rows=\"10\" cols=\"50\" required></textarea>\n    </li>\n    <li id=\"foli10\">\n      <label id=\"title10\" for=\"Field10\">How'd you hear about my website?</label>\n      <input id=\"Field10\" name=\"Field10\" type=\"text\" maxlength=\"255\" />\n    </li>\n    <li>\n      <button id=\"saveForm\" name=\"saveForm\" class=\"btn btn--large\" type=\"submit\">Send Message</button>\n    </li>\n    <li class=\"hidden\">\n      <label for=\"comment\">Do Not Fill This Out</label>\n      <textarea name=\"comment\" id=\"comment\" rows=\"1\" cols=\"1\"></textarea>\n      <input type=\"hidden\" id=\"idstamp\" name=\"idstamp\" value=\"DXSyHZyBYpNZI+88LvVOKO8dSfd/5lyIeCQAXFVxeJY=\" />\n    </li>\n  </ul>\n</form>\n"
  },
  {
    "path": "src/_components/media-post-figures-2-col.html",
    "content": "---\ntitle: \"Main Content Figures (2 column)\"\ntype: media\nscss:\nusage: \"For displaying two related images side by side.\"\n---\n\n<figure class=\"gallery-2-col\">\n  <img src=\"{{ site.url }}/assets/images/paperfaces-remi-l-process-1-600.jpg\" alt=\"\">\n  <img src=\"{{ site.url }}/assets/images/paperfaces-remi-l-process-2-600.jpg\" alt=\"\">\n  <figcaption>Images in two columns.</figcaption>\n</figure>\n"
  },
  {
    "path": "src/_components/media-post-figures-3-col.html",
    "content": "---\ntitle: \"Main Content Figures (3 columns)\"\ntype: media\nscss:\nusage: \"Display three related images in a row.\"\n---\n\n<figure class=\"gallery-3-col\">\n  <img src=\"{{ site.url }}/assets/images/paperfaces-rosebuds-2-process-1-600.jpg\" alt=\"\">\n  <img src=\"{{ site.url }}/assets/images/paperfaces-rosebuds-2-process-2-600.jpg\" alt=\"\">\n  <img src=\"{{ site.url }}/assets/images/paperfaces-rosebuds-2-process-3-600.jpg\" alt=\"\">\n  <figcaption>Images in three columns.</figcaption>\n</figure>\n"
  },
  {
    "path": "src/_components/media-post-figures-palette.html",
    "content": "---\ntitle: \"Main Content Figures (Paper color swatches)\"\ntype: media\nscss:\nusage: \"Display 7 color swatches in a post that mimics Paper by FiftyThree's color palettes.\"\n---\n\n<figure>\n  <div class=\"palette\">\n    <div class=\"palette__row\">\n      <a href=\"{{ site.url }}/assets/images/paper-53-skin-color-1.jpg\"><img class=\"palette__swatch\" src=\"{{ site.url }}/assets/images/paper-53-skin-swatch-1.png\" alt=\"\"></a>\n      <a href=\"{{ site.url }}/assets/images/paper-53-skin-color-2.jpg\"><img class=\"palette__swatch\" src=\"{{ site.url }}/assets/images/paper-53-skin-swatch-2.png\" alt=\"\"></a>\n      <a href=\"{{ site.url }}/assets/images/paper-53-skin-color-3.jpg\"><img class=\"palette__swatch\" src=\"{{ site.url }}/assets/images/paper-53-skin-swatch-3.png\" alt=\"\"></a>\n    </div>\n\n    <div class=\"palette__row\">\n      <a href=\"{{ site.url }}/assets/images/paper-53-skin-color-4.jpg\"><img class=\"palette__swatch\" src=\"{{ site.url }}/assets/images/paper-53-skin-swatch-4.png\" alt=\"\"></a>\n      <a href=\"{{ site.url }}/assets/images/paper-53-skin-color-5.jpg\"><img class=\"palette__swatch\" src=\"{{ site.url }}/assets/images/paper-53-skin-swatch-5.png\" alt=\"\"></a>\n      <a href=\"{{ site.url }}/assets/images/paper-53-skin-color-6.jpg\"><img class=\"palette__swatch\" src=\"{{ site.url }}/assets/images/paper-53-skin-swatch-6.png\" alt=\"\"></a>\n      <a href=\"{{ site.url }}/assets/images/paper-53-skin-color-7.jpg\"><img class=\"palette__swatch\" src=\"{{ site.url }}/assets/images/paper-53-skin-swatch-7.png\" alt=\"\"></a>\n    </div>\n  </div>\n  <figcaption>Color palette caption.</figcaption>\n</figure>\n"
  },
  {
    "path": "src/_components/media-post-figures.html",
    "content": "---\ntitle: \"Main Content Figures\"\ntype: media\nscss:\nusage: \"Default figure display for images or videos.\"\n---\n\n<figure>\n  <img src=\"{{ site.url }}/assets/images/paper-53-journals.jpg\" alt=\"\">\n  <figcaption>One image.</figcaption>\n</figure>\n"
  },
  {
    "path": "src/_components/notices-post-danger.html",
    "content": "---\ntitle: \"Main Content Danger Notice\"\ntype: notices\nscss:\nusage: \"Emphasize post text.\"\n---\n\n<div class=\"notice--danger\">\n  <h4>Danger Notice Headline</h4>\n  <p>Donec sed tellus eget <a href=\"#\">sapien fringilla nonummy</a>. Mauris a ante. Suspendisse quam sem, consequat at.</p>\n</div>\n"
  },
  {
    "path": "src/_components/notices-post-default.html",
    "content": "---\ntitle: \"Main Content Default Notice\"\ntype: notices\nscss:\nusage: \"Emphasize post text.\"\n---\n\n<div class=\"notice\">\n  <h4>Default Notice Headline</h4>\n  <p>Donec sed tellus eget <a href=\"#\">sapien fringilla nonummy</a>. Mauris a ante. Suspendisse quam sem, consequat at.</p>\n</div>\n"
  },
  {
    "path": "src/_components/notices-post-info.html",
    "content": "---\ntitle: \"Main Content Info Notice\"\ntype: notices\nscss:\nusage: \"Emphasize post text. Used predominately for ProTips.\"\n---\n\n<div class=\"notice--info\">\n  <h4>Info Notice Headline</h4>\n  <p>Donec sed tellus eget <a href=\"#\">sapien fringilla nonummy</a>. Mauris a ante. Suspendisse quam sem, consequat at.</p>\n</div>\n"
  },
  {
    "path": "src/_components/notices-post-success.html",
    "content": "---\ntitle: \"Main Content Success Notice\"\ntype: notices\nscss:\nusage: \"Emphasize post text.\"\n---\n\n<div class=\"notice--success\">\n  <h4>Success Notice Headline</h4>\n  <p>Donec sed tellus eget <a href=\"#\">sapien fringilla nonummy</a>. Mauris a ante. Suspendisse quam sem, consequat at.</p>\n</div>\n"
  },
  {
    "path": "src/_components/notices-post-warning.html",
    "content": "---\ntitle: \"Main Content Warning Notice\"\ntype: notices\nscss:\nusage: \"Emphasize post text. Used predominately for amendments or updates to a post.\"\n---\n\n<div class=\"notice--warning\">\n  <h4>Warning Notice Headline</h4>\n  <p>Donec sed tellus eget <a href=\"#\">sapien fringilla nonummy</a>. Mauris a ante. Suspendisse quam sem, consequat at.</p>\n</div>\n"
  },
  {
    "path": "src/_components/thumbnail-image-grid.html",
    "content": "---\ntitle: \"Thumbnail Image Grid (main content)\"\ntype: media\nscss:\nusage: \"Default thumbnail grid.\"\n---\n\n<ul class=\"gallery-thumbnails\">\n  <li>\n    <a href=\"#\">\n      <img class=\"load\" src=\"{{ site.url }}/assets/images/paperfaces-eliza-t-150.jpg\" data-original=\"{{ site.url }}/assets/images/paperfaces-eliza-t-150.jpg\" alt=\"\">\n      <noscript><img src=\"{{ site.url }}/assets/images/paperfaces-eliza-t-150.jpg\" alt=\"\" /></noscript>\n    </a>\n  </li>\n  <li>\n    <a href=\"#\">\n      <img class=\"load\" src=\"{{ site.url }}/assets/images/paperfaces-rachel-b-150.jpg\" data-original=\"{{ site.url }}/assets/images/paperfaces-rachel-b-150.jpg\" alt=\"\">\n      <noscript><img src=\"{{ site.url }}/assets/images/paperfaces-rachel-b-150.jpg\" alt=\"\" /></noscript>\n    </a>\n  </li>\n  <li>\n    <a href=\"#\">\n      <img class=\"load\" src=\"{{ site.url }}/assets/images/paperfaces-lindsey-m-150.jpg\" data-original=\"{{ site.url }}/assets/images/paperfaces-lindsey-m-150.jpg\" alt=\"\">\n      <noscript><img src=\"{{ site.url }}/assets/images/paperfaces-lindsey-m-150.jpg\" alt=\"\" /></noscript>\n    </a>\n  </li>\n  <li>\n    <a href=\"#\">\n      <img class=\"load\" src=\"{{ site.url }}/assets/images/paperfaces-mi-mo-150.jpg\" data-original=\"{{ site.url }}/assets/images/paperfaces-mi-mo-150.jpg\" alt=\"\">\n      <noscript><img src=\"{{ site.url }}/assets/images/paperfaces-mi-mo-150.jpg\" alt=\"\" /></noscript>\n    </a>\n  </li>\n</ul>\n"
  },
  {
    "path": "src/_components/typography-post-blockquotes.html",
    "content": "---\ntitle: \"Blockquotes\"\ntype: typography\nscss:\nusage: \"Quoted text.\"\n---\n\n<blockquote>\n  <p>Lorem ipsum dolor sit amet, test link adipiscing elit. Nullam dignissim convallis est. Quisque aliquam.</p>\n  <p><cite>First Lastname, <em>The Greatest Article</em></cite></p>\n</blockquote>\n"
  },
  {
    "path": "src/_components/typography-post-headings.html",
    "content": "---\ntitle: \"Main Content Headlines\"\ntype: typography\nscss:\nusage: \"Headline hierarchy found in post content\"\n---\n\n<h1>H1 Headline</h1>\n<h2>H2 Headline</h2>\n<h2><a href=\"#\">H2 Headline with an anchor link</a></h2>\n<h3>H3 Headline</h3>\n<h4>H4 Headline</h4>\n<h5>H5 Headline</h5>\n<h6>H6 Headline</h6>\n"
  },
  {
    "path": "src/_components/typography-post-lists-ordered.html",
    "content": "---\ntitle: \"Main Content Ordered Lists\"\ntype: typography\nscss:\nusage: \"Ordered lists found in post content\"\n---\n\n<ol>\n  <li>List item one</li>\n    <ol>\n      <li>Sub list item one</li>\n      <li>Sub list item two</li>\n      <li>Sub list item three</li>\n    </ol>\n  <li>List item two</li>\n</ol>\n"
  },
  {
    "path": "src/_components/typography-post-lists-unordered.html",
    "content": "---\ntitle: \"Main Content Unordered Lists\"\ntype: typography\nscss:\nusage: \"Unordered lists found in post content\"\n---\n\n<ul>\n  <li>List item one</li>\n    <ul>\n      <li>Sub list item one</li>\n      <li>Sub list item two</li>\n      <li>Sub list item three</li>\n    </ul>\n  <li>List item two</li>\n</ul>\n"
  },
  {
    "path": "src/_components/typography-post-paragraph-text.html",
    "content": "---\ntitle: \"Main Content Paragraph Text\"\ntype: typography\nscss:\nusage: \"Paragraph text found in post content. First paragraph is emphasized with larger font-size.\"\n---\n\n<p>First paragraph is styled differently from the rest. <em>This is emphasized text</em>. Donec faucibus. Nunc iaculis suscipit dui. 53 = 125. Water is H<sub>2</sub>O. Nam sit amet sem. Aliquam <a href=\"#\">libero nisi</a>, imperdiet at, tincidunt nec, gravida vehicula, nisl. The New York Times <cite>(That’s a citation)</cite>. <u>Underline</u>. Maecenas ornare tortor. Donec sed <strong>tellus eget sapien</strong> fringilla nonummy<sup>69</sup>. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.</p>\n\n<p>HTML and <abbr title=\"cascading stylesheets\">CSS</abbr> are our tools. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. <a href=\"#\">Praesent mattis</a>, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.</p>\n"
  },
  {
    "path": "src/_components/typography-post-tables.html",
    "content": "---\ntitle: \"Main Content Tables\"\ntype: typography\nscss:\nusage: \"Basic table found in post content\"\n---\n\n<table>\n  <thead>\n    <tr>\n      <th>#</th>\n      <th>First Name</th>\n      <th>Last Name</th>\n      <th>Username</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr>\n      <td>1</td>\n      <td>Michael</td>\n      <td>Rose</td>\n      <td>@mmistakes</td>\n    </tr>\n    <tr>\n      <td>2</td>\n      <td>William</td>\n      <td>Rick</td>\n      <td>@thewhip</td>\n    </tr>\n    <tr>\n      <td>3</td>\n      <td>Larry</td>\n      <td>the Scary</td>\n      <td>@twitter</td>\n    </tr>\n  </tbody>\n</table>\n"
  },
  {
    "path": "src/_data/comments/365-days-of-drawing/comment-1377880142000.yml",
    "content": "id: comment-1023430741\ndate: 2013-08-30T16:29:02Z\nupdated: 2013-08-30T16:29:02Z\n_parent: /articles/365-days-of-drawing/\nname: Naufal Mir\nurl: http://abijango.com/\nmessage: '\"I’m working on theme, really I am.\" them :)'\navatar: https://disqus.com/api/users/avatars/abijango.jpg\n"
  },
  {
    "path": "src/_data/comments/365-days-of-drawing/comment-1377895505000.yml",
    "content": "replying_to: '1'\nid: comment-1023735704\ndate: 2013-08-30T20:45:05Z\nupdated: 2013-08-30T20:45:05Z\n_parent: /articles/365-days-of-drawing/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Good catch. Thanks!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/aarongreenlee-portrait/comment-1471630435206.yml",
    "content": "_parent: /paperfaces/aarongreenlee-portrait/\nmessage: Thanks for making me look cool\nname: Aaron Greenlee\nemail: 81b3151b91c9dfc3d0074cba1a0357c6\nurl: ''\nhidden: ''\ndate: '2016-08-19T18:13:54.484Z'\n"
  },
  {
    "path": "src/_data/comments/autumn-refresh/comment-1542071071893.yml",
    "content": "_id: 13b39880-e6e0-11e8-8f15-8b93b5c96d99\n_parent: /articles/autumn-refresh/\nname: Arnab Wahid\nemail: 2b5f4253acf477e13cea08554f070fef\nurl: 'https://arnab.me'\nmessage: \"Wonderful read as always, but relatively smaller compared to the last post!\\r\\nI'd be quite interested to read why you chose Gatsby, or why you are moving away from Jekyll.\\r\\nThe new design looks wonderful, it think it is the best so far. Can we expect a similar looking Jekyll theme in the near future? :)\"\nreplying_to: ''\ndate: '2018-11-13T01:04:31.892Z'\n"
  },
  {
    "path": "src/_data/comments/autumn-refresh/comment-1542115612745.yml",
    "content": "_id: c840e2f0-e747-11e8-8511-23ef21272bbf\n_parent: /articles/autumn-refresh/\nname: Michael Rose\nemail: 7c78c2359dc31fa27485199a1895d9e2\nurl: 'https://mademistakes.com'\nmessage: \"Stay tuned for a future post on my thoughts about Gatsby, migrating from Jekyll, etc.\\r\\n\\r\\nAs for a new theme... doubtful. I'm already stretched thin with the few I've released. Since this site is open sourced, there is nothing stopping anyone from taking a look at what I've done and using it.\"\nreplying_to: '1'\ndate: '2018-11-13T13:26:52.744Z'\n"
  },
  {
    "path": "src/_data/comments/autumn-refresh/comment-1544606547011.yml",
    "content": "_id: 70bc2670-fdef-11e8-80cd-a552f5c91eeb\n_parent: /articles/autumn-refresh/\nname: Aftar Fadilah\nemail: ff226a69e8b16dd62afe6aaaad4cd64f\nurl: 'https://aftarfadilah.com'\nmessage: >-\n  It's always fun to learn from your great written stories than a boring step to\n  step tutorial books. Thanks for the experience share, surely will help all the\n  readers\nreplying_to: ''\ndate: '2018-12-12T09:22:27.010Z'\n"
  },
  {
    "path": "src/_data/comments/autumn-refresh/comment-1550151313746.yml",
    "content": "_id: 5b43e9e0-305d-11e9-b137-43d33c7de5b6\n_parent: /articles/autumn-refresh/\nname: Donald Boulton\nemail: c1e68ec3dd3cc5dad0d017d2930b259c\nurl: 'https://donboulton.com'\nmessage: \"Nice updates, like the bigfoot changes and additions.\\r\\n\\r\\nTest on <https://securityheaders.com>\\r\\nYou could add security headers in netlify.toml as below.\\r\\n\\r\\n```\\r\\n[[headers]]\\r\\nfor = \\\"/*\\\"\\r\\n[headers.values]\\r\\nCache-Control = \\\"public, max-age=31536000\\\"\\r\\nReferrer-Policy = \\\"strict-origin-when-cross-origin\\\"\\r\\nX-Content-Type-Options = \\\"nosniff\\\"\\r\\nX-Frame-Options = \\\"DENY\\\"\\r\\nX-XSS-Protection = \\\"1; mode=block\\\"\\r\\nAccess-Control-Allow-Origin = \\\"*\\\"\\r\\nVary = \\\"Accept-Encoding\\\"\\r\\nAccess-Control-Allow-Credentials = \\\"true\\\"\\r\\nFeature-Policy = \\\"geolocation 'self' https://mademistakes.com; autoplay 'none'; lazyload 'self' https://mademistakes.com; sync-xhr 'self' https://mademistakes.com\\\"\\r\\n[[headers]]\\r\\nfor = \\\"/assets/*\\\"\\r\\n[headers.values]\\r\\nCache-Control = \\\"public, max-age=31536000\\\"\\r\\n```\"\nreplying_to: ''\ndate: '2019-02-14T13:35:13.743Z'\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1392005320000.yml",
    "content": "id: comment-1237690364\ndate: 2014-02-10T04:08:40Z\nupdated: 2014-02-10T04:08:40Z\n_parent: /mastering-paper/basics/\nname: Tamara\nurl: ''\nmessage: \"This? This is freakin' awesome! Thanks so much for sharing your mad skills\n  and expertise with us!\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1392183730000.yml",
    "content": "id: comment-1240723860\ndate: 2014-02-12T05:42:10Z\nupdated: 2014-02-12T05:42:10Z\n_parent: /mastering-paper/basics/\nname: Will\nurl: ''\nmessage: \"Nicely done! Looking forward to more how-to articles!\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1392190613000.yml",
    "content": "id: comment-1240785068\ndate: 2014-02-12T07:36:53Z\nupdated: 2014-02-12T07:36:53Z\n_parent: /mastering-paper/basics/\nname: rackom\nurl: ''\nmessage: \"Great tutorial! :) Keep going.\"\navatar: https://disqus.com/api/users/avatars/rackom.jpg\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1395203917000.yml",
    "content": "id: comment-1290889687\ndate: 2014-03-19T04:38:37Z\nupdated: 2014-03-19T04:38:37Z\n_parent: /mastering-paper/basics/\nname: James Daly\nurl: http://jamesdaly.life\nmessage: \"You are amazing, thank you so much for making these articles!\"\navatar: https://disqus.com/api/users/avatars/jamesdaly90.jpg\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1396815357000.yml",
    "content": "id: comment-1321534482\ndate: 2014-04-06T20:15:57Z\nupdated: 2014-04-06T20:15:57Z\n_parent: /mastering-paper/basics/\nname: Ben Hoffer\nurl: ''\nmessage: \"You good sir are the man...thanks for sharing your brilliance :)\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1396868974000.yml",
    "content": "---\nid: comment-1322217365\ndate: 2014-04-07T11:09:34Z\nupdated: 2014-04-07T11:09:34Z\n_parent: /mastering-paper/basics/\nname: Hong\nurl: ''\nmessage: \"Very nice written articles, looking forward to the new ones!\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1405157030000.yml",
    "content": "---\nid: comment-1481694368\ndate: 2014-07-12T09:23:50Z\nupdated: 2014-07-12T09:23:50Z\n_parent: /mastering-paper/basics/\nname: AbbyObi\nurl: ''\nmessage: \"Awesome! Thanks for the great tutorial :)\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1410264861000.yml",
    "content": "---\nid: comment-1580767478\ndate: 2014-09-09T12:14:21Z\nupdated: 2014-09-09T12:14:21Z\n_parent: /mastering-paper/basics/\nname: idol chan\nurl: ''\nmessage: \"the level of awesomeness is too damn high\"\navatar: https://disqus.com/api/users/avatars/idol_chan.jpg\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1418196361000.yml",
    "content": "---\nid: comment-1734595213\ndate: 2014-12-10T07:26:01Z\nupdated: 2014-12-10T07:26:01Z\n_parent: /mastering-paper/basics/\nname: lesley\nurl: ''\nmessage: \"Fantastic help for getting started with 53. Thanks so much. Your work\n  is amazing\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1421525588000.yml",
    "content": "id: comment-1798722959\ndate: 2015-01-17T20:13:08Z\nupdated: 2015-01-17T20:13:08Z\n_parent: /mastering-paper/basics/\nname: \"Al.\"\nurl: ''\nmessage: \"Need the most basic instruction of all!!! How do I start a new drawing,\n  by bringing up a blank page, which allows me to *swipe* up to bring in the tool\n  *bar*\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1421527288000.yml",
    "content": "replying_to: '10'\nid: comment-1798756537\ndate: 2015-01-17T20:41:28Z\nupdated: 2015-01-17T20:41:28Z\n_parent: /mastering-paper/basics/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Pinch the page and it will zoom out to a view that allows you to swipe\n  through, add, or delete pages. Pinch again and you'll see all of your journals.\n  For more help check FiftyThree's support page, it has videos and animations showing\n  how to do all the basics.\\r\\n\\r\\n<https://support.fiftythree.com/hc/en-us/articles/201592322-Basic-Features>\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1427013256000.yml",
    "content": "---\nid: comment-1921409778\ndate: 2015-03-22T08:34:16Z\nupdated: 2015-03-22T08:34:16Z\n_parent: /mastering-paper/basics/\nname: KA\nurl: ''\nmessage: \"Thank you for this guide!! There is still one thing I do not understand:\n  I have watched your video on the watercolor tool and tried to colour slowly and\n  evenly in one go but the final outcome still looks blotchy. I'm using my finger\n  for this, could that be it?\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1427033128000.yml",
    "content": "replying_to: '11'\nid: comment-1921674282\ndate: 2015-03-22T14:05:28Z\nupdated: 2015-03-22T14:05:28Z\n_parent: /mastering-paper/basics/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I've noticed that painting with the Pencil stylus allows you paint faster\n  and does seem to produce a smoother tone easier, but the same effect is possible\n  using just your finger.\\r\\n\\r\\nTry moving in a small circular pattern as you paint,\n  it will help even things. And of course do not lift your finger off the screen or\n  else you'll start to darken areas and won't get that smooth tone.\\r\\n\\r\\nOther than\n  that keep practicing.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1436977013000.yml",
    "content": "---\nid: comment-2137972008\ndate: 2015-07-15T16:16:53Z\nupdated: 2015-07-15T16:16:53Z\n_parent: /mastering-paper/basics/\nname: Graham Krewinghaus\nurl: ''\nmessage: \"Hi Michael,\\r\\n\\r\\nI was scrolling down your page, looking for inspiration\n  (which I do whenever I have drawer's block), and I saw your ink splatter example\n  and wondered if you could put that in some more detail. Would you mind maybe explaining\n  your process more extensively?\"\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1436983501000.yml",
    "content": "replying_to: '12'\nid: comment-2138172060\ndate: 2015-07-15T18:05:01Z\nupdated: 2015-07-15T18:05:01Z\n_parent: /mastering-paper/basics/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"There's not much more to the process than what I included above.\\r\\n\\r\\n1. Use\n  the pen tools to create the general shape and fill it in.\\r\\n2. Add some dots of various\n  sizes around it to simulate the splatter.\\r\\n3. To make some blobs look more 3D add\n  highlights using white or another light color with the pencil tool.\\r\\n4. To finish\n  it off add a drop shadow with a light gray and the watercolor brush, zoom in, and\n  paint quickly along the edge where you want to cast a shadow.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1441808621000.yml",
    "content": "---\nid: comment-2244369717\ndate: 2015-09-09T14:23:41Z\nupdated: 2015-09-09T14:23:41Z\n_parent: /mastering-paper/basics/\nname: Laura Tucker\nurl: http://www.lauratucker.com/\nmessage: \"I just found your site and articles about Paper and want to thank you!\n  \\r\\n\\r\\nThey are beautiful, very well written and have inspired me to get more out of\n  my Pencil and Paper.\"\navatar: https://disqus.com/api/users/avatars/ltucker7.jpg\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1441808820000.yml",
    "content": "replying_to: '13'\nid: comment-2244375227\ndate: 2015-09-09T14:27:00Z\nupdated: 2015-09-09T14:27:00Z\n_parent: /mastering-paper/basics/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You're welcome Laura! Glad you've found them useful.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1441811844000.yml",
    "content": "replying_to: '13'\nid: comment-2244457673\ndate: 2015-09-09T15:17:24Z\nupdated: 2015-09-09T15:17:24Z\n_parent: /mastering-paper/basics/\nname: Laura Tucker\nurl: http://www.lauratucker.com/\nmessage: \"My pleasure, Michael. I posted a couple of links to your articles on\n  [a blog I wrote a couple of months back](https://lauratucker.com/pencil-by-53/) so my readers can find them.\"\navatar: https://disqus.com/api/users/avatars/ltucker7.jpg\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1492075741093.yml",
    "content": "_id: a0686c10-202b-11e7-afe4-4b76bc9e4338\n_parent: /mastering-paper/basics/\nmessage: \"Hi Michael\\r\\nI've never found anything that makes the transition from pencil and paper to digital that is so effortless.  More so because of your great tutorials.  I have a  question on neutralizing colors by mixing with complement.  I dragged the small circle around the color mixer with the compliment also selected but I didn't see a difference.  Perhaps I'm misunderstanding the instruction: \\\"To neutralize them, do one full rotation of the Color Mixer with both complementary colors selected.\\\"\\r\\n\\r\\nMy Pencil by 53 is on the way, but I'm learning while using my finger and another stylus.\"\nname: Lynn Mason\nemail: 19976dbd37e6042f42d765c2f01bf5e7\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-04-13T09:29:01.092Z'\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1492084628478.yml",
    "content": "_id: 51942ab0-2040-11e7-afe4-4b76bc9e4338\n_parent: /mastering-paper/basics/\nmessage: \"Did you rotate the little circle clockwise? If you have say red in the big circle, then select a green from the palettes on the right, when you rotate the big circle clockwise you should see it change colors as green is mixed into it.\\r\\n\\r\\nLooks something like this:\\r\\n\\r\\n![neutralizing a color](https://mademistakes.com/assets/images/paper-53-mixing-complementary-gray-2.jpg)\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '14'\nhidden: ''\ndate: '2017-04-13T11:57:08.477Z'\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1495334506124.yml",
    "content": "_id: 07b693e0-3dcf-11e7-a6d5-790b1bb6a3c2\n_parent: /mastering-paper/basics/\nmessage: >-\n  Do you have any advice about different papers for ball pens. Ball ROller Gel\n  and Felt I doodle. But some papers are way better than others and I'm having\n  difficulty figuring out . I have come across newsprint (like the wight of a\n  daily paper. But no idea where to get more. Or even what words I us to search\n  for it. any help will be appreciated\nname: Ger\nemail: dd6ec1c54573a96354b359d0c338196f\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-05-21T02:41:46.120Z'\n"
  },
  {
    "path": "src/_data/comments/basics/comment-1495457432610.yml",
    "content": "_id: 3d951080-3eed-11e7-8931-77199934308c\n_parent: /mastering-paper/basics/\nmessage: >-\n  Not really. I work mostly digital these days so I'm probably the wrong person\n  to ask for advice on traditional materials.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '15'\nhidden: ''\ndate: '2017-05-22T12:50:32.560Z'\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1421964202000.yml",
    "content": "id: comment-1811850160\ndate: 2015-01-22T22:03:22Z\nupdated: 2015-01-22T22:03:22Z\n_parent: /mastering-paper/color-picker/\nname: claudia miranda\nurl:\nmessage: \"Super helpful! Thank you for sharing this!\"\navatar: https://disqus.com/api/users/avatars/disqus_vxKrZvqBd5.jpg\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1462774965000.yml",
    "content": "id: comment-2665823053\ndate: 2016-05-09T06:22:45Z\nupdated: 2016-05-09T06:22:45Z\n_parent: /mastering-paper/color-picker/\nname: Gillian Zyland\nurl: ''\nmessage: \"I'm just coming back to Paper and things are markedly new and different.\n  I'm very appreciative of your explanations and I'm finding your information very\n  helpful. I downloaded your terrific portrait palette just now and I'm wondering\n  how I should go about importing the colors to use in my own pictures?\\r\\n\\r\\nDo they replace\n  the ones in the default palette or do I use the color pocket to sample them from\n  another picture? I apologize if this is a question with an obvious answer – I'm\n  an absolute novice with the new innovations and I'm even having trouble navigating\n  their info docs. Thanks!\"\navatar: https://disqus.com/api/users/avatars/gillian404notfound.jpg\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1462794743000.yml",
    "content": "replying_to: '2'\nid: comment-2666242701\ndate: 2016-05-09T11:52:23Z\nupdated: 2016-05-09T11:52:23Z\n_parent: /mastering-paper/color-picker/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"There isn't a quick way to import the colors. You essentially import the\n  picture or grab it from [my Paper account](https://paper.fiftythree.com/11098-Michael-Rose/1376457/standalone) and then you sample each of the colors\n  with the Mixer tool. Once sampled you can drag the little circle into an empty spot\n  in your palette.\\r\\n\\r\\n\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1474598387454.yml",
    "content": "_parent: /mastering-paper/color-picker/\nmessage: >-\n  this is great, I am new to paper, can't figure out how to download/use your\n  portrait palette. wondering also is there a way to import brushes/templated\n  from outside of paper?\nname: teri pastorino\nemail: 5b06016231c78a394c725b4a9c74a5d5\nurl: ''\nhidden: ''\ndate: '2016-09-23T02:39:46.768Z'\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1484235423197.yml",
    "content": "_id: f6c61440-d8dc-11e6-b55c-c714fe44c9f5\n_parent: /mastering-paper/color-picker/\nmessage: >-\n  Thank you very much. I learned something new: to pick up colors from pictures.\n  Great!\nname: Marit van der Sleen\nemail: ec3b557478297139690b3cde215a4988\nhidden: ''\ndate: '2017-01-12T15:37:03.192Z'\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1522763618367.yml",
    "content": "_id: 68724dc0-3746-11e8-ad5e-83fb05789426\n_parent: /mastering-paper/color-picker/\nmessage: >-\n  Hi!  Can you explain how to download your palette? I click on it and it just\n  takes me to my account page in Paper to edit my settings, etc. I’m on my\n  iPhone, if that helps. Thanks\nname: Shauna\nemail: 9646c52fbcf6cf71262431b99ee15139\nurl: ''\nreplying_to: ''\ndate: '2018-04-03T13:53:38.358Z'\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1522766218504.yml",
    "content": "_id: 765452c0-374c-11e8-ad5e-83fb05789426\n_parent: /mastering-paper/color-picker/\nmessage: >-\n  That link doesn't work anymore because FiftyThree did away with the Mix\n  service that it was shared on. Only way to get the palette now is to tap and\n  hold on the image above, save it to your camera roll, import that image into\n  Paper, and then sample the colors from there.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '5'\ndate: '2018-04-03T14:36:58.503Z'\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1535761860911.yml",
    "content": "_id: 4ce4fcc0-ad7e-11e8-b9bb-c1fe95ccb7b6\n_parent: /mastering-paper/color-picker/\nname: Mike\nemail: ab5f9122963592d3732ff2785fbd066c\nurl: ''\nmessage: >-\n  I love Paper, but I can’t locate a “fill shape” function, such as the paint\n  bucket in the old paint program on a PC.  Do you know?\nreplying_to: ''\ndate: '2018-09-01T00:31:00.909Z'\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1535805470885.yml",
    "content": "_id: d698a6f0-ade3-11e8-a777-e5f8bc969358\n_parent: /mastering-paper/color-picker/\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nmessage: >-\n  Paper has a [fill\n  tool](https://support.fiftythree.com/hc/en-us/articles/203385492-Canvas-Drawing-Tools#fill-tool)\n  if you're a Paper Pro (or legacy Paper) user.\nreplying_to: '6'\ndate: '2018-09-01T12:37:50.885Z'\n"
  },
  {
    "path": "src/_data/comments/color-picker/comment-1564807469280.yml",
    "content": "_id: 6053b5b0-b5a9-11e9-a4c4-c74c5102e15e\n_parent: /mastering-paper/color-picker/\nname: Alex\nemail: 2f0c2c9dea2197c5d0857ebc02711b3f\nurl: ''\nmessage: >-\n  Thank you so much for creating this post!  It's 2019 and Paper has changed so\n  much, but I have never worked HSB/HSL color models before and had no idea how\n  to recreate my color palette in Illustrator.  Awesome blog~\nreplying_to: ''\ndate: '2019-08-03T04:44:29.280Z'\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1390268003000.yml",
    "content": "id: comment-1209881226\ndate: 2014-01-21T01:33:23Z\nupdated: 2014-01-21T01:33:23Z\n_parent: /mastering-paper/contour-drawing/\nname: Guest\nurl:\nmessage: \"When you do these, do you draw the whole thing in a single line, or do\n  you look from time to time and reposition? My \\\"understanding\\\" is that one is to\n  draw the whole thing without looking? Thanks! Good stuff as always.\"\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1390304292000.yml",
    "content": "replying_to: '1'\nid: comment-1210293370\ndate: 2014-01-21T11:38:12Z\nupdated: 2014-01-21T11:38:12Z\n_parent: /mastering-paper/contour-drawing/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Guess it depends on what you want to get out of the exercise. If you\n  want to develop your hand eye coordination than doing them blind, never looking\n  down, and completing the drawing in one line is the preferred method.\\r\\n\\r\\nI like\n  the look of contour line drawings so I often use it as a stylist approach and less\n  of an drawing exercise. When I do that I will look down to check results or make\n  course corrections to fit the piece.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1390307306000.yml",
    "content": "replying_to: '1'\nid: comment-1210328593\ndate: 2014-01-21T12:28:26Z\nupdated: 2014-01-21T12:28:26Z\n_parent: /mastering-paper/contour-drawing/\nname: Guest\nurl:\nmessage: \"thank you kindly. about what i suspected but i like to know what real\n  people do. :)\"\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1390308947000.yml",
    "content": "replying_to: '1'\nid: comment-1210358554\ndate: 2014-01-21T12:55:47Z\nupdated: 2014-01-21T12:55:47Z\n_parent: /mastering-paper/contour-drawing/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I'm probably the worst person to compare against. I tend to do things\n  in ways they weren't intended or completely backwards. Hah.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1390311361000.yml",
    "content": "replying_to: '1'\nid: comment-1210392916\ndate: 2014-01-21T13:36:01Z\nupdated: 2014-01-21T13:36:01Z\n_parent: /mastering-paper/contour-drawing/\nname: Guest\nurl:\nmessage: \"well as someone with few if any clues, i can say that your tutorials\n  and examples and answers help me improve.\"\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1394549542000.yml",
    "content": "id: comment-1280046163\ndate: 2014-03-11T14:52:22Z\nupdated: 2014-03-11T14:52:22Z\n_parent: /mastering-paper/contour-drawing/\nname: Eric\nurl: ''\nmessage: \"My take on this (and I'm a Noob) is to have fun with the drawing. Choose\n  a method you like or come up with your own. I find this fun to do during meetings\n  as I draw faces of coworkers while not included in conversations.  :)\"\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1395769302000.yml",
    "content": "id: comment-1301989675\ndate: 2014-03-25T17:41:42Z\nupdated: 2014-03-25T17:41:42Z\n_parent: /mastering-paper/contour-drawing/\nname: mismo\nurl: ''\nmessage: \"How do you drag the solid black color into the canvas for a solid black\n  background?\"\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1395769842000.yml",
    "content": "replying_to: '3'\nid: comment-1302010421\ndate: 2014-03-25T17:50:42Z\nupdated: 2014-03-25T17:50:42Z\n_parent: /mastering-paper/contour-drawing/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You do it exactly how you described it. Drag the color onto the background\n  and release. One thing to note is it's not a fill. If you have something on the\n  canvas already it will cover it all up with whatever color you drag over.\\r\\n\\r\\nThis\n  page explains how to fill the page with color](https://support.fiftythree.com/hc/en-us/articles/201721151-Using-Color#fill-with-color) if you need more detail.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1397642850000.yml",
    "content": "id: comment-1340214922\ndate: 2014-04-16T10:07:30Z\nupdated: 2014-04-16T10:07:30Z\n_parent: /mastering-paper/contour-drawing/\nname: Carole Ann Faust\nurl: ''\nmessage: |\n  Hoping for an honest critique.\n\n  ![Paper for iOS tree drawing](https://a.disquscdn.com/uploads/mediaembed/images/955/6709/original.jpg)\navatar: https://disqus.com/api/users/avatars/caroleannfaust.jpg\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1397645442000.yml",
    "content": "replying_to: '4'\nid: comment-1340243868\ndate: 2014-04-16T10:50:42Z\nupdated: 2014-04-16T10:50:42Z\n_parent: /mastering-paper/contour-drawing/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Very nice! I love the traditional watercolor feel of both.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/contour-drawing/comment-1397648727000.yml",
    "content": "replying_to: '4'\nid: comment-1340284777\ndate: 2014-04-16T11:45:27Z\nupdated: 2014-04-16T11:45:27Z\n_parent: /mastering-paper/contour-drawing/\nname: Carole Ann Faust\nurl: ''\nmessage: \"Thank you! That means a lot coming from you! I go to your site every\n  so often to see what I am forgetting to do. Love your work!\"\navatar: https://disqus.com/api/users/avatars/caroleannfaust.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1378398921000.yml",
    "content": "id: comment-1031065145\ndate: 2013-09-05T16:35:21Z\nupdated: 2013-09-05T16:35:21Z\n_parent: /mastering-paper/drawing-clouds/\nname: dada\nurl: ''\nmessage: \"thx for share\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1378503842000.yml",
    "content": "id: comment-1032719823\ndate: 2013-09-06T21:44:02Z\nupdated: 2013-09-06T21:44:02Z\n_parent: /mastering-paper/drawing-clouds/\nname: Josh Medeski\nurl: http://joshmedeski.com/\nmessage: \"I'm really enjoying this series, thanks so much!\"\navatar: https://disqus.com/api/users/avatars/joshmedeski.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1378689620000.yml",
    "content": "id: comment-1034871042\ndate: 2013-09-09T01:20:20Z\nupdated: 2013-09-09T01:20:20Z\n_parent: /mastering-paper/drawing-clouds/\nname: Guest\nurl:\nmessage: \"Love these Mastering Paper articles. Very helpful! Thanks!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1379403972000.yml",
    "content": "id: comment-1047636911\ndate: 2013-09-17T07:46:12Z\nupdated: 2013-09-17T07:46:12Z\n_parent: /mastering-paper/drawing-clouds/\nname: elysdir\nurl: ''\nmessage: \"This is great--thank you very much for providing these tutorials! Really\n  useful.\\r\\n\\r\\nTwo questions about this one:\\r\\n\\r\\n1. I don't quite understand what\n  you're doing to create the cloud wisps. Is that the pencil tool? And is it more\n  like shading, or crosshatching, or just a few individual lines? In your closeup\n  (with the arrows drawn on it), it looks like a few short angled individual lines,\n  but in the finished piece it looks more like a few longer almost-flat individual\n  lines, and somewhere in one of the sample image writeups (which are also really\n  useful!) I think you said something about shading.\\r\\n2. I'm not understanding\n  why/when the sun would appear as a silhouetted black half-circle--isn't the light\n  of the sun what's causing other things to appear as silhouettes?\\r\\n\\r\\nThanks again,\n  and I'm looking forward to the rest of the series!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1379418558000.yml",
    "content": "replying_to: '4'\nid: comment-1047824589\ndate: 2013-09-17T11:49:18Z\nupdated: 2013-09-17T11:49:18Z\n_parent: /mastering-paper/drawing-clouds/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"1. Yes. It's kind of like crosshatching. I use that to build up the *beefier*\n  parts of a light and thin cloud. For the really thin streaky ones it's basically\n  just some horizontal pencil strokes. I use shading more in the fluffier clouds to\n  add roundness to some parts.\\r\\n\\r\\n2. And you're right on the sun being lit and\n  everything else in silo. I went with a more dramatic eclipse that you'd almost never\n  see. Just my *artistic* interpretation.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1379714880000.yml",
    "content": "id: comment-1053368997\ndate: 2013-09-20T22:08:00Z\nupdated: 2013-09-20T22:08:00Z\n_parent: /mastering-paper/drawing-clouds/\nname: Don\nurl: ''\nmessage: \"Thank you for these great tutorials.\\r\\nI appreciate he very helpful\n  attention to detail and really well written text\\r\\nEloquent exposition... beautiful\n  art.\\r\\nLooking forward to more. Thanks again.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1380204661000.yml",
    "content": "id: comment-1059807038\ndate: 2013-09-26T14:11:01Z\nupdated: 2013-09-26T14:11:01Z\n_parent: /mastering-paper/drawing-clouds/\nname: Shelina Valmond\nurl: http://awriterinspired.wordpress.com/\nmessage: \"Love the series and can't wait to see animation. I am new to drawing\n  but not to paper if that makes sense. Excited to see how everything fits together.\"\navatar: https://disqus.com/api/users/avatars/AWriterInspired.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1393483754000.yml",
    "content": "id: comment-1262589738\ndate: 2014-02-27T06:49:14Z\nupdated: 2014-02-27T06:49:14Z\n_parent: /mastering-paper/drawing-clouds/\nname: Angelic Peraga\nurl: ''\nmessage: \"Thanks for a big help. I love what you do.. Please continue to do more\n  tutorials like this. I'm a frustrated artist. I can't wait for more tutorials. :)\"\navatar: https://disqus.com/api/users/avatars/angelicperaga.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1393506505000.yml",
    "content": "replying_to: '7'\nid: comment-1262843270\ndate: 2014-02-27T13:08:25Z\nupdated: 2014-02-27T13:08:25Z\n_parent: /mastering-paper/drawing-clouds/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thank you so much. I have a few I'm working on now so hopefully the wait\n  isn't too long.\\r\\n\\r\\nAnything in particular you'd like to see a tutorial of?\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1393604491000.yml",
    "content": "replying_to: '7'\nid: comment-1264536932\ndate: 2014-02-28T16:21:31Z\nupdated: 2014-02-28T16:21:31Z\n_parent: /mastering-paper/drawing-clouds/\nname: Angelic Peraga\nurl: ''\nmessage: \"I'd love to see a city wise. Sky scrapers. I drew something. I tried\n  your clouds and the silhouette. Turned out okay for a beginner like me. I can't\n  wait for your portrait tutorials :)\"\navatar: https://disqus.com/api/users/avatars/angelicperaga.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1393604736000.yml",
    "content": "replying_to: '7'\nid: comment-1264542291\ndate: 2014-02-28T16:25:36Z\nupdated: 2014-02-28T16:25:36Z\n_parent: /mastering-paper/drawing-clouds/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"This looks pretty good to me!\\r\\n\\r\\nCityscapes is a good one. I've done\n  a few buildings and such that I could probably turn into a tutorial. Drawing buildings\n  can get complicated fast, especially when trying to get the correct perspective\n  and all that.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1393972879000.yml",
    "content": "id: comment-1270574440\ndate: 2014-03-04T22:41:19Z\nupdated: 2014-03-04T22:41:19Z\n_parent: /mastering-paper/drawing-clouds/\nname: Rob\nurl: ''\nmessage: \"Love the website! Keep up the good work.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1396486944000.yml",
    "content": "id: comment-1316122361\ndate: 2014-04-03T01:02:24Z\nupdated: 2014-04-03T01:02:24Z\n_parent: /mastering-paper/drawing-clouds/\nname: Nan\nurl: ''\nmessage: \"Michael, help. Brand new to this app. How do you flip to a new page after\n  you've finished a painting without backing out of the app and launching it again?\\r\\n\\r\\nThanks for your response!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1396490404000.yml",
    "content": "replying_to: '9'\nid: comment-1316178090\ndate: 2014-04-03T02:00:04Z\nupdated: 2014-04-03T02:00:04Z\n_parent: /mastering-paper/drawing-clouds/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"If you pinch the page in the center of the canvas as if you were folding\n  it in half it will zoom out to a view where you can add a new page or go to another\n  journal.\\r\\n\\r\\nYou can also flip through pages by swiping from the left or right\n  edges inwards. Doing a swipe from the right edge on the last page of a journal will\n  create a new blank page.\\r\\n\\r\\nOn [FiftyThree's support site](https://support.fiftythree.com/hc/en-us/articles/201592322-Basic-Features) they have videos that\n  show all of these gestures in action if you need a visual.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1398017412000.yml",
    "content": "id: comment-1347573312\ndate: 2014-04-20T18:10:12Z\nupdated: 2014-04-20T18:10:12Z\n_parent: /mastering-paper/drawing-clouds/\nname: Frances\nurl: ''\nmessage: \"Thanks Michael for sharing all these tutorials! I had the paper app for\n  a while, but I discovered this site a few days ago and now I can't stop drawing.\n  I finally start to understand how to make the most out of it and I already see a\n  big improvement.\\r\\n\\r\\nKeep up the great work and I am looking forward for more,\n  especially how to draw faces!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1400770265000.yml",
    "content": "id: comment-1399449921\ndate: 2014-05-22T14:51:05Z\nupdated: 2014-05-22T14:51:05Z\n_parent: /mastering-paper/drawing-clouds/\nname: gerard\nurl: ''\nmessage: \"Hi, what strokes did you do to make the clouds? Thanks for the tutorial\n  by the way. Looking forward to your next tutorial.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-clouds/comment-1400770703000.yml",
    "content": "replying_to: '11'\nid: comment-1399460576\ndate: 2014-05-22T14:58:23Z\nupdated: 2014-05-22T14:58:23Z\n_parent: /mastering-paper/drawing-clouds/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Quick watercolor strokes in a circular motion using white to rough out\n  the big clouds.\\r\\n\\r\\nFor the thinner clouds that streak across the sky I used a\n  white pencil with criss crossing strokes. I used the same technique to define the\n  edges of the larger clouds too.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398153549000.yml",
    "content": "id: comment-1349941727\ndate: 2014-04-22T07:59:09Z\nupdated: 2014-04-22T07:59:09Z\n_parent: /mastering-paper/drawing-faces/\nname: A\nurl: ''\nmessage: \"Thank you so much for writing this Michael! This is awesome.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398158232000.yml",
    "content": "id: comment-1349985056\ndate: 2014-04-22T09:17:12Z\nupdated: 2014-04-22T09:17:12Z\n_parent: /mastering-paper/drawing-faces/\nname: Leah Hale\nurl: ''\nmessage: \"Thank you so much for taking the time to explain your amazing techniques.\n  Look forward to the hair tutorial next.\"\navatar: https://disqus.com/api/users/avatars/leahhale.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398160932000.yml",
    "content": "id: comment-1350027094\ndate: 2014-04-22T10:02:12Z\nupdated: 2014-04-22T10:02:12Z\n_parent: /mastering-paper/drawing-faces/\nname: Jon\nurl: ''\nmessage: \"Great guide! I'd love to see guides on realistic eyes, mouths and more,\n  as you put it!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398170698000.yml",
    "content": "id: comment-1350158578\ndate: 2014-04-22T12:44:58Z\nupdated: 2014-04-22T12:44:58Z\n_parent: /mastering-paper/drawing-faces/\nname: HarryTheDirtyDog\nurl: ''\nmessage: \"Definitely eyes, mouth, face next.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398198848000.yml",
    "content": "id: comment-1350877097\ndate: 2014-04-22T20:34:08Z\nupdated: 2014-04-22T20:34:08Z\n_parent: /mastering-paper/drawing-faces/\nname: Kane Gruber\nurl: ''\nmessage: \"Did you seriously draw John Gruber and Dan Benjamin?\"\navatar: https://disqus.com/api/users/avatars/kanegruber.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398199078000.yml",
    "content": "replying_to: '5'\nid: comment-1350882421\ndate: 2014-04-22T20:37:58Z\nupdated: 2014-04-22T20:37:58Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Sure looks that way :wink:\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398221444000.yml",
    "content": "id: comment-1351290300\ndate: 2014-04-23T02:50:44Z\nupdated: 2014-04-23T02:50:44Z\n_parent: /mastering-paper/drawing-faces/\nname: Will\nurl: ''\nmessage: \"Excellent tutorial, as usual! So, are you preferring the Pogo over Pencil?\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398222726000.yml",
    "content": "id: comment-1351307754\ndate: 2014-04-23T03:12:06Z\nupdated: 2014-04-23T03:12:06Z\n_parent: /mastering-paper/drawing-faces/\nname: Miguel Angel Rodriguez Frias\nurl: ''\nmessage: \"Like I said before you should definitively think about getting these tutorials\n  on a **Paper Book**.\\r\\n\\r\\nI believe that a tutorial explaining in more detail the\n  facial features is more important than a hair one!\"\navatar: https://disqus.com/api/users/avatars/miguelangelrodriguezfrias.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398253969000.yml",
    "content": "replying_to: '7'\nid: comment-1351651200\ndate: 2014-04-23T11:52:49Z\nupdated: 2014-04-23T11:52:49Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks for the feedback Miguel. Looking at the responses so far, pretty\n  sure I'll be doing a tutorial on facial features next.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398288006000.yml",
    "content": "replying_to: '7'\nid: comment-1352512743\ndate: 2014-04-23T21:20:06Z\nupdated: 2014-04-23T21:20:06Z\n_parent: /mastering-paper/drawing-faces/\nname: Miguel Angel Rodriguez Frias\nurl: ''\nmessage: \"Delightful.\"\navatar: https://disqus.com/api/users/avatars/miguelangelrodriguezfrias.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398310673000.yml",
    "content": "id: comment-1352931636\ndate: 2014-04-24T03:37:53Z\nupdated: 2014-04-24T03:37:53Z\n_parent: /mastering-paper/drawing-faces/\nname: Rosa O'Toole\nurl: ''\nmessage: \"Amazing and helpful!! I have been looking forward to this for a long\n  time and it was worth the wait!! I would really like to see more on realistic portraits\n  please.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398372070000.yml",
    "content": "id: comment-1354130269\ndate: 2014-04-24T20:41:10Z\nupdated: 2014-04-24T20:41:10Z\n_parent: /mastering-paper/drawing-faces/\nname: Benjamin Thwaite\nurl: ''\nmessage: \"This is a really useful guide, I'm gonna definitely learn a lot. One\n  thing I have to ask, how did you make such a perfectly shaped box for your portraits?\n  I've been messing about trying to make a good box for a workspace, but I can't get\n  it to look centered or straight or nice at all.\"\navatar: https://disqus.com/api/users/avatars/benjaminthwaite.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398372262000.yml",
    "content": "replying_to: '9'\nid: comment-1354135071\ndate: 2014-04-24T20:44:22Z\nupdated: 2014-04-24T20:44:22Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: 'Thanks! RE: the square box. I drew it by placing a ruler on the screen\n  and using a stylus. It takes some trial an error to get the placement but after\n  that you can use it as \"template\" over and over again by duplicating it.'\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398387151000.yml",
    "content": "id: comment-1354439598\ndate: 2014-04-25T00:52:31Z\nupdated: 2014-04-25T00:52:31Z\n_parent: /mastering-paper/drawing-faces/\nname: Rick\nurl: ''\nmessage: \"How do you blend?\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398388580000.yml",
    "content": "replying_to: '10'\nid: comment-1354460353\ndate: 2014-04-25T01:16:20Z\nupdated: 2014-04-25T01:16:20Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"To blend you need to use 53's Pencil stylus. When it's connected to Paper\n  you can use your finger to smudge and blur.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398620475000.yml",
    "content": "id: comment-1357903467\ndate: 2014-04-27T17:41:15Z\nupdated: 2014-04-27T17:41:15Z\n_parent: /mastering-paper/drawing-faces/\nname: Abby\nurl: ''\nmessage: \"I love your shading technique! The way you use the water color brush\n  is so beautiful. Thank you for sharing!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1398982327000.yml",
    "content": "id: comment-1364838875\ndate: 2014-05-01T22:12:07Z\nupdated: 2014-05-01T22:12:07Z\n_parent: /mastering-paper/drawing-faces/\nname: PICMAR\nurl: ''\nmessage: \"I vote for more hair technique ...\"\navatar: https://disqus.com/api/users/avatars/ingmar_melchert.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1406616895000.yml",
    "content": "id: comment-1509401576\ndate: 2014-07-29T06:54:55Z\nupdated: 2014-07-29T06:54:55Z\n_parent: /mastering-paper/drawing-faces/\nname: Rosa O'Toole\nurl: ''\nmessage: \"You are. My inspiration I hope to be as amazing as you! A realistic eyes,\n  mouth and more would be Awesome ! Your tutorials are great! Wish I could save them\n  somewhere like on noteshelf or even in paper:) wishful thinking!\\r\\n\\r\\nThank you\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1406638106000.yml",
    "content": "replying_to: '13'\nid: comment-1509863337\ndate: 2014-07-29T12:48:26Z\nupdated: 2014-07-29T12:48:26Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Rosa.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1409312521000.yml",
    "content": "id: comment-1564644200\ndate: 2014-08-29T11:42:01Z\nupdated: 2014-08-29T11:42:01Z\n_parent: /mastering-paper/drawing-faces/\nname: annafdd\nurl: ''\nmessage: \"Hi Michael, you have definitely encouraged me to go digital, and I am\n  enjoying it immensely. I up have also caught the Sktchy bug thanks to you.\\r\\n\\r\\nStill have a lot of problems producing smooth brush washes, and the only stylus\n  that suits my hand is an Adonit JotPro, so I am not going to buy the Pencil just\n  for the Blend. Hope that Paper introduces it for the rest of us. Meanwhile: practice,\n  practice, practice!\"\navatar: https://disqus.com/api/users/avatars/annafdd.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1409313922000.yml",
    "content": "replying_to: '14'\nid: comment-1564664467\ndate: 2014-08-29T12:05:22Z\nupdated: 2014-08-29T12:05:22Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Glad to hear you caught the Sktchy bug!\\r\\n\\r\\nBecoming proficient with\n  the watercolor brush definitely takes practice. From using different styli I've\n  noticed they all pretty much make the same mark. The big difference has been when\n  I use a Pogo Connect. I don't know if it's because it has a pressure sensitive tip,\n  but it seems fill paint quicker than the other styli, which in turn makes for a\n  smoother wash.\\r\\n\\r\\nWhen I use Pencil or any other stylus I have to really slow\n  down how quick I paint or else it gets blotchy. That's the key to smoothness. Which\n  can be hard sometimes because if you linger in an area too long might turn too dark.\n  It really is a balancing act between speed, value, and the color you choose to paint\n  with.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411510619000.yml",
    "content": "id: comment-1602769681\ndate: 2014-09-23T22:16:59Z\nupdated: 2014-09-23T22:16:59Z\n_parent: /mastering-paper/drawing-faces/\nname: Robert\nurl: ''\nmessage: \"Michael I find most styluses have a fat tip making detail accuracy difficult.\n  The new one for Paper, while nicely designed, is enormous. Can you recommend one\n  that is finer?\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411516024000.yml",
    "content": "replying_to: '15'\nid: comment-1602869186\ndate: 2014-09-23T23:47:04Z\nupdated: 2014-09-23T23:47:04Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Out of all the rubber tipped styli FiftyThree's Pencil is easily the one\n  with the smallest tip... but that's not saying much. If you want something a little\n  more accurate and precise I'd look into [Adonit's Jot Pro](http://www.adonit.net/jot/pro) if you're only using Paper.\n  Other wise their more expensive pressure sensitive styli look quite nice, but they\n  only work with Procreate and a few other apps.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411948473000.yml",
    "content": "id: comment-1610125979\ndate: 2014-09-28T23:54:33Z\nupdated: 2014-09-28T23:54:33Z\n_parent: /mastering-paper/drawing-faces/\nname: Nick Bova\nurl: ''\nmessage: \"Hey Michael just a quick question! How much did you get your pogo connect\n  for and where can I get one ?\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411953728000.yml",
    "content": "replying_to: '16'\nid: comment-1610203033\ndate: 2014-09-29T01:22:08Z\nupdated: 2014-09-29T01:22:08Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I got my Pogo Connect a few years ago from Amazon. It's currently [going\n  for $55](http://www.amazon.com/gp/product/B009K448L4/ref=as_li_tl?ie=UTF8&amp;camp=1789&amp;creative=390957&amp;creativeASIN=B009K448L4&amp;linkCode=as2&amp;tag=mademist-20&amp;linkId=2FUVY5QHKFTKTJIN) which is about $20-30 cheaper than what I paid.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411955472000.yml",
    "content": "replying_to: '16'\nid: comment-1610225968\ndate: 2014-09-29T01:51:12Z\nupdated: 2014-09-29T01:51:12Z\n_parent: /mastering-paper/drawing-faces/\nname: Nick Bova\nurl: ''\nmessage: \"Ok well is it worth getting if I already have the pencil stylus made\n  by 53 ? Because that is the only stylus I have at the moment\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411955887000.yml",
    "content": "replying_to: '16'\nid: comment-1610230921\ndate: 2014-09-29T01:58:07Z\nupdated: 2014-09-29T01:58:07Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Pre-Paper version 2.0.0 I would have said yes it's worth getting a Pogo\n  Connect. But now with Surface Pressure and some enhancements made to the watercolor\n  brush you can pretty much do everything the Pogo allowed you to do.\\r\\n\\r\\nNot to\n  mention the Pogo Connect is a big steaming pile of unreliability. When it works\n  it works awesome. The other 95% of the time it constantly disconnects or stops registering\n  touches and you have remove the battery to power cycle it. I've never had those\n  sorts of issues with Pencil.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411956100000.yml",
    "content": "replying_to: '16'\nid: comment-1610233463\ndate: 2014-09-29T02:01:40Z\nupdated: 2014-09-29T02:01:40Z\n_parent: /mastering-paper/drawing-faces/\nname: Nick Bova\nurl: ''\nmessage: \"Ok that's what I figured! I love this guide btw but I just can't draw\n  for my life. When you first started out drawing were you amazing or did you practice\n  like crazy because I know you always remind us to practice\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1411956551000.yml",
    "content": "replying_to: '16'\nid: comment-1610238984\ndate: 2014-09-29T02:09:11Z\nupdated: 2014-09-29T02:09:11Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I knew how to draw ok before I started but was no where near the level\n  I ended up doing a Paper drawing every day for two years straight. If you look at\n  my [PaperFaces gallery](http://mademistakes.com/paperfaces/) and scroll all the way to the bottom you'll see how very simply\n  my early stuff was. Practice made all the difference.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1417548428000.yml",
    "content": "id: comment-1722449197\ndate: 2014-12-02T19:27:08Z\nupdated: 2014-12-02T19:27:08Z\n_parent: /mastering-paper/drawing-faces/\nname: Barry Hunau\nurl: ''\nmessage: \"Michael, you are an amazing artist. Your tutorials have been very helpful\n  to me. Have you considered writing a book on mastering Paper 53. I for one would\n  buy it in a heartbeat. Thanks again for your valuable advice.\\r\\nBarry\"\navatar: https://disqus.com/api/users/avatars/barryhunau.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1417548739000.yml",
    "content": "replying_to: '17'\nid: comment-1722457508\ndate: 2014-12-02T19:32:19Z\nupdated: 2014-12-02T19:32:19Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks for the kind words Barry! To answer your question, yes I've thought\n  about writing a book. I don't know if a printed version will ever happen but I'd\n  like to do some sort of eBook or at the very least a companion guide to go along\n  with my Mastering Paper series.\\r\\n\\r\\nI'm kind of partial to the web based incarnation\n  of the series because it's easier for me to update as Paper continues to involve.\n  Not to mention I have a bunch of gaps that I need to fill in on using Paper that\n  I don't know if I'll ever get to them to make publishing a book on the subject worth\n  while. If there were only more hours in the day ;-)\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1420028827000.yml",
    "content": "id: comment-1765877648\ndate: 2014-12-31T12:27:07Z\nupdated: 2014-12-31T12:27:07Z\n_parent: /mastering-paper/drawing-faces/\nname: niverik2k\nurl: ''\nmessage: \"This is really great info. Since your post, Paper by 53 includes the number\n  values of the colors, in the Hal mode. Are you able to look back and post what those\n  values are, so we can replicate the colors more precisely? Thank you so much for\n  what you have already posted.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1420046018000.yml",
    "content": "replying_to: '18'\nid: comment-1766221955\ndate: 2014-12-31T17:13:38Z\nupdated: 2014-12-31T17:13:38Z\n_parent: /mastering-paper/drawing-faces/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Check out my [article about the Color Picker](https://mademistakes.com/mastering-paper/color-picker/). At the very end I share a\n  link to my skin tone palette on Mix that can be downloaded to Paper. Click it and\n  hit remix and Paper will open it letting you sample the colors with the new Color\n  Picker or look up the values.\\r\\n\\r\\n\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-faces/comment-1432135554000.yml",
    "content": "id: comment-2035812607\ndate: 2015-05-20T15:25:54Z\nupdated: 2015-05-20T15:25:54Z\n_parent: /mastering-paper/drawing-faces/\nname: Guillermo de la Maza\nurl: ''\nmessage: \"Michael, thank you so much for sharing this excellent tutorial. I've\n  always wanted to draw realistic faces but have failed miserably. This will certainly\n  help point me in the right direction.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-hair/comment-1377103010000.yml",
    "content": "id: comment-1010711193\ndate: 2013-08-21T16:36:50Z\nupdated: 2013-08-21T16:36:50Z\n_parent: /mastering-paper/drawing-hair/\nname: Luliio\nurl: ''\nmessage: \"Amazing \\U0001F44D\\U0001F44F\"\n"
  },
  {
    "path": "src/_data/comments/drawing-hair/comment-1392903055000.yml",
    "content": "id: comment-1253031401\ndate: 2014-02-20T13:30:55Z\nupdated: 2014-02-20T13:30:55Z\n_parent: /mastering-paper/drawing-hair/\nname: LMM\nurl: ''\nmessage: \"Outstanding! Thank you so much :)\"\n"
  },
  {
    "path": "src/_data/comments/drawing-hair/comment-1402794538000.yml",
    "content": "id: comment-1435917550\ndate: 2014-06-15T01:08:58Z\nupdated: 2014-06-15T01:08:58Z\n_parent: /mastering-paper/drawing-hair/\nname: Robert Hamm\nurl: ''\nmessage: \"Really great info. This is the kind of tutorials I would have expected\n  on 53's site. I'm so used to drawing with layers, that I've almost forgotten how\n  to draw without them. Thanks for your info.\"\navatar: https://disqus.com/api/users/avatars/roberthamm.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-hair/comment-1507473437365.yml",
    "content": "_id: 2e9ea5d0-ac36-11e7-86ab-5f3848337529\n_parent: /mastering-paper/drawing-hair/\nmessage: \"I have been following your page for quite a while now. I should say, you’ve helped me lot. :) I have made some paintings too. https://goworkeatout.com/2017/10/07/a-lady-in-snow/ \\r\\nYou got a great page, please keep sharing the knowledge.\"\nname: Neehal Shaikh\nemail: 75fd94fc0eb1c2a8a54a324e835a3348\nurl: 'https://goworkeatout.com/'\nreplying_to: ''\nhidden: ''\ndate: '2017-10-08T14:37:17.364Z'\n"
  },
  {
    "path": "src/_data/comments/drawing-outer-space/comment-1420577872000.yml",
    "content": "id: comment-1775304619\ndate: 2015-01-06T20:57:52Z\nupdated: 2015-01-06T20:57:52Z\n_parent: /mastering-paper/drawing-outer-space/\nname: Steven Combs, Ph.D.\nurl: http://www.stevencombs.com/\nmessage: \"Thanks for [inspiring me](http://www.stevencombs.com/art/2015/01/06/paperbyfiftythree-fountain-pen.html) Michael!\\r\\n\\r\\nLove the techniques presented\n  and can’t wait to experiment more with these tools.\"\navatar: https://disqus.com/api/users/avatars/stevencombsphd.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-outer-space/comment-1420579819000.yml",
    "content": "replying_to: '1'\nid: comment-1775358249\ndate: 2015-01-06T21:30:19Z\nupdated: 2015-01-06T21:30:19Z\n_parent: /mastering-paper/drawing-outer-space/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Nice! Your fountain pen drawing came out great.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-outer-space/comment-1420843616000.yml",
    "content": "id: comment-1783376081\ndate: 2015-01-09T22:46:56Z\nupdated: 2015-01-09T22:46:56Z\n_parent: /mastering-paper/drawing-outer-space/\nname: John S.\nurl: ''\nmessage: \"Hey Michael. I don't usually write comments on articles as the vast\n  majority of people, but I love your blog and I find it very illustrating and clear.\n  I'm learning step by step to use Paper thanks to you.\\r\\n\\r\\nKeep it up --- your works\n  are of great quality --- and thank you.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-outer-space/comment-1420847567000.yml",
    "content": "replying_to: '2'\nid: comment-1783466477\ndate: 2015-01-09T23:52:47Z\nupdated: 2015-01-09T23:52:47Z\n_parent: /mastering-paper/drawing-outer-space/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks John! The encouraging words makes the time I spend on these worth the effort!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1385426180000.yml",
    "content": "id: comment-1138909177\ndate: 2013-11-26T00:36:20Z\nupdated: 2013-11-26T00:36:20Z\n_parent: /mastering-paper/drawing-textures/\nname: Mudz69\nurl: ''\nmessage: \"Superb tutorial once again, I shall have some fun trying these out over\n  the next few days, thanx, the wood grain looks amazing!!\"\navatar: https://disqus.com/api/users/avatars/mudz69.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1385439861000.yml",
    "content": "id: comment-1139108658\ndate: 2013-11-26T04:24:21Z\nupdated: 2013-11-26T04:24:21Z\n_parent: /mastering-paper/drawing-textures/\nname: Eric Talerico\nurl: ''\nmessage: \"Nice work! Very, very good tips.\"\navatar: https://disqus.com/api/users/avatars/erictalerico.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1385442241000.yml",
    "content": "id: comment-1139135293\ndate: 2013-11-26T05:04:01Z\nupdated: 2013-11-26T05:04:01Z\n_parent: /mastering-paper/drawing-textures/\nname: rohit\nurl: ''\nmessage: \"Fantastic work!\"\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1385757928000.yml",
    "content": "id: comment-1144498878\ndate: 2013-11-29T20:45:28Z\nupdated: 2013-11-29T20:45:28Z\n_parent: /mastering-paper/drawing-textures/\nname: Benjamin Thwaite\nurl: ''\nmessage: \"I just found your site a few days ago, I've been spending a lot of time\n  reading all your tips on how to master Paper and I'm having a lot of fun! These\n  are awesome tips and I hope to become a better artist, thank you for sharing your\n  knowledge!\"\navatar: https://disqus.com/api/users/avatars/benjaminthwaite.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1400096924000.yml",
    "content": "id: comment-1385484509\ndate: 2014-05-14T19:48:44Z\nupdated: 2014-05-14T19:48:44Z\n_parent: /mastering-paper/drawing-textures/\nname: gerard\nurl: ''\nmessage: \"As usual very good tutorial. Learned a lot from this. Keep it up sir.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1424636878000.yml",
    "content": "id: comment-1869609606\ndate: 2015-02-22T20:27:58Z\nupdated: 2015-02-22T20:27:58Z\n_parent: /mastering-paper/drawing-textures/\nname: Maureen\nurl: ''\nmessage: \"I'm just finding out about Paper and your wonderful tutorials. Quick\n  question: can paper do layers?\"\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1424638048000.yml",
    "content": "replying_to: '6'\nid: comment-1869638815\ndate: 2015-02-22T20:47:28Z\nupdated: 2015-02-22T20:47:28Z\n_parent: /mastering-paper/drawing-textures/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Sadly Paper only has the single layer, which can make it quite challenging\n  to use in certain situations.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-textures/comment-1492192153413.yml",
    "content": "_id: ab93f630-213a-11e7-9019-797640daeab0\n_parent: /mastering-paper/drawing-textures/\nmessage: >-\n  It's hard to put the great pleasure I'm feeling into words.  Your tutorials\n  have been a breakthrough from sketching and watercolor 'in the real world' to\n  going digital with ease. Thank you.\nname: Lynn Mason\nemail: 36706b1d526ff840e9cfa9bbfb26c818\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-04-14T17:49:13.413Z'\n"
  },
  {
    "path": "src/_data/comments/drawing-trees/comment-1377977017000.yml",
    "content": "id: comment-1024632962\ndate: 2013-08-31T19:23:37Z\nupdated: 2013-08-31T19:23:37Z\n_parent: /mastering-paper/drawing-trees/\nname: Chris Harbinson\nurl: ''\nmessage: \"Thank you for the wonderful guidance you are providing. I'll be awaiting\n  the next installment with the same eagerness I looked out for this one!\"\navatar: https://disqus.com/api/users/avatars/chrisharbinson.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-trees/comment-1377979372000.yml",
    "content": "id: comment-1024666610\ndate: 2013-08-31T20:02:52Z\nupdated: 2013-08-31T20:02:52Z\n_parent: /mastering-paper/drawing-trees/\nname: Kim\nurl: ''\nmessage: \"Excellent! Thank you for taking the time to put this guide together.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-trees/comment-1378115206000.yml",
    "content": "id: comment-1026186619\ndate: 2013-09-02T09:46:46Z\nupdated: 2013-09-02T09:46:46Z\n_parent: /mastering-paper/drawing-trees/\nname: Raadiya Lüssi-Begg\nurl:\nmessage: \"Love love this! I bought the full 53 simply because I think its an amazeballs\n  app and a great way for me to create my own graphics for my blog. Now i just need\n  to learn how to draw! Excited about receiving your next tutorial!\"\navatar: https://disqus.com/api/users/avatars/raadiyaluessibegg.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-trees/comment-1378316991000.yml",
    "content": "id: comment-1029823604\ndate: 2013-09-04T17:49:51Z\nupdated: 2013-09-04T17:49:51Z\n_parent: /mastering-paper/drawing-trees/\nname: David W Slack\nurl: http://davidwslack.com/\nmessage: \"Wow. Many thanks. This is brilliant. New to Paper but I love it already.\n  My work is in oil or oil pastel, and Paper will give me a great way to get the best\n  composition and keep me loosened up. The step by step is a great way to get stuck\n  in with fab results straight away. Good teacher. Cheers.\"\n"
  },
  {
    "path": "src/_data/comments/drawing-trees/comment-1398671612000.yml",
    "content": "id: comment-1358698413\ndate: 2014-04-28T07:53:32Z\nupdated: 2014-04-28T07:53:32Z\n_parent: /mastering-paper/drawing-trees/\nname: Baard Overgaard Hansen\nurl:\nmessage: \"Thanks for some great tutorials. Looking forward to the next ones.\"\navatar: https://disqus.com/api/users/avatars/baardoa.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-trees/comment-1454043552000.yml",
    "content": "id: comment-2484323760\ndate: 2016-01-29T04:59:12Z\nupdated: 2016-01-29T04:59:12Z\n_parent: /mastering-paper/drawing-trees/\nname: Sel Orm\nurl: ''\nmessage: \"On the 4th image on the grass tutorial, you have 2 zoom loupes on the\n  screen. Was this ever possible in paper previously ? How did you do it?\"\navatar: https://disqus.com/api/users/avatars/sel_orm.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-trees/comment-1454069139000.yml",
    "content": "replying_to: '6'\nid: comment-2484661104\ndate: 2016-01-29T12:05:39Z\nupdated: 2016-01-29T12:05:39Z\n_parent: /mastering-paper/drawing-trees/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"No that was never possible. Just a Photoshopped screenshot to show details.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-water/comment-1380489094000.yml",
    "content": "id: comment-1063820948\ndate: 2013-09-29T21:11:34Z\nupdated: 2013-09-29T21:11:34Z\n_parent: /mastering-paper/drawing-water/\nname: Chris Harbinson\nurl: ''\nmessage: \"Thanks you again, Michael. This is invaluable!\"\navatar: https://disqus.com/api/users/avatars/chrisharbinson.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-water/comment-1380502193000.yml",
    "content": "replying_to: '1'\nid: comment-1063982056\ndate: 2013-09-30T00:49:53Z\nupdated: 2013-09-30T00:49:53Z\n_parent: /mastering-paper/drawing-water/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You're very welcome. It's been fun documenting my process.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/drawing-water/comment-1380696432000.yml",
    "content": "id: comment-1066994181\ndate: 2013-10-02T06:47:12Z\nupdated: 2013-10-02T06:47:12Z\n_parent: /mastering-paper/drawing-water/\nname: Mudz69\nurl: ''\nmessage: \"Thanx for spending your time on this, it's informative and good fun to\n  have a go at!\"\navatar: https://disqus.com/api/users/avatars/mudz69.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-water/comment-1380990189000.yml",
    "content": "id: comment-1071566959\ndate: 2013-10-05T16:23:09Z\nupdated: 2013-10-05T16:23:09Z\n_parent: /mastering-paper/drawing-water/\nname: Ken Burke\nurl: ''\nmessage: \"Wanted to add my thanks, too! What great resource for the community!\n  Looking forward seeing you continue to expand on the great work you've already done.\"\navatar: https://disqus.com/api/users/avatars/disqus_NIkTHhb8Qs.jpg\n"
  },
  {
    "path": "src/_data/comments/drawing-water/comment-1381125001000.yml",
    "content": "id: comment-1073229708\ndate: 2013-10-07T05:50:01Z\nupdated: 2013-10-07T05:50:01Z\n_parent: /mastering-paper/drawing-water/\nname: Andreas\nurl: ''\nmessage: \"great tutorials. i never thought i could use paper this efficient\"\n"
  },
  {
    "path": "src/_data/comments/drawing-water/comment-1418528111000.yml",
    "content": "id: comment-1740999735\ndate: 2014-12-14T03:35:11Z\nupdated: 2014-12-14T03:35:11Z\n_parent: /mastering-paper/drawing-water/\nname: Mark\nurl: ''\nmessage: \"Thank you for the great tutorials. I really appreciate you taking the\n  time to teach.\"\n"
  },
  {
    "path": "src/_data/comments/erasing/comment-1426749852000.yml",
    "content": "id: comment-1915490879\ndate: 2015-03-19T07:24:12Z\nupdated: 2015-03-19T07:24:12Z\n_parent: /mastering-paper/erasing/\nname: Atiqur Sumon\nurl: http://www.clippingpathspecialist.com/\nmessage: \"Kids are liking your post very much because the kids always playing with\n  eraser they are know what is erased. Moreover, your suggestion is very important\n  basically who is always working art paper analysis, art, scratch, etc. I do share\n  your post because your post is very good.\"\navatar: https://disqus.com/api/users/avatars/atiqursumon.jpg\n"
  },
  {
    "path": "src/_data/comments/erasing/comment-1431422847000.yml",
    "content": "id: comment-2019921790\ndate: 2015-05-12T09:27:27Z\nupdated: 2015-05-12T09:27:27Z\n_parent: /mastering-paper/erasing/\nname: Sheikh Swapon\nurl:\nmessage: \"I know well MR. Michael Rose very expert about Blend (Smudge) to Erase.\"\navatar: https://disqus.com/api/users/avatars/Photo_clipping_path.jpg\n"
  },
  {
    "path": "src/_data/comments/erasing/comment-1490449760606.yml",
    "content": "_id: d89c20a0-1161-11e7-aba0-4d333bb705b7\n_parent: /mastering-paper/erasing/\nmessage: >-\n  how do i transfer my drawings to my laptop ?  When I go to my laptop and sign\n  on only a few of my drawings show up.  I would very much would like to see\n  what I do on all my devices. Thanks.\nname: Victor O Silva\nemail: 0d218474625037ebbd251d6486a02ee5\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-03-25T13:49:20.597Z'\n"
  },
  {
    "path": "src/_data/comments/erasing/comment-1490719042258.yml",
    "content": "_id: d0eb8560-13d4-11e7-a79e-7d9f47323e85\n_parent: /mastering-paper/erasing/\nmessage: \"Are you referring the Paper website? If yes that only shows your drawings and ideas that you've specifically shared to Paper via the **Public Stream**. If you don't want to make them publicly available you can save them to your camera roll (iPad or iPhone) and then email to yourself.\\r\\n\\r\\nOr use one of the many other sharing options Paper affords via the share sheet.\\r\\n\\r\\n![iOS share sheet](https://i.imgur.com/Y5vQu9G.jpg)\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '3'\nhidden: ''\ndate: '2017-03-28T16:37:22.255Z'\ntimestamp: 1490719042\n"
  },
  {
    "path": "src/_data/comments/erasing/comment-1501441514764.yml",
    "content": "_id: 049094a0-755a-11e7-b06f-2f7a7e302a25\n_parent: /mastering-paper/erasing/\nmessage: \"Yeah, pencil just does not, nor has it ever, simply erased. I have never been able to just flip the thing over and erase, like with a real pencil. I have the black and the maple, and neither do it. The eraser is treated just like a stylus tip, which makes for frustrating drawing...any ideas?\\r\\n\\r\\nJohn\"\nname: C. J. W. Johnson\nemail: 3f7221396ab762e2357b98afd4526c56\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-07-30T19:05:14.763Z'\n"
  },
  {
    "path": "src/_data/comments/erasing/comment-1501458789383.yml",
    "content": "_id: 3d002f30-7582-11e7-b06f-2f7a7e302a25\n_parent: /mastering-paper/erasing/\nmessage: \"1. Verify your Pencil is fully charged and [connected to Paper](https://support.fiftythree.com/hc/en-us/articles/201712591-Using-Pencil#connecting).\\r\\n2. Verify your Pencil is [updated to the latest firmware](https://support.fiftythree.com/hc/en-us/articles/201577742-Upgrading-the-Pencil-Firmware).\\r\\n\\r\\nIf it's still not erasing from the top then you probably have defective Pencils. I'd suggest reaching out to FiftyThree's support for further troubleshooting.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '4'\nhidden: ''\ndate: '2017-07-30T23:53:09.382Z'\n"
  },
  {
    "path": "src/_data/comments/faux-layer/comment-1432144791000.yml",
    "content": "id: comment-2036089315\ndate: 2015-05-20T17:59:51Z\nupdated: 2015-05-20T17:59:51Z\n_parent: /mastering-paper/faux-layer/\nname: Neomusashi\nurl: ''\nmessage: \"Thanks for a great starting point!\"\navatar: https://disqus.com/api/users/avatars/Neomusashi.jpg\n"
  },
  {
    "path": "src/_data/comments/faux-layer/comment-1436215043000.yml",
    "content": "id: comment-2120140392\ndate: 2015-07-06T20:37:23Z\nupdated: 2015-07-06T20:37:23Z\n_parent: /mastering-paper/faux-layer/\nname: jmueller\nurl: ''\nmessage: \"Amazing Tip! Just stumbled across. Thanks for sharing this! :-)\"\navatar: https://disqus.com/api/users/avatars/jmueller.jpg\n"
  },
  {
    "path": "src/_data/comments/faux-layer/comment-1444847560000.yml",
    "content": "id: comment-2307357695\ndate: 2015-10-14T18:32:40Z\nupdated: 2015-10-14T18:32:40Z\n_parent: /mastering-paper/faux-layer/\nname: Sophie Lynn\nurl: ''\nmessage: \"Awesome！Thanks for sharing！\"\n"
  },
  {
    "path": "src/_data/comments/faux-layer/comment-1492117216851.yml",
    "content": "_id: 31a5cff0-208c-11e7-afe4-4b76bc9e4338\n_parent: /mastering-paper/faux-layer/\nmessage: \"That faux layer idea is wonderful.  I'm doing a series of chibis to illustrate a children's\\r\\nbook and using a sketch layer (in another drawing program) of blue lines, didn't work.  this is much easier.\"\nname: Lynn Mason\nemail: 19976dbd37e6042f42d765c2f01bf5e7\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-04-13T21:00:16.843Z'\n"
  },
  {
    "path": "src/_data/comments/faux-layer/comment-1492129124617.yml",
    "content": "_id: eb318d90-20a7-11e7-afe4-4b76bc9e4338\n_parent: /mastering-paper/faux-layer/\nmessage: >-\n  An even easier method is to import your sketch as a photo \"layer\" which you\n  can draw/trace over. Then remove the layer when you're done, leaving behind\n  your drawing.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '4'\nhidden: ''\ndate: '2017-04-14T00:18:44.616Z'\n"
  },
  {
    "path": "src/_data/comments/github-pages-publishing-source/comment-1497161092518.yml",
    "content": "_id: e221e9b0-4e6b-11e7-95b8-c7b76d678654\n_parent: /til/github-pages-publishing-source/\nmessage: \"i guess that's why GitHub has made the gh-pages option difficult to find, lately\\r\\n\\r\\n/docs is the best indeed :)\"\nname: stefano\nemail: e66f980dd61617104c711bf0f0a6f186\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-06-11T06:04:52.516Z'\n"
  },
  {
    "path": "src/_data/comments/github-pages-publishing-source/comment-1555099604565.yml",
    "content": "_id: 7e7beab0-5d5e-11e9-8585-55af057739b9\n_parent: /notes/github-pages-publishing-source/\nname: Sean\nemail: 6c8f21bf7a90be54df6b318995f1a3f8\nurl: ''\nmessage: I don't have the drop down under GitHub Pages/Source!\nreplying_to: '1'\ndate: '2019-04-12T20:06:44.553Z'\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1373843710000.yml",
    "content": "id: comment-962239939\ndate: 2013-07-14T23:15:10Z\nupdated: 2013-07-14T23:15:10Z\n_parent: /articles/going-static/\nname: Rob Wierzbowski\nurl: ''\nmessage: \"If you're still looking for a responsive image solution for Jekyll I've\n  just finished a plugin called [Jekyll Picture Tag](https://github.com/robwierzbowski/jekyll-picture-tag). Any feedback appreciated.\"\navatar: https://disqus.com/api/users/avatars/robwierzbowski.jpg\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1374248081000.yml",
    "content": "replying_to: '1'\nid: comment-969086868\ndate: 2013-07-19T15:34:41Z\nupdated: 2013-07-19T15:34:41Z\n_parent: /articles/going-static/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Wow this plugin looks great!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1379416079000.yml",
    "content": "id: comment-1047796157\ndate: 2013-09-17T11:07:59Z\nupdated: 2013-09-17T11:07:59Z\n_parent: /articles/going-static/\nname: picajoso\nurl: ''\nmessage: \"Do you think Jekyll is suitable for a heavy updated site? If you have\n  to build the whole website each time you publish something then this option wouldn't\n  be acceptable. I've read somewhere that there is someway to build only the updated/new\n  posts, maintaining the rest of the site without changes.\"\navatar: https://disqus.com/api/users/avatars/picajoso.jpg\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1379419095000.yml",
    "content": "replying_to: '2'\nid: comment-1047831357\ndate: 2013-09-17T11:58:15Z\nupdated: 2013-09-17T11:58:15Z\n_parent: /articles/going-static/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Depends on how large the site is. I have around 700 posts and it takes\n  a few minutes to build the site. It can also depend on the sort of _plugins, using\n  related posts, the various generators you have going too, etc. If you it's a basic\n  site with under 50 posts it should build really fast.\\r\\n\\r\\nIt can get kind of bothersome\n  if you're writing new posts and want to view them locally before deploying, since\n  it has to rebuild the entire site. In that case you can tell Jekyll to limit it's\n  build to X amount of posts. I usually run it with `jekyll build --limit_posts 10`\n  to see the latest 10 posts. That builds fast and allows me to test before I do a\n  full site build.\\r\\n\\r\\nPretty sure it's on the radar of the Jekyll folks to address\n  this issue. But probably won't happen anytime soon.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1379450127000.yml",
    "content": "replying_to: '2'\nid: comment-1048401718\ndate: 2013-09-17T20:35:27Z\nupdated: 2013-09-17T20:35:27Z\n_parent: /articles/going-static/\nname: picajoso\nurl: ''\nmessage: \"Thanks for the feedback Michael, I agree with you, at first it seems\n  not a good idea. I've seen on Paul Stamatiou's site a good article on [this subject](http://paulstamatiou.com/how-to-wordpress-to-jekyll)\n  and he finishes linking to some patch that allows Jekyll to do [incremental regenerations](https://github.com/graysky/jekyll/commit/39ae8c7c3f4a3cffd095e3b7638cfa8025c5a67a).\\r\\n\\r\\nMaybe this could be useful,\n  regards! ;)\"\navatar: https://disqus.com/api/users/avatars/picajoso.jpg\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1415626124000.yml",
    "content": "---\nid: comment-1685693799\ndate: 2014-11-10T13:28:44Z\nupdated: 2014-11-10T13:28:44Z\n_parent: /articles/going-static/\nname: Samuel Sosina\nurl: http://sosina.me/\nmessage: \"Ive been thinking about using Jekyll for my new portfolio and your article\n  has completely settled my nerves! Did you get around to using Susy with Jekyll?\"\navatar: https://disqus.com/api/users/avatars/samuelsosina.jpg\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1415626349000.yml",
    "content": "replying_to: '3'\nid: comment-1685697673\ndate: 2014-11-10T13:32:29Z\nupdated: 2014-11-10T13:32:29Z\n_parent: /articles/going-static/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Not yet I haven't. I'm using Bourbon and Neat now and just need to figure\n  out what I want to do with the grid before I make the switch.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1431466796000.yml",
    "content": "id: comment-2021178716\ndate: 2015-05-12T21:39:56Z\nupdated: 2015-05-12T21:39:56Z\n_parent: /articles/going-static/\nname: ShuMo\nurl: ''\nmessage: \"I hear new in Jekyll 3.0 or on the road map is incremental regeneration\n  of the site, which would get rid of the problem of waiting for a full site build.\n  It was mentioned at JekyllConf.\"\navatar: https://disqus.com/api/users/avatars/ShuMo.jpg\n"
  },
  {
    "path": "src/_data/comments/going-static/comment-1453938901000.yml",
    "content": "id: comment-2482043395\ndate: 2016-01-27T23:55:01Z\nupdated: 2016-01-27T23:55:01Z\n_parent: /articles/going-static/\nname: Gavin Engel\nurl: ''\nmessage: 'You might want to investigate Strongloop Loopback Gateway in front of\n  your static website. It could be used to implement an \"admin panel\" on a static\n  site with OAuth.'\navatar: https://disqus.com/api/users/avatars/gavinengel.jpg\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1404681796000.yml",
    "content": "id: comment-1471203609\ndate: 2014-07-06T21:23:16Z\nupdated: 2014-07-06T21:23:16Z\n_parent: /mastering-paper/grid-method/\nname: Andy\nurl: ''\nmessage: \"Thanks for a great post.\\r\\n\\r\\nI've been following Paper Faces for quite\n  a while now. The skills you have developed over time are absolutely stunning. Thank\n  you so much for sharing your drawings and for showing us how you do it. Great\n  job!\\r\\n\\r\\nBest regards from Germany\"\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1408741037000.yml",
    "content": "id: comment-1555021567\ndate: 2014-08-22T20:57:17Z\nupdated: 2014-08-22T20:57:17Z\n_parent: /mastering-paper/grid-method/\nname: Morgan Craft\nurl: http://www.morgancraft.com\nmessage: \"I randomly stumbled onto your site from a Jekyll template design.  And\n  being a long time user of Studio 53 Paper app this was great to see.  Especially\n  since I'm like 1 of the 100's of people that have requested grid-paper options on\n  the paper apps customer-service system. But this is amazing, now I need to get\n  a t-square as trying to just use a ruler is poop.\"\navatar: https://disqus.com/api/users/avatars/morgancraft.jpg\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1408744437000.yml",
    "content": "replying_to: '2'\nid: comment-1555094041\ndate: 2014-08-22T21:53:57Z\nupdated: 2014-08-22T21:53:57Z\n_parent: /mastering-paper/grid-method/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Nice! I love Jekyll.\\r\\n\\r\\nAdd me to the list of those wanting support\n  for native grids in Paper. It would be even better if the grids were on their own\n  layer and you can toggle them on/off.\\r\\n\\r\\nYou might have better luck taking a\n  piece of cardboard and cutting your own T-square. I had a lot of problems using\n  metal and plastic ones I have laying around the house. They either slide around\n  too much on the iPad's glass screen or they register as a touch and won't let you\n  draw on the screen at the same time.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1410503147000.yml",
    "content": "id: comment-1585370368\ndate: 2014-09-12T06:25:47Z\nupdated: 2014-09-12T06:25:47Z\n_parent: /mastering-paper/grid-method/\nname: Nanika\nurl: ''\nmessage: \"I love your blog!\"\navatar: https://disqus.com/api/users/avatars/missnkki.jpg\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1419770628000.yml",
    "content": "id: comment-1761719429\ndate: 2014-12-28T12:43:48Z\nupdated: 2014-12-28T12:43:48Z\n_parent: /mastering-paper/grid-method/\nname: Freddyt\nurl: ''\nmessage: \"I would love to see an import option with this app... Still it's a very\n  nice app\"\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1455241232000.yml",
    "content": "id: comment-2509178135\ndate: 2016-02-12T01:40:32Z\nupdated: 2016-02-12T01:40:32Z\n_parent: /mastering-paper/grid-method/\nname: Eric Talerico\nurl: ''\nmessage: \"Michael, forgive me if you already know this trick BUT: once you have\n  your grid finished, you can export it to your camera roll and then import that grid\n  image into new drawings. You can make your drawing over the grid as you normally\n  would, and when you are finished, delete the grid. When you delete an imported image,\n  it just goes away without changing anything you drawn over it- so you don't have\n  to erase it through your drawing.\"\navatar: https://disqus.com/api/users/avatars/erictalerico.jpg\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1455241724000.yml",
    "content": "replying_to: '5'\nid: comment-2509188274\ndate: 2016-02-12T01:48:44Z\nupdated: 2016-02-12T01:48:44Z\n_parent: /mastering-paper/grid-method/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Eric. I wrote this way before you could import images in Paper.\n  Things are way easier now since you can just import a perfectly drawn grid image\n  or even use the Think Kit tools.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1455304633000.yml",
    "content": "replying_to: '5'\nid: comment-2510390272\ndate: 2016-02-12T19:17:13Z\nupdated: 2016-02-12T19:17:13Z\n_parent: /mastering-paper/grid-method/\nname: Eric Talerico\nurl: ''\nmessage: \"Michael, I am particularly fond of how easy it is now to remove a grid\n  once I'm done with it.\"\navatar: https://disqus.com/api/users/avatars/erictalerico.jpg\n"
  },
  {
    "path": "src/_data/comments/grid-method/comment-1505750732930.yml",
    "content": "_id: 327d9e50-9c8b-11e7-b9d9-19a672bf290b\n_parent: /mastering-paper/grid-method/\nmessage: I can't find out to get it out of landscape mode. Are that mode locked.\nname: Per Christensen\nemail: 9db76f3c90770d47a8e8f849ff250a7c\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-09-18T16:05:32.929Z'\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1378490781000.yml",
    "content": "id: comment-1032469944\ndate: 2013-09-06T18:06:21Z\nupdated: 2013-09-06T18:06:21Z\n_parent: /work/hpstr-jekyll-theme/\nname: Felipe Oliveira\nurl:\nmessage: \"Just for curiosity, what grid system you use in themes?\"\navatar: https://disqus.com/api/users/avatars/faoliveiras.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1378491505000.yml",
    "content": "replying_to: '1'\nid: comment-1032482904\ndate: 2013-09-06T18:18:25Z\nupdated: 2013-09-06T18:18:25Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"At one point I was using [The Semantic Grid System](http://semantic.gs/), but gave up on it. Instead I took the easy\n  way out and give all the content a 100% width for &lt; 768px breakpoints, and everything\n  else gets a max-width of around 900px.\\r\\n\\r\\n[Preboot's grid system](http://getpreboot.com/) also appealed to me because I use LESS\n  for my stylesheets.\\r\\n\\r\\n[Singularity](http://singularity.gs/) looks quite nice too, but I'm not a Sass man so I haven't given it a go yet.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1382267949000.yml",
    "content": "id: comment-1089577198\ndate: 2013-10-20T11:19:09Z\nupdated: 2013-10-20T11:19:09Z\n_parent: /work/hpstr-jekyll-theme/\nname: \"@sarat\"\nurl: ''\nmessage: \"I just pushed the whole branch to `master` and I found it's not working.\n  My CSS has screwed up as well. Tried `jekyll serve` in localhost but that's also\n  not working!\"\navatar: https://disqus.com/api/users/avatars/Rockr.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1382279338000.yml",
    "content": "replying_to: '2'\nid: comment-1089716483\ndate: 2013-10-20T14:28:58Z\nupdated: 2013-10-20T14:28:58Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Did you set `url:` properly in _config.yml?\\r\\n\\r\\nIf it's not set to your\n  domain when pushing live or left blank (or `http://localhost:4000`) then the CSS/JS\n  won't load because they rely on absolute paths in my theme.\\r\\n\\r\\nIf it is set properly\n  and still not working, link me to your repo and I'll take a look.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1382298797000.yml",
    "content": "replying_to: '2'\nid: comment-1090012647\ndate: 2013-10-20T19:53:17Z\nupdated: 2013-10-20T19:53:17Z\n_parent: /work/hpstr-jekyll-theme/\nname: \"@sarat\"\nurl: ''\nmessage: \"Thank you. It's working fine now. Btw, don't you support Github flavored\n  Markdown?\"\navatar: https://disqus.com/api/users/avatars/Rockr.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1382299442000.yml",
    "content": "replying_to: '2'\nid: comment-1090022684\ndate: 2013-10-20T20:04:02Z\nupdated: 2013-10-20T20:04:02Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Jekyll supports whatever flavor of Markdown you want. I prefer Kramdown\n  and that's what the theme comes with by default. But you can switch it out easily.\n  See [jekyllrb.com](http://jekyllrb.com) for details on all that.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1382331744000.yml",
    "content": "id: comment-1090405607\ndate: 2013-10-21T05:02:24Z\nupdated: 2013-10-21T05:02:24Z\n_parent: /work/hpstr-jekyll-theme/\nname: Robpol86\nurl: http://www.robpol86.com/\nmessage: \"This theme looks great! I just migrated my gh pages site from so simple\n  to hpstr. Good work!\"\navatar: https://disqus.com/api/users/avatars/Robpol86.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1384875475000.yml",
    "content": "id: comment-1129669426\ndate: 2013-11-19T15:37:55Z\nupdated: 2013-11-19T15:37:55Z\n_parent: /work/hpstr-jekyll-theme/\nname: Kat\nurl: ''\nmessage: \"How can a non-techie install on a WordPress blog?  I am used to tweaking\n  things in the WordPress admin panel, but am not familiar with Jekyll or coding.\\r\\n\\r\\nPerhaps most of your audience is more tech savvy, but you attract general artists\n  too I'm sure. Are you going to start a theme biz? I love your design, and even\n  if I do not know how to install your themes, they are simple and beautiful, what\n  I look to use. Enjoy your art and blog much.\"\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1384875785000.yml",
    "content": "replying_to: '4'\nid: comment-1129675848\ndate: 2013-11-19T15:43:05Z\nupdated: 2013-11-19T15:43:05Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Kat. This theme is only for Jekyll, I haven't ported it over to\n  WordPress. You're right, Jekyll is a lot to take in.\\r\\n\\r\\nHave no plans for starting\n  a theme biz, I'm just doing this for fun and sharing what I've come up with by playing\n  around with my own personal site. There are so many good Wordpress themes out there\n  I don't think I would be able to keep up with the competition.\\r\\n\\r\\nWith Jekyll\n  there is barely any themes out there, so the expectations are much much lower. ;-)\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1385307053000.yml",
    "content": "id: comment-1137153368\ndate: 2013-11-24T15:30:53Z\nupdated: 2013-11-24T15:30:53Z\n_parent: /work/hpstr-jekyll-theme/\nname: prometheus2305\nurl: ''\nmessage: \"This is a really fantastic theme I am trying to use and works great when\n  I serve it through localhost but for reason is not working when I upload my `_site`\n  folder to s3? Any idea why that might be?\"\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1385310110000.yml",
    "content": "replying_to: '5'\nid: comment-1137217501\ndate: 2013-11-24T16:21:50Z\nupdated: 2013-11-24T16:21:50Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"\\\"Not working\\\" is fairly vague so I'm just taking a stab here that your\n  styles and such aren't loading properly. The number one culprit for that is due\n  to not setting `site.url` properly in `_config.yml`\\r\\n\\r\\nWhen serving locally it needs\n  to be either left blank or set to your localhost server (eg. `http://localhost:4000`).\n  When uploading to your web server it needs match the domain you're serving from\n  or else you'll experience broken links galore.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1385320193000.yml",
    "content": "replying_to: '5'\nid: comment-1137389558\ndate: 2013-11-24T19:09:53Z\nupdated: 2013-11-24T19:09:53Z\n_parent: /work/hpstr-jekyll-theme/\nname: prometheus2305\nurl: ''\nmessage: \"Absolutely correct. Sorry about being vague but you understood exactly\n  the issue. I had to remove the `url` from the `_config.yml` file all together and just\n  use the config in `s3_website.yml` and it did the trick. Still learning how all of\n  this works. Thank you again for the response and for creating one of the best themes\n  I've seen.\"\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1387334931000.yml",
    "content": "id: comment-1168277096\ndate: 2013-12-18T02:48:51Z\nupdated: 2013-12-18T02:48:51Z\n_parent: /work/hpstr-jekyll-theme/\nname: Mitch Pronschinske\nurl: ''\nmessage: \"Amazing theme. I am constantly in awe that this is how my blog looks.\\r\\n\\r\\nOne question: a problem I haven't been able to solve...\\r\\n\\r\\nI've tried modifying the **pygments.less** `.font(15);` section to make the code snippet text bigger and I've tried to make the entire blog's body font bigger in **variables.less** `@doc-font-size:\n  18;`\\r\\n\\r\\nI'm on Windows and node and grunt are installed properly. I ran `npm install`\n  in the theme folder and then I tried modifying the fonts in those less files a couple\n  times and then running grunt. I the `min.css` is recreated and I think it all runs\n  properly except for the image minifier.\n  \\r\\n\\r\\n```\\r\\nRunning \\\"recess:dist\\\" (recess) task\\r\\nFile \\\"assets/css/main.min.css\\\" created.\\r\\nOriginal: 68310 bytes.\\r\\nMinified:\n  53648 bytes.\\r\\nRunning \\\"uglify:dist\\\" (uglify) task\\r\\nFile \\\"assets/js/scripts.min.js\\\"\n  created.\\r\\nRunning \\\"imagemin:dist\\\" (imagemin) task\\r\\nFatal error: spawn ENOENT\\r\\n```\\r\\n\\r\\nBut\n  the fonts never change their size when I look at the blog after doing this and I\n  also inspected the text to confirm that the fonts didn't change. Am I missing\n  something?\"\navatar: https://disqus.com/api/users/avatars/mpron.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1387336844000.yml",
    "content": "replying_to: '6'\nid: comment-1168300703\ndate: 2013-12-18T03:20:44Z\nupdated: 2013-12-18T03:20:44Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks man!\\r\\n\\r\\nChanging the the font-size on the .highlight class\n  in `pygments.less` should have worked but I just noticed that I put a font-size on\n  the pre element, and because of how the cascade works that size is overriding the\n  one you set on `.highlight`.\\r\\n\\r\\nIf you edit the pre element's font-size in `typography.less`\n  on line 132 you should be all set.\\r\\n\\r\\nI bounce back between Windows and Mac OS\n  X and noticed the same error when I was running grunt on a Windows 7 setup. If I\n  remember correctly when you run `npm install` from the CLI a few dependencies\n  for `grunt-contrib-imagemin` don't install properly and that's what the ENOENT error\n  is referring to.\\r\\n\\r\\nI think the fix was to add a line to the `package.json` file\n  to install an older `jpegtran-bin` dependency that will actually compile on a Windows\n  7 machine. If you add\\r\\n\\r\\n`\\\"jpegtran-bin\\\": \\\"0.2.0\\\"` to devDependencies in\n  `package.json` and then run `npm install` see if everything installs properly for\n  `grunt-contrib-imagemin` and then try running grunt again. You might have to dump\n  your `node_modules` folder first before running `npm install`, I'm not sure.\\r\\n\\r\\nIf\n  imagemin still doesn't work you could always use `grunt-imgcompress` instead and\n  modify the grunt tasks or just remove it all together. That's what I'm using on\n  this site (see my Made Mistakes repo to lift the grunt tasks).\\r\\n\\r\\nLet me know\n  how it goes and if you hit any other hiccups.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1387382934000.yml",
    "content": "replying_to: '6'\nid: comment-1168846228\ndate: 2013-12-18T16:08:54Z\nupdated: 2013-12-18T16:08:54Z\n_parent: /work/hpstr-jekyll-theme/\nname: Mitch Pronschinske\nurl: ''\nmessage: \"I got the changes in `pygments.less` fonts to start working. I'm not sure\n  the modifications to `variables.less` for the body font (`@doc-font-size:` ) are working. Here's\n  [my blog with your theme](http://mpron.github.io) :)\\r\\n\\r\\nThe\n  new line in the package.json file didn't let the `npm install` run properly (I\n  also tried adding `grunt-` to the front of it to match the others items).  How do\n  you 'dump' the `node_modules` folder?  Delete everything in it and paste in the\n  folder from the original repo?\\r\\n\\r\\nWhat files would I need to take from the Made\n  Mistakes repo to be able to use `grunt-imgcompress`?\"\navatar: https://disqus.com/api/users/avatars/mpron.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1387383560000.yml",
    "content": "replying_to: '6'\nid: comment-1168858797\ndate: 2013-12-18T16:19:20Z\nupdated: 2013-12-18T16:19:20Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"There are a few spots where I didn't declare font-sizes on elements and\n  just let them use browser defaults, so that could be why you're not seeing any size\n  changes. Just inspect the elements you want to alter in web dev tools and then apply\n  an appropriate font-size in the .less files\\r\\n\\r\\nTo make the change to `grunt-imgcompress`\n  I basically swapped out any reference to `imagemin` with it. Here's a gist that you\n  can grab the [modified `package.json`](https://gist.github.com/mmistakes/142618b8ed2e16850bc0) and `Gruntfile.js` files. After you copy those\n  into your repo just delete the `node_modules` folder and then run `npm install`. It'll\n  download and install everything it needs and rebuild the modules.\\r\\n\\r\\nThat should hopefully\n  clear everything up for you. I'm still new to Node and Grunt myself, so I'm by no\n  means a pro.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1387503726000.yml",
    "content": "replying_to: '6'\nid: comment-1170957478\ndate: 2013-12-20T01:42:06Z\nupdated: 2013-12-20T01:42:06Z\n_parent: /work/hpstr-jekyll-theme/\nname: Mitch Pronschinske\nurl: ''\nmessage: \"Nice. The grunt command runs without errors now. Still can't figure\n  out how to change the body font size though. And somehow I made the menu text smaller,\n  which is not what I want. Any clue what I could have done? [repo](https://github.com/mpron/mpron.github.io)\"\navatar: https://disqus.com/api/users/avatars/mpron.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1387507127000.yml",
    "content": "replying_to: '6'\nid: comment-1171004112\ndate: 2013-12-20T02:38:47Z\nupdated: 2013-12-20T02:38:47Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"That's good to hear. I think I mentioned it before but I didn't declare\n  font sizes on all the text elements, so that could be why changing the `doc-font-size`\n  variable has no effect. To change the entry content size look play around with the\n  font-size set on `.entry-content`. Anywhere else you might have to add a font-size\n  declaration to the element to override any browser defaults I didn't clear out in\n  the CSS reset.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1401061948000.yml",
    "content": "id: comment-1404116881\ndate: 2014-05-25T23:52:28Z\nupdated: 2014-05-25T23:52:28Z\n_parent: /work/hpstr-jekyll-theme/\nname: Bryan\nurl: ''\nmessage: \"Hi! Just want to say that the theme looks great! I would really like\n  to use it for a site I'm making. However, I'm running into some trouble with linking\n  back to home page. I'm currently leaving the `url` field in `_config.yml` blank because\n  I'm using Github Pages to host but I am unable to link back to the Home page from\n  some of the other pages. Should I set the `url` field to the url of the github page?\"\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1401066644000.yml",
    "content": "replying_to: '7'\nid: comment-1404179013\ndate: 2014-05-26T01:10:44Z\nupdated: 2014-05-26T01:10:44Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yup. Set the domain to whatever your GH one is and those home links should\n  work. Make sure you set it back to blank or `http://localhost:4000` when working locally\n  or all your links will be goofed.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1401597076000.yml",
    "content": "id: comment-1414405319\ndate: 2014-06-01T04:31:16Z\nupdated: 2014-06-01T04:31:16Z\n_parent: /work/hpstr-jekyll-theme/\nname: nwatkins\nurl: ''\nmessage: \"I'd like to have the main page load with the navigation menu open, but\n  closed on other pages. Would this be possible to hack up?\"\navatar: https://disqus.com/api/users/avatars/nwatkins.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1401640822000.yml",
    "content": "replying_to: '8'\nid: comment-1414918053\ndate: 2014-06-01T16:40:22Z\nupdated: 2014-06-01T16:40:22Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I'm sure it's possible but you'll have to hack up the CSS and JS a bit\n  to do it. I'd start with finding a way you're happy with applying a id or class\n  to the body tag... on just the homepage. That will give you a hook to style the\n  menu differently on just that page and hopefully allow you to keep it open there\n  and revert to the close position on every other page.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1409683191000.yml",
    "content": "id: comment-1570687470\ndate: 2014-09-02T18:39:51Z\nupdated: 2014-09-02T18:39:51Z\n_parent: /work/hpstr-jekyll-theme/\nname: fred\nurl: ''\nmessage: \"Hi, I've forked hpstr and I'm working to make it RTL'ed! I've made\n  some changes in `/hpstr-jekyll-theme/tree/master/assets/css`, but they are not affected\n  on my site while any change in `_config.yml` is effected.\"\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1409684508000.yml",
    "content": "replying_to: '9'\nid: comment-1570722155\ndate: 2014-09-02T19:01:48Z\nupdated: 2014-09-02T19:01:48Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Did you edit `main.min.css` or `main.css`? The theme uses the minified version\n  so if you only made changes to `main.css` that's why they're not showing up.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1409689561000.yml",
    "content": "replying_to: '9'\nid: comment-1570912059\ndate: 2014-09-02T20:26:01Z\nupdated: 2014-09-02T20:26:01Z\n_parent: /work/hpstr-jekyll-theme/\nname: fred\nurl: ''\nmessage: \"Oops, Now it's working by editing `main.min.css`. thanks.\\r\\n\\r\\nAnother\n  question:\\r\\nHow to exchange `>` with `<` that is shown under menu (Notice\n  to `About`)?\\r\\n\\r\\nFor people: these are some code that I have added them to `main.min.css`\n  to make RTL this awesome template: <http://paste.ubuntu.com/8217972/>\"\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1409708937000.yml",
    "content": "replying_to: '9'\nid: comment-1571312347\ndate: 2014-09-03T01:48:57Z\nupdated: 2014-09-03T01:48:57Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Those characters are added using `:after` pseudo classes on the list items\n  in the menu. It's easier to follow what's going on in the [source `less` file](https://github.com/mmistakes/hpstr-jekyll-theme/blob/1.3.2/assets/less/dl-menu.less) so I'd suggest making your\n  edits there and compiling it into `main.min.css` or I suppose you could just work\n  with the minified .css directly.\\r\\n\\r\\nBasically I'm using the Font Awesome webfont\n  on those elements and inserting a Font Awesome icon using CSS `content` declarations. Look\n  around line 101.\\r\\n\\r\\nTo swap the icon you'll need to find the one you want and\n  use the corresponding Unicode. For example, to flip `>`\n  to `<` you'd change `\\\\f105` to `\\\\f104`.\\r\\n\\r\\nHope this helps.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1409755306000.yml",
    "content": "replying_to: '9'\nid: comment-1572007117\ndate: 2014-09-03T14:41:46Z\nupdated: 2014-09-03T14:41:46Z\n_parent: /work/hpstr-jekyll-theme/\nname: fred\nurl: ''\nmessage: \"Great; I did it via `main.min.css` simply by changing 105 to 104 :)\\r\\n\\r\\nmy last questions: `2011-03-10-sample-post.md`\n  --&gt; SAMPLE POST WAS PUBLISHED ON MARCH 10, 2011 (REVISED: 05/31/2013) MICHAEL\n  ROSE --&gt; It's working with Gregorian calendar, while native date, here, is\n  Hegirae! (Also copyright date at footer)\"\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1409756965000.yml",
    "content": "replying_to: '9'\nid: comment-1572049769\ndate: 2014-09-03T15:09:25Z\nupdated: 2014-09-03T15:09:25Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You need to modify the theme's layouts. If you look for occurrences of\n  `{{ <a href=\\\"http://page.date\\\">page.date</a> }}` and `{{ <a href=\\\"http://post.date\\\">post.date</a> }}` in the various _layouts they have Liquid filters\n  applied to convert the date into different formats.\\r\\n\\r\\nHere's a [good blog post](http://alanwsmith.com/jekyll-liquid-date-formatting-examples)\n  showing how they work and a bunch of examples.\\r\\n\\r\\n\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1415694745000.yml",
    "content": "id: comment-1687438679\ndate: 2014-11-11T08:32:25Z\nupdated: 2014-11-11T08:32:25Z\n_parent: /work/hpstr-jekyll-theme/\nname: hacke2\nurl: ''\nmessage: \"how modify highlight font?\"\navatar: https://disqus.com/api/users/avatars/hacke2.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1415711210000.yml",
    "content": "replying_to: '10'\nid: comment-1687661273\ndate: 2014-11-11T13:06:50Z\nupdated: 2014-11-11T13:06:50Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"By editing the site's CSS. The main stylesheet is broken up into various\n  Sass partials. I'd start with `_variables.scss` since that defines most of the themes\n  colors and fonts.\\r\\n\\r\\nAnything else and you'll have to poke around the [other partials](https://github.com/mmistakes/hpstr-jekyll-theme/tree/master/_sass)\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1415712041000.yml",
    "content": "replying_to: '10'\nid: comment-1687684676\ndate: 2014-11-11T13:20:41Z\nupdated: 2014-11-11T13:20:41Z\n_parent: /work/hpstr-jekyll-theme/\nname: hacke2\nurl: ''\nmessage: \"Thanks, I modified the `main.min.css`...\"\navatar: https://disqus.com/api/users/avatars/hacke2.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1418852181000.yml",
    "content": "id: comment-1747434321\ndate: 2014-12-17T21:36:21Z\nupdated: 2014-12-17T21:36:21Z\n_parent: /work/hpstr-jekyll-theme/\nname: Tim Erwin\nurl: ''\nmessage: \"I love the menu on this theme and I'm using it as inspiration for one\n  I'm doing. excellent work! one issue I noticed is that you mentioned the menu is\n  totally usable when javascript is disabled, so I tried it and the menu completely\n  disappeared? I'm using latest chrome on mac.\"\navatar: https://disqus.com/api/users/avatars/timerwin.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1418857828000.yml",
    "content": "replying_to: '11'\nid: comment-1747573522\ndate: 2014-12-17T23:10:28Z\nupdated: 2014-12-17T23:10:28Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Looks like you found a bug in the CSS. When I converted the menu styles\n  into Sass partials I must have left out a few declarations that used to display\n  the menu expanded when JS is disabled. I just pushed a [quick fix to GitHub](https://github.com/mmistakes/hpstr-jekyll-theme/commit/c731e8cc825e22f235450968aad1d86a985bc20f).\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1422710194000.yml",
    "content": "id: comment-1827253924\ndate: 2015-01-31T13:16:34Z\nupdated: 2015-01-31T13:16:34Z\n_parent: /work/hpstr-jekyll-theme/\nname: JohnWatsonDev\nurl:\nmessage: \"Dear Michael Rose~\\r\\n\\r\\nThx for the post. I'm an android developer without\n  any web skill, I want use this theme.\\r\\n\\r\\nThx in advance~\"\navatar: https://disqus.com/api/users/avatars/johnwatsondev.jpg\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1422719464000.yml",
    "content": "replying_to: '12'\nid: comment-1827438847\ndate: 2015-01-31T15:51:04Z\nupdated: 2015-01-31T15:51:04Z\n_parent: /work/hpstr-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Check out the [theme's documentation on GitHub](https://mmistakes.github.io/hpstr-jekyll-theme/theme-setup/). I explain all the features\n  and how to set it up with Jekyll.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/hpstr-jekyll-theme/comment-1445196870000.yml",
    "content": "id: comment-2313907616\ndate: 2015-10-18T19:34:30Z\nupdated: 2015-10-18T19:34:30Z\n_parent: /work/hpstr-jekyll-theme/\nname: Jian Jin\nurl: ''\nmessage: \"Thank you for this awesome template! I love it! May I connect with you\n  on LinkedIn?\"\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1481460884456.yml",
    "content": "_id: fcefdef0-bfa0-11e6-8f5c-bda410f1d942\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Thanks for writing the steps in such details. I think yours is the only blog that has been laying out the details of using __Staticman__ as the experience that followed.\\r\\n\\r\\nYour website is one of the most, if not the most articulate example of web design I have come across, both aesthetically and technically. You are always constantly redesigning and improving this site, playing with cutting edge tech. I can only imagine what else happens before generating the site. :)\\r\\n**How much time do you spend coding this site on average?** If you do not mind me asking of course. I am asking because I am currently scared of the level of commitment that is required to treat your website as a piece of art....\\r\\n\\r\\n_This comment became so lengthy that I emailed you the rest._\"\nemail: 2b5f4253acf477e13cea08554f070fef\nname: Arnab Wahid\nurl: ''\nhidden: ''\ndate: '2016-12-11T12:54:44.455Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1481474339051.yml",
    "content": "_id: 50780dd0-bfc0-11e6-8f5c-bda410f1d942\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  Wow, this looks amazing! I'm definitely going to check it out...I'll be\n  launching a new Jekyll-powered magazine soon and have considered comments but\n  I definitely want to avoid Disqus if possible.\nemail: c3251b8885318878b80fa28467944879\nname: Jared White\nurl: 'https://jaredwhite.com'\nhidden: ''\ndate: '2016-12-11T16:38:59.049Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1481479533346.yml",
    "content": "_id: 6888acc0-bfcc-11e6-8f5c-bda410f1d942\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '1'\nmessage: \"If you added up all the time I've spent on the site over the years it's probably a :poop: ton! Writing articles definitely eats up most of the time. It takes me forever to write even the simplest post... which is why I don't post all that often.\\r\\n\\r\\nArticles of this length tend to take me 5--20 hours to produce over the course of a week or two. Just from all the distractions and other commitments in my life... can be hard to focus on a single thing at once :flushed:.\\r\\n\\r\\nThe design and layout stuff comes much faster. I'm constantly making small adjustments as I experiment with new things. I don't get too hung up if I break something here, it's one big learning experience for me.\"\nemail: 1ce71bc10b86565464b612093d89707e\nname: Michael Rose\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-12-11T18:05:33.341Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1481624126585.yml",
    "content": "_id: 10d27860-c11d-11e6-afae-8f3a543234e4\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"To speed up the build time I used a Docker image in Travis. With this I don't have to wait for the installation of all Jekyll dependencies.\\r\\nThe size is WIP but you can get some ideas from my [Travis config, and Dockerfile.\\r\\n](https://github.com/zburgermeiszter/blog.burgermeiszter.com/blob/master/.travis.yml)\"\nemail: 183cace68094ae879629ba4840b13c56\nname: Zoltan Burgermeiszter\nurl: 'https://blog.burgermeiszter.com'\nhidden: ''\ndate: '2016-12-13T10:15:26.577Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1481658090053.yml",
    "content": "_id: 249f30a0-c16c-11e6-afae-8f3a543234e4\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '3'\nmessage: \"How many posts do you have? Having close to 1,000 posts I've found they bog things down way more than installing dependencies ever could.\\r\\n\\r\\nFound [this article](http://savaslabs.com/2016/10/19/optimizing-jekyll-with-gulp.html) that introduced me to the idea of having Jekyll do less and use [Gulp](http://gulpjs.com/) to do some of the heavy lifting (preprocessing Sass, concatenating/minifying JS, optimizing images, minifying HTML, etc.) instead\\r\\n\\r\\nWas able to [shave a few minutes off the build time](https://github.com/mmistakes/made-mistakes-jekyll/issues/49) doing just that. It complicates the build process slightly but has the advantage of not being as reliant on Jekyll --- if I ever decide to switch to a different static site generator.\"\nemail: 1ce71bc10b86565464b612093d89707e\nname: Michael Rose\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-12-13T19:41:30.051Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1481731561641.yml",
    "content": "_id: 35003060-c217-11e6-92af-6b8d5992a359\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  Thank you for this article. It's awesome, I have successfully added static\n  comments to jekyll. I noticed that you do not use Akismet. Is there any reason\n  for this?\nemail: cbd841d40a5279069359827a9b3f9fd6\nname: Domantas\nurl: ''\nhidden: ''\ndate: '2016-12-14T16:06:01.640Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1481741970849.yml",
    "content": "_id: 7174f2c0-c22f-11e6-92af-6b8d5992a359\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '4'\nmessage: \"I tried enabling Akismet with the following but it never quite worked:\\r\\n\\r\\n```yaml\\r\\nakismet:\\r\\n  enabled: true\\r\\n  author: \\\"name\\\"\\r\\n  authorEmail: \\\"email\\\"\\r\\n  authorUrl: \\\"url\\\"\\r\\n  content: \\\"message\\\"\\r\\n  type: \\\"comment\\\"\\r\\n```\\r\\n\\r\\nWere you able to get it working?\\r\\n\\r\\nFrom this [line in Staticman's documenation](https://staticman.net/docs/configuration#akismet.enabled) I got the feeling the public instance of Staticman needed it setup. Wasn't sure if that was the case or if it was only for those running their own instances of the app.\\r\\n\\r\\n> **akismet.enabled** Whether to use Akismet to check entries for spam. This requires an Akismet account to be configured in the Staticman API instance being used.\"\nemail: 1ce71bc10b86565464b612093d89707e\nname: Michael Rose\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-12-14T18:59:30.845Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1484103390668.yml",
    "content": "_id: 8d5ff5e0-d7a9-11e6-9d0d-491faa75843b\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Hi Michael.\\r\\n\\r\\nAny chance you're going to update minimal-mistakes to support the new staticman features like threading and reply notification? You're Jekyll-fu is stronger than mine.\"\nname: Doug Langille\nemail: a12cc667f733ace5a90e6c3e961a9d79\nhidden: ''\ndate: '2017-01-11T02:56:30.667Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1484105090367.yml",
    "content": "_id: 827860a0-d7ad-11e6-9d0d-491faa75843b\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '5'\nmessage: \"I'd like to. Just need to give it some thought so I can come up with a way to support the new stuff in Staticman while maintaining backwards compatibility. \\r\\n\\r\\nThere are some changes needed to use v2 which could break things for those who don't update to the new `staticman.yml` config.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-01-11T03:24:50.367Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485221585967.yml",
    "content": "_id: 0daf1340-e1d5-11e6-b7c4-7beb5d4413a0\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  I have a hosting provider for my site and Looking to migrate from Disqus. Is a\n  github repo required?  Can this be setup using mmistakes and not on GitHub\n  pages?\nname: Justin Rummel\nemail: 812849b04c44245ad29c0e40cb84e3da\nhidden: ''\ndate: '2017-01-24T01:33:05.966Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485262979779.yml",
    "content": "_id: 6e3f6010-e235-11e6-96e4-b7df93ebae0a\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '6'\nmessage: \"Yes a GitHub repo is required for [Staticman](https://staticman.net/docs/) to work. It needs collaboration access to the repo to create pull requests against it to add the comment `_data` files. You don't have to host your site with GitHub Pages though.\\r\\n\\r\\nI host with Media Temple but have my repo on GH. The workflow goes something like: new comment submitted > Staticman creates a pull request to add to site's repo > merge pull request > re-build site > deploy.\\r\\n\\r\\nDepending on how you deploy your site some of this may vary slightly. Previously I was building locally each time I merged in a new comment then rsync'd the contents of `_site` to my hosting. Now I use [Travis CI](https://travis-ci.org/) to build my site after merges and it handles the deployments automatically.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-01-24T13:02:59.771Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485263102754.yml",
    "content": "_id: b78db3c0-e235-11e6-96e4-b7df93ebae0a\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '6'\nmessage: >-\n  And yes, Minimal Mistakes [supports Staticman\n  comments](https://mmistakes.github.io/minimal-mistakes/docs/configuration/#static-based-comments-via-staticman).\n  I haven't updated it to support `v2` that can handle replies and comment\n  notifications. But that shouldn't be too hard for you to tackle if you follow\n  what I did in this post.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-01-24T13:05:02.751Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485550986001.yml",
    "content": "_id: ff6154e0-e4d3-11e6-9519-6b61b17d6497\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '6'\nmessage: >-\n  I now have Travis configured.  I can display old Disqus comments, now to\n  figure out how to post comments!\nname: Justin Rummel\nemail: 812849b04c44245ad29c0e40cb84e3da\nhidden: ''\ndate: '2017-01-27T21:03:05.999Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485776306404.yml",
    "content": "_id: 9cdbc490-e6e0-11e6-bdca-7de5d7664428\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '6'\nmessage: \"Success. I now have parent/child comments using Staticman v2 and Travis. \\r\\n\\r\\nLast step is the Mailgun integration. \\r\\n\\r\\nPublic Test URL: https://www.justinrummel.com/macworld-2010-pictures/\"\nname: Justin Rummel\nemail: 812849b04c44245ad29c0e40cb84e3da\nhidden: ''\ndate: '2017-01-30T11:38:26.403Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485812680030.yml",
    "content": "_id: 4d2b8700-e735-11e6-b343-1ffafc11d3fd\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '6'\nmessage: \"Nice! FYI when I hit your site I'm getting warnings in Chrome related to SSL. Not sure if something is up with your certificate or what.\\r\\n\\r\\n```\\r\\nYour connection is not private\\r\\n\\r\\nAttackers might be trying to steal your information from www.justinrummel.com (for example, passwords, messages, or credit cards).\\r\\nNET::ERR_SSL_PINNED_KEY_NOT_IN_CERT_CHAIN\\r\\n```\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-01-30T21:44:40.011Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485989740666.yml",
    "content": "_id: 8d9f3910-e8d1-11e6-86ff-e7ada9208c07\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to:\nmessage: >-\n  I have been trying to update my copy of minimal mistakes with this. I have it\n  almost working but the jquery. How do you get the function to hook into the\n  form so it does not redirect the user?\nname: David Jones\nemail: 14a298db4912733411bb8d3067b478bc\nhidden: ''\ndate: '2017-02-01T22:55:40.666Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1485995518222.yml",
    "content": "_id: 0142b9c0-e8df-11e6-86ff-e7ada9208c07\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '7'\nmessage: >-\n  Have a look at [Justin's repo](https://github.com/justinrummel/jr.com-mm). He\n  has Staticman `v2` working with Minimal Mistakes.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-02-02T00:31:58.222Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1486056520229.yml",
    "content": "_id: 0948eca0-e96d-11e6-9036-933179d399bb\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '7'\nmessage: \"Thanks, I got it working with some amount of my changes plus his. \\r\\n\\r\\nStill can't get Mailgun to work.\"\nname: David Jones\nemail: 14a298db4912733411bb8d3067b478bc\nhidden: ''\ndate: '2017-02-02T17:28:40.228Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1487392474995.yml",
    "content": "_id: 8c6bee20-f593-11e6-9839-f7b8b79f4a11\n_parent: /articles/improving-jekyll-static-comments/\nmessage: Nice tutorial. Thanks.\nname: John\nemail: 2c31a17682b8685d630f31f2ec43f7bb\nhidden: ''\ndate: '2017-02-18T04:34:34.994Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1488548814588.yml",
    "content": "_id: dc7e1df0-0017-11e7-b7bc-a598a5c84f44\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  You said you got comment notifications working... I'm going to test them out\n  here and see if I get notified. I've been trying to get this working on my own\n  site and don't understand how the two uses of `options[parent]` don't\n  conflict.\nname: Chuck Masterson\nemail: 08ed66551d57a545c0d07b7b659e4076\nhidden: ''\ndate: '2017-03-03T13:46:54.581Z'\ntimestamp: 1488548814\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1488553821919.yml",
    "content": "_id: 851dd670-0023-11e7-b7bc-a598a5c84f44\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '9'\nmessage: \"My understanding is `options[parent]` are `options[origin]` are two different things, the later used to track which thread you're currently subscribed to. But not entirely sure if that's how it works since I haven't had a lot of luck fully testing email notifications.\\r\\n\\r\\nLet me know if you get a notification once this comment is merged in and posted.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-03-03T15:10:21.918Z'\ntimestamp: 1488553821\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1488881391127.yml",
    "content": "_id: 338b2a30-031e-11e7-9cfb-db5ce023a11d\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  Can I know when timestamp value is made in comment data file? It is hard to\n  check it but looks important to show the comment order correctly.\nname: John\nemail: d61e23032f71d8620bd1e33168d235cf\nhidden: ''\ndate: '2017-03-07T10:09:51.121Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1488890174632.yml",
    "content": "_id: a6f1ebd0-0332-11e7-9cfb-db5ce023a11d\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '10'\nmessage: >-\n  The timestamp is appended to the data file by Staticman when its received. You\n  have to [enable it in your\n  config](https://staticman.net/docs/configuration#generatedFields) under the\n  `generatedFields` array. There's a couple of different formats you can use...\n  I went with `iso8601`.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-03-07T12:36:14.630Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1488969645855.yml",
    "content": "_id: af8b0150-03eb-11e7-a7a9-e79dd357dba9\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  How do you apply reCaptcha for staticman? Now it is always showing \"Missing\n  reCAPTCHA API credentials\" I encrypted secret using staticman.\nname: Chris\nemail: d61e23032f71d8620bd1e33168d235cf\nhidden: ''\ndate: '2017-03-08T10:40:45.854Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1488978650754.yml",
    "content": "_id: a6bffac0-0400-11e7-a7a9-e79dd357dba9\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '11'\nmessage: \"I had the same issue. Apparently there was an API change with the latest release of Staticman. In the form, changing`options[reCaptcha][encryptedSecret]` to `options[reCaptcha][secret]` fixed it for me.\\r\\n\\r\\nThere's an [open issue](https://github.com/eduardoboucas/staticman/issues/20#issuecomment-284151035) on the Staticman repo if that doesn't end up solving it for you.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-03-08T13:10:50.753Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1489052011587.yml",
    "content": "_id: 7544c790-04ab-11e7-ba06-2b8e95b695ca\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '11'\nmessage: Fixed. Thanks for comment. =)\nname: Chris\nemail: d61e23032f71d8620bd1e33168d235cf\nhidden: ''\ndate: '2017-03-09T09:33:31.585Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1489104203645.yml",
    "content": "_id: f9ff5030-0524-11e7-aa50-6d06826af1ce\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Michael, please, can you explain the `page__comments` snippet? If it just checks if the parent is `nil`, how does it display all comments? (I'm definitely missing something obvious here, but hey, it's 1 AM).\\r\\nThanks for the tutorial! One tip though: the required fields should have a `required` attribute. You know, for accessibility :) .\"\nname: Sukil\nemail: 4c4618d7d5e47b4587fa422e3d83508c\nhidden: ''\ndate: '2017-03-10T00:03:23.642Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1489108834795.yml",
    "content": "_id: c274dd50-052f-11e7-aa50-6d06826af1ce\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '12'\nmessage: \"Sure thing. That first assign is creating an array of comments that don't have a `replying_to` field. That's what the `nil` is checking since through some trial and error I learned that a `replying_to` field is only added to a child comment's data file.\\r\\n\\r\\nInside the first loop I check the current comment's value against all comment's `replying_to` fields, if they match then they're a child and spit out as a nested entry in the second loop.\\r\\n\\r\\nDoes that help clear things up?\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-03-10T01:20:34.790Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1489110137352.yml",
    "content": "_id: cace4970-0532-11e7-aa50-6d06826af1ce\n_parent: /articles/improving-jekyll-static-comments/\nreplying_to: '12'\nmessage: 'And good catch on the `required` attribute, completely missed that.'\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-03-10T01:42:17.350Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1489607030788.yml",
    "content": "_id: b6781e40-09b7-11e7-92f9-af0b7a00b289\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  Staticman recently [added support for\n  reCAPTCHA](https://github.com/eduardoboucas/staticman/issues/20) which has\n  completely eliminated all of the spam comments that would slip through. I'm\n  sure Akismet would have done the same, but since it's not enabled for the\n  public instance of Staticman this was the next best thing.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '4'\nhidden: ''\ndate: '2017-03-15T19:43:50.786Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1490457260680.yml",
    "content": "_id: 4ef3c800-1173-11e7-aba0-4d333bb705b7\n_parent: /articles/improving-jekyll-static-comments/\nmessage: This is really helpful thanks.\nname: Lee\nemail: 58ef23e64467397de44235e5a5a4dd0d\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-03-25T15:54:20.674Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1491030238309.yml",
    "content": "_id: 602cead0-16a9-11e7-8826-052990469031\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  How did you apply mail notification? I already encrypted api key and domain\n  correctly, though not having luck until now.\nname: John\nemail: d61e23032f71d8620bd1e33168d235cf\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-04-01T07:03:58.305Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1491175352402.yml",
    "content": "_id: 3eec1960-17fb-11e7-9e00-23887e25fba6\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"I use the public instance of Staticman which means I didn't have to create my own Mailgun account and encrypt keys. I didn't have much luck getting it to work which is why I went that way.\\r\\n\\r\\nI don't know many people who have gotten it to work. Might be worth pinging [this thread](https://github.com/eduardoboucas/staticman/issues/42#issuecomment-287597695) as you're certainly not alone in trying to get it up and running.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '14'\nhidden: ''\ndate: '2017-04-02T23:22:32.401Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1491627404813.yml",
    "content": "_id: c2bc10e0-1c17-11e7-8045-f10619b22d43\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  It looks it is impossible to implement public instance of mailgun for now,\n  sadly.\nname: John\nemail: d61e23032f71d8620bd1e33168d235cf\nurl: ''\nreplying_to: '14'\nhidden: ''\ndate: '2017-04-08T04:56:44.804Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1492658318898.yml",
    "content": "_id: 0bbdf0b0-2578-11e7-afad-f182f109e72e\n_parent: /articles/improving-jekyll-static-comments/\nmessage: Extremely helpful. Thank you.\nname: Matt Seemon\nemail: 09d1cc2c678124c06dd0ab1a0351f665\nurl: 'https://mattseemon.in'\nreplying_to: ''\nhidden: ''\ndate: '2017-04-20T03:18:38.897Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1493172436156.yml",
    "content": "_id: 119e6800-2a25-11e7-9eac-4b33388ae63e\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Hey Michael, I could use some help here. The below line is always assigning comments variable as blank.\\r\\n\\r\\n~~~\\r\\n{% assign comments = site.data.comments[page.slug] | where_exp: 'item', 'item.replying_to == blank' %}\\r\\n~~~\\r\\n\\r\\nIf I do an inspect\\r\\n\\r\\n~~~\\r\\n{{ site.data.comments[page.slug] | inspect }}\\r\\n~~~\\r\\n\\r\\nI get this\\r\\n\\r\\n~~~\\r\\n{\\\"comment1493146261009\\\"=>{\\\"_id\\\"=>\\\"2029eee0-29e8-11e7-9eac-4b33388ae63e\\\", \\\"_parent\\\"=>\\\"http://localhost:4000/blog/karaoke/2017/04/25/Latest-tracks.html\\\", \\\"name\\\"=>\\\"Matt Seemon\\\", \\\"email\\\"=>\\\"09d1cc2c678124c06dd0ab1a0351f665\\\", \\\"url\\\"=>\\\"https://mattseemon.in\\\", \\\"message\\\"=>\\\"Testing Staticman Comments\\\", \\\"replying_to\\\"=>\\\"\\\", \\\"hidden\\\"=>\\\"\\\", \\\"date\\\"=>1493146261}, \\\"comment1493150394000\\\"=>{\\\"_id\\\"=>\\\"bf915780-29f1-11e7-9eac-4b33388ae63e\\\", \\\"_parent\\\"=>\\\"http://localhost:4000/blog/karaoke/2017/04/25/Latest-tracks.html\\\", \\\"name\\\"=>\\\"Matt Seemon\\\", \\\"email\\\"=>\\\"09d1cc2c678124c06dd0ab1a0351f665\\\", \\\"url\\\"=>\\\"https://mattseemon.in\\\", \\\"message\\\"=>\\\"One more test\\\", \\\"replying_to\\\"=>\\\"\\\", \\\"hidden\\\"=>\\\"\\\", \\\"date\\\"=>1493150393}}\\r\\n~~~\\r\\n\\r\\nOther than that, all the settings are exactly the same, except for file name and the date format.\"\nname: Matt Seemon\nemail: 09d1cc2c678124c06dd0ab1a0351f665\nurl: 'https://mattseemon.in'\nreplying_to: '15'\nhidden: ''\ndate: '2017-04-26T02:07:16.150Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1493173314433.yml",
    "content": "_id: 1ce52580-2a27-11e7-9eac-4b33388ae63e\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Add an `inspect` on the `comments` array instead, since that will be the new array that is filtering out replies with `where_exp`.\\r\\n\\r\\n```liquid\\r\\n{{ comments | inspect }}\\r\\n```\\r\\n\\r\\nFor comparison this is an example of what I get:\\r\\n\\r\\n```\\r\\n[{\\\"id\\\"=>\\\"comment-1047796157\\\", \\\"date\\\"=>2013-09-17 07:07:59 -0400, \\\"updated\\\"=>2013-09-17 07:07:59 -0400, \\\"post_id\\\"=>\\\"/going-static\\\", \\\"name\\\"=>\\\"picajoso\\\", \\\"url\\\"=>\\\"\\\", \\\"message\\\"=>\\\"Do you think Jekyll is suitable for a heavy updated site? If you have to build the whole website each time you publish something then this option wouldn't be acceptable. I've read somewhere that there is someway to build only the updated/new posts, maintaining the rest of the site without changes.\\\", \\\"avatar\\\"=>\\\"https://disqus.com/api/users/avatars/picajoso.jpg\\\"}]\\r\\n```\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '15'\nhidden: ''\ndate: '2017-04-26T02:21:54.432Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1493175052061.yml",
    "content": "_id: 28daaeb0-2a2b-11e7-9eac-4b33388ae63e\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Did that as well, and all I get is \\r\\n\\r\\n~~~\\r\\n[]\\r\\n~~~\"\nname: Matt Seemon\nemail: 09d1cc2c678124c06dd0ab1a0351f665\nurl: 'https://mattseemon.in'\nreplying_to: '15'\nhidden: ''\ndate: '2017-04-26T02:50:52.060Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1493214835599.yml",
    "content": "_id: c9a932b0-2a87-11e7-9594-27fd6f0988e3\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"OK.. So I sort of figured out where the problem lies... While the where_exp is not working for me as it does for you, I had to take a different approach.\\r\\n\\r\\n~~~\\r\\n{% assign idx = 0 %}\\r\\n\\r\\n{% for comment in site.data.comments[page.slug] %}\\r\\n    {% if comment[1].replying_to == \\\"\\\" %}\\r\\n        {% assign idx         = idx | plus: 1 %}\\r\\n\\r\\n        {% assign index       = idx %}\\r\\n        {% assign r           = comment[1].replying_to %}\\r\\n        {% assign replying_to = r | to_integer %}\\r\\n        {% assign email       = comment[1].email %}\\r\\n        {% assign name        = comment[1].name %}\\r\\n        {% assign url         = comment[1].url %}\\r\\n        {% assign date        = comment[1].date %}\\r\\n        {% assign message     = comment[1].message %}\\r\\n        {% include comment.html index=index replying_to=replying_to email=email name=name url=url date=date message=message %}\\r\\n                        \\r\\n    {% endif %}\\r\\n{% endfor %}\\r\\n~~~\"\nname: Matt Seemon\nemail: 09d1cc2c678124c06dd0ab1a0351f665\nurl: 'https://mattseemon.in'\nreplying_to: '15'\nhidden: ''\ndate: '2017-04-26T13:53:55.597Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1493220517612.yml",
    "content": "_id: 046ceab0-2a95-11e7-9594-27fd6f0988e3\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Are you using replies on your site? You might run into problems eliminating the `where` filter since that first loop will include parent comments along with their children (the replies).\\r\\n\\r\\nI had a hell of a time getting it to filter out properly. The `where` and `where_exp` filters seem to be really picky if your data array doesn't match. It all comes down to how your data files are constructed. Perhaps yours are slightly different than mine.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '15'\nhidden: ''\ndate: '2017-04-26T15:28:37.607Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1493271734325.yml",
    "content": "_id: 43f71e40-2b0c-11e7-8a38-856f741990e0\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Ultimately it boiled down to the fact that since  `where_exp` was not working for me. With my approach I was receiving each comment as below. Hence the need to use `[1]`.\\r\\n\\r\\n~~~\\r\\n[\\\"comment-1493177616768\\\", {\\\"_id\\\"=>\\\"217db4e0-2a31-11e7-9594-27fd6f0988e3\\\", \\\"_parent\\\"=>\\\"http://mattseemon.dev/blog/karaoke/2017/04/25/Latest-tracks.html\\\", \\\"name\\\"=>\\\"Matt Seemon\\\", \\\"email\\\"=>\\\"09d1cc2c678124c06dd0ab1a0351f665\\\", \\\"url\\\"=>\\\"https://mattseemon.in\\\", \\\"message\\\"=>\\\"Testing Staticman Comments\\\", \\\"replying_to\\\"=>\\\"\\\", \\\"hidden\\\"=>\\\"\\\", \\\"date\\\"=>\\\"2017-04-26T03:33:36.759Z\\\"}]\\r\\n~~~\\r\\n\\r\\nIt seems to be working with replies as well without anything breaking, so far. Fingers crossed. I will know once i go live. Thank you for all your help.\"\nname: Matt Seemon\nemail: 09d1cc2c678124c06dd0ab1a0351f665\nurl: 'https://mattseemon.in'\nreplying_to: '15'\nhidden: ''\ndate: '2017-04-27T05:42:14.324Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1499931059948.yml",
    "content": "_id: 37512280-679d-11e7-b7ad-99159959b3a0\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Hi,\\r\\n\\r\\nI'm really keen to try out staticman.\\r\\n\\r\\nIs there a tool to import Blogger comments to staticman/GitHub or any suggestions on how I could go about doing so?\\r\\n\\r\\nThanks for sharing all this wonderful information.\"\nname: Harry\nemail: 58dfe5ef6aaf9bf9af5a0b17b52e6168\nurl: 'http://www.deepfriedbrainproject.com'\nreplying_to: ''\nhidden: ''\ndate: '2017-07-13T07:30:59.942Z'\ntimestamp: 1499931059\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1499949178643.yml",
    "content": "_id: 66a5e370-67c7-11e7-b7ad-99159959b3a0\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"I used this set of Rake tasks to [export comments in Disqus](https://github.com/pathawks/jekyll-disqus-comments) to use with Staticman. Perhaps it can be modified to do the same with Blogger.\\r\\n\\r\\nBlogger lets you [export your blog into an XML file](https://support.google.com/blogger/answer/41387?visit_id=1-636355458136931298-4026338400&rd=1) which you could probably pull data out of. Not sure if it includes all the comments though. Jekyll has a Blogger [import tool](http://import.jekyllrb.com/docs/blogger/) so perhaps you can get some ideas from that?\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-07-13T12:32:58.640Z'\ntimestamp: 1499949178\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1500146774391.yml",
    "content": "_id: 77120c70-6993-11e7-8901-815fa61174ff\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Thanks a lot, Michael. I managed to get the comments imported. I first imported the comments from Blogger to Disqus, and then used your approach to export them out of Disqus. \\r\\n\\r\\nI'm now on to configuring reply-to. I managed to get it to work but running into an issue. When running in production mode, my comments are appearing in the correct order but when running on localhost, they are order is different and the reply is showing up under the wrong parent. It seems that the order in which the comments are being returned are different on localhost and production. Any idea why that would happen?\\r\\n\\r\\nI'm also not sure why you are not using the unique id of the parent as the reply-to value on the child to guarantee that the child is attached to the correct parent. \\r\\n\\r\\nThanks.\"\nname: Harry\nemail: 58dfe5ef6aaf9bf9af5a0b17b52e6168\nurl: 'http://www.deepfriedbrainproject.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-07-15T19:26:14.390Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1500158643482.yml",
    "content": "_id: 19a44a00-69af-11e7-8901-815fa61174ff\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Great!\\r\\n\\r\\nNot sure what could be going on with the comment order. I've heard of others having the same issue so you're not alone. If you're using the same instance of Jekyll to build and serve then the output should be exactly the same. If you're using some sort of CI service to build/deploy your site then it's possible the environments and Jekyll versions are out of sync and that's the issue.\\r\\n\\r\\nI am using unique id's to attach child comments to their parent by using the `replying_to` field. There's a chance my code above is old and outdated. If you haven't already, reference my GitHub repo instead since that is the actual code I use to build comments on my site.\\r\\n\\r\\n- [`_includes/comments.html`](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_includes/comments.html)\\r\\n- [`_includes/comment.html`](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_includes/comment.html)\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-07-15T22:44:03.481Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1500179899352.yml",
    "content": "_id: 971a6650-69e0-11e7-8901-815fa61174ff\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"I really appreciate your help. \\r\\n\\r\\nYou are right that I'm using a CI service, but after some more testing, I found that the ordering of replies is completely unpredictable and it is changing both on my local and on the production. I'm on the latest version of Jekyll (3.5). Maybe that's causing the difference. BTW, I have been using the latest code from your GH repo.\\r\\n\\r\\nSo I made a minor modification to your code to use the parent's _id field as the replying-to value of the child, instead of relying on the position of the comments (because that seems to be unpredictable at least in my environment). Now it seems to be working consistently.\\r\\n\\r\\nI'm yet to get into reply notifications and MailGun setup. If I run into any issues, I may seek your help again.\\r\\n\\r\\nI must say that your 2 blog posts on staticman have been extremely helpful. Without your posts I may not have even made a serious attempt at it. \\r\\n\\r\\nI don't have enough words to thank you!\"\nname: Harry\nemail: 58dfe5ef6aaf9bf9af5a0b17b52e6168\nurl: 'http://www.deepfriedbrainproject.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-07-16T04:38:19.350Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1500216139951.yml",
    "content": "_id: f84080f0-6a34-11e7-8901-815fa61174ff\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"There's one more thing I forgot about that I didn't write up in the posts. If you have a page with imported Disqus comments (using the Rake task) and new ones from Staticman the order will be wrong because of filename differences.\\r\\n\\r\\nWhat's going on is the order is determined by the comment data files' filenames. The data files created from the Disqus import use a different format ([ISO 8601](https://en.wikipedia.org/wiki/ISO_8601)) than the ones Staticman generates ([UNIX timestamp](https://en.wikipedia.org/wiki/Unix_time) in milliseconds). I fixed that by [renaming all of my Disqus comment filenames](https://github.com/mmistakes/made-mistakes-jekyll/commit/569a16112ba08fa9e79ee535a642d7e4c0160d8c) to match.\\r\\n\\r\\nWhat you could do is modify the script to use a Unix time format (not `YYYY-MM-DD`) or change Staticman's `filename` config to use something other than the [default `{@timestamp}` placeholder](https://staticman.net/docs/configuration#path).\\r\\n\\r\\nIf you're looking for help with getting Mailgun notifications working I'd check out Staticman's repo. I'm using the public instance so no issues really for me, but I know a lot of people have had problems getting it to work. You'll likely find more guidance on [this issue's thread](https://github.com/eduardoboucas/staticman/issues/42) than from me.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-07-16T14:42:19.949Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1501076401771.yml",
    "content": "_id: ec2cdc70-7207-11e7-a45a-3114f0323905\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Michael, thanks a ton for this post! I used it as the base for my own implementation over at https://github.com/GonzaloZiadi/windespair. Some things I had to change: \\r\\n* \\\"item.replying_to == '' \\\"  rather than  \\\"item.replying_to == blank\\\" \\r\\n* {% assign comments = site.data.comments[page.slug] | where_exp:\\\"item\\\", \\\"item.replying_to == ''\\\" | sort: 'date' %} rather than {% assign comments = site.data.comments[page.slug] | where_exp:\\\"item\\\", \\\"item.replying_to == blank\\\" %} as even though I followed your comment naming convention, posts were being sorted in reverse alphabetical order so the replies were showing under the wrong parent comment. Now that I think about it maybe | reverse would work the same as | sort 'date' in my case. \\r\\nI also tried to use the comment _id field as the \\\"link\\\" between child and parent rather than the for loop index, but I kept getting errors about 'nesting too deep'. I feel like using the _id field would be better though as then sorting the comments by date or some other parameter would become doable. What do you think?\\r\\n* I didn't want to use jquery so I changed a bit how the replies work. Same concept, different implementation.\\r\\n* I changed the css a little, but it is heavily inspired by yours.\\r\\n* I changed the website input type to text instead of url. The url regex is annoying, to me, as it requires users to put the http:// in front of their url. I feel like they shouldn't have to do this.\\r\\n\\r\\nIf it piques your curiosity in the very least, in my _includes folder I have your same three files (comments, comment, and comment-form) and in my _layouts folder in default.html in a script tag at the bottom of the file I have the js code for the replies. Thanks again!\"\nname: Gonzalo Ziadi\nemail: 84028d1c4d05a0a226a38be5e72803dd\nurl: 'http://www.windespair.com'\nreplying_to: ''\nhidden: ''\ndate: '2017-07-26T13:40:01.764Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1501079213007.yml",
    "content": "_id: 77d9cac0-720e-11e7-a45a-3114f0323905\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Thanks for sharing! I've heard from a few people that they had to modify the `for` loop to get the nested order sorted out. Something not mentioned in this post is I did some additional cleanup on my comment data ([see this reply](https://mademistakes.com/articles/improving-jekyll-static-comments/#comment-16-5)).\\r\\n\\r\\nSome of the variation might have to do with your comment data too and how Liquid conditionals are met. [Truthy/falsy](https://shopify.github.io/liquid/basics/truthy-and-falsy/) values for strings, integers, arrays, etc. are different.\\r\\n\\r\\nI encountered the same `nesting too deep` errors as I tried a million different combinations of Jekyll's `where` and `where_exp` filters.  There have been some updates Jekyll so maybe it's worth revisiting.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '17'\nhidden: ''\ndate: '2017-07-26T14:26:53.005Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1502678904866.yml",
    "content": "_id: 0a72a060-809b-11e7-ac6c-353a18b967b6\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Thanks, Michael. \\r\\n\\r\\nYou are right that Disqus comments and staticman comments have different file naming conventions, but I haven't encountered any issue with that. I use the date inside each comment file to sort the comments in the right order. So, file name doesn't seem to matter much. \\r\\n\\r\\nI do have 2 questions for you - \\r\\n\\r\\n1. I had recaptcha enabled for my staticman comments, but Page Speed checks do not seem to like recaptcha for various reasons (no browser caching etc.). So I experimented with disable recaptcha and falling back on the honey pot method. Within 6 hours, I received 4 spam comments. This tells me that honey pot is not as effective as recaptcha in dealing with spam. However, Eduardo Boucas himself is not using recaptcha on his blog, and he has commented on the issue thread, which you linked in your reply, that honey pot has worked well for him. So, I wanted to know your experience with it. \\r\\n\\r\\n2. Comment replies - I'm concerned about using comment replies because I'm wondering what if I put someone else's email address and subscribe to comment replies. Wouldn't that start spamming the mailbox of the person who owns the email address? Is there some kind of email verification involved when you subscribe to replies? I don't seem to recollect there was one when I signed up for replies on this thread.\\r\\n\\r\\nThanks again.\"\nname: Harry\nemail: 58dfe5ef6aaf9bf9af5a0b17b52e6168\nurl: 'https://www.deepfriedbrainproject.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-08-14T02:48:24.865Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1502712383041.yml",
    "content": "_id: fd0969b0-80e8-11e7-ac6c-353a18b967b6\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"I wouldn't worry too much about the script getting flagged by page speed testers --- the scores they assign aren't as black and white as they make it seem. It's being loaded asynchronously and I haven't seen it hurt my pages much if any.\\r\\n\\r\\nThe honeypot method is too easy for bots to spoof. They eventually learn what the hidden field is that you're trying to fool them with. I was getting over 10 spam comments a day on my posts. Turning on reCAPTCHA I get maybe 2 a week. Spam that slips through is usually people manually trying to stuff a comment with their links, on posts like this that tend to rank well in search.\\r\\n\\r\\nReply notifications are totally something that could be abused. You're right someone could easily put any email address they wanted into the form. I believe I saw someone over in [Staticman's issues on GitHub](https://github.com/eduardoboucas/staticman/issues) voiced the same concern and suggesting some sort of double opt'in feature.\\r\\n\\r\\nRegardless I believe the notification emails that come from Staticman have an unsubscribe link, so it should be easy enough to stop them.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-08-14T12:06:23.040Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1502719408873.yml",
    "content": "_id: 58c05060-80f9-11e7-ac6c-353a18b967b6\n_parent: /articles/improving-jekyll-static-comments/\nmessage: \"Thanks, Michael. I'm going to first re-enable Recaptcha as I don't think the honey pot is sweet enough. About reply notification, I guess you are right that the unsubscribe option should mitigate the risk. I'll give it a shot and see how it goes.\\r\\n\\r\\nOne other thought I had was to make use of browser local storage to store commenter's Name, Email and Website so that return visitors who have commented before do not have to type those details again (as long as they don't clear their cache). What do you think about that?\"\nname: Harry\nemail: 58dfe5ef6aaf9bf9af5a0b17b52e6168\nurl: 'https://www.deepfriedbrainproject.com'\nreplying_to: '16'\nhidden: ''\ndate: '2017-08-14T14:03:28.871Z'\n"
  },
  {
    "path": "src/_data/comments/improving-jekyll-static-comments/comment-1503767042418.yml",
    "content": "_id: 8ed63760-8a80-11e7-96dc-39adeedeaff6\n_parent: /articles/improving-jekyll-static-comments/\nmessage: >-\n  Many thanks for this article. After Pooleapp dead i thought i was sentenced to\n  Disqus again. Staticman to the rescue !!\nname: Radek\nemail: b4d3a26373c238de81eb913b593b6826\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-08-26T17:04:02.414Z'\ntimestamp: 1503767042\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1375311525000.yml",
    "content": "id: comment-983157783\ndate: 2013-07-31T22:58:45Z\nupdated: 2013-07-31T22:58:45Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Jim\nurl: ''\nmessage: \"This writeup is AMAZING, thank you for teaching me all the tricks of\n  this amazing app!\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1375312155000.yml",
    "content": "replying_to: '1'\nid: comment-983166195\ndate: 2013-07-31T23:09:15Z\nupdated: 2013-07-31T23:09:15Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Stay tuned, even more tricks coming.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1375407240000.yml",
    "content": "id: comment-985240204\ndate: 2013-08-02T01:34:00Z\nupdated: 2013-08-02T01:34:00Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: megan\nurl: ''\nmessage: \"Great guide! :D\"\navatar: https://disqus.com/api/users/avatars/disqus_57AAGG5wak.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1375731850000.yml",
    "content": "id: comment-989509367\ndate: 2013-08-05T19:44:10Z\nupdated: 2013-08-05T19:44:10Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: lunastrike\nurl: ''\nmessage: \"Amazing!\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1375852140000.yml",
    "content": "id: comment-991120433\ndate: 2013-08-07T05:09:00Z\nupdated: 2013-08-07T05:09:00Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: adeirra\nurl: ''\nmessage: \"Despite all of your somewhat-sexy weirdness.. i never thought that you\n  are actually a very good teacher slash mentor! Love this, mike.\"\navatar: https://disqus.com/api/users/avatars/adeirra.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1375878105000.yml",
    "content": "replying_to: '4'\nid: comment-991346232\ndate: 2013-08-07T12:21:45Z\nupdated: 2013-08-07T12:21:45Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I never thought I'd be mentoring or teaching anyone anything --- I'm\n  horrible at writing and explaining my thoughts! Glad some of it came out in a way\n  that makes sense to others.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1376040798000.yml",
    "content": "replying_to: '4'\nid: comment-994215860\ndate: 2013-08-09T09:33:18Z\nupdated: 2013-08-09T09:33:18Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: adeirra\nurl: ''\nmessage: \"If that's horrible... then i wont be submit for a good one. Cant wait\n  for your next writings about Paper, dear...!:heart:\"\navatar: https://disqus.com/api/users/avatars/adeirra.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1376625477000.yml",
    "content": "id: comment-1003164768\ndate: 2013-08-16T03:57:57Z\nupdated: 2013-08-16T03:57:57Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: HoYoung Choi\nurl: ''\nmessage: \"아따 심오하다. 이걸 몸으로 익혀야 되는데.;ㅁ;\"\navatar: https://disqus.com/api/users/avatars/hoyoungchoi.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1376684545000.yml",
    "content": "id: comment-1004103359\ndate: 2013-08-16T20:22:25Z\nupdated: 2013-08-16T20:22:25Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Abdul Rahman\nurl: ''\nmessage: \"is there any difference if one is drawing on retina or non retina display\n  i mean do we have more details on retina ipad ?\"\navatar: https://disqus.com/api/users/avatars/disqus_O3N8Fpfbyq.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1376684893000.yml",
    "content": "replying_to: '6'\nid: comment-1004109044\ndate: 2013-08-16T20:28:13Z\nupdated: 2013-08-16T20:28:13Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Detail is probably about the same while drawing, but on export a retina\n  iPad gives you a file that is twice as large. Which is an advantage if you're trying\n  to make prints.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1376794161000.yml",
    "content": "id: comment-1005229966\ndate: 2013-08-18T02:49:21Z\nupdated: 2013-08-18T02:49:21Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Rozhana Art\nurl: ''\nmessage: \"Great article! I'm new to paper so this was very helpful, Very clear and\n  to the point. I love how you don't completely praise the app but simply mention\n  its good features while still giving its limitations. :)\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1376984306000.yml",
    "content": "replying_to: '6'\nid: comment-1007685659\ndate: 2013-08-20T07:38:26Z\nupdated: 2013-08-20T07:38:26Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Abdul Rahman\nurl: ''\nmessage: \"thanks :) it means i dont have to upgrade to ipad retina :)\"\navatar: https://disqus.com/api/users/avatars/disqus_O3N8Fpfbyq.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1377166098000.yml",
    "content": "id: comment-1012791862\ndate: 2013-08-22T10:08:18Z\nupdated: 2013-08-22T10:08:18Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Abdul Rahman\nurl: ''\nmessage: \"when is the next part of your tutorial coming ?\"\navatar: https://disqus.com/api/users/avatars/disqus_O3N8Fpfbyq.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1377170401000.yml",
    "content": "replying_to: '8'\nid: comment-1012922622\ndate: 2013-08-22T11:20:01Z\nupdated: 2013-08-22T11:20:01Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Next couple of weeks. Trying to get really detailed with a bunch of techniques.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1377972100000.yml",
    "content": "id: comment-1024559577\ndate: 2013-08-31T18:01:40Z\nupdated: 2013-08-31T18:01:40Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Mbova3\nurl: ''\nmessage: \"I love the watercolor brush but am also interested in using a bamboo\n  tablet for drawing. Does anyone know of any mac software that is as nice as paper\n  for watercolor?\"\navatar: https://disqus.com/api/users/avatars/Mbova3.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1378006060000.yml",
    "content": "replying_to: '9'\nid: comment-1024954347\ndate: 2013-09-01T03:27:40Z\nupdated: 2013-09-01T03:27:40Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I wish I could get get the brushes in Photoshop to react like Paper's\n  watercolor. It's the number one reason I keep going back to the app. It may not\n  have all the bells and whistles as pro apps, but their watercolor is so damn nice.\\r\\n\\r\\nThat said, have you tried [**Tayasui Sketches**](http://www.tayasui.com/sketches/)? They have a Universal iOS app as well as a macOS app that are very similar to Paper by FiftyThree.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1379258836000.yml",
    "content": "id: comment-1045581250\ndate: 2013-09-15T15:27:16Z\nupdated: 2013-09-15T15:27:16Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Gillybede\nurl: ''\nmessage: \"Thank you for taking the time to share this, now I feel a little less\n  lost!\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1381756066000.yml",
    "content": "id: comment-1081793074\ndate: 2013-10-14T13:07:46Z\nupdated: 2013-10-14T13:07:46Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Treddys\nurl: ''\nmessage: \"Very useful, and I like it.\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1381953329000.yml",
    "content": "id: comment-1084804882\ndate: 2013-10-16T19:55:29Z\nupdated: 2013-10-16T19:55:29Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: 'Little Dom'\nurl: ''\nmessage: \"Being new to paper I found this info most helpful thank you!\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1384279598000.yml",
    "content": "id: comment-1119915677\ndate: 2013-11-12T18:06:38Z\nupdated: 2013-11-12T18:06:38Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Khang\nurl: ''\nmessage: \"I tried this yesterday. It's very fine but how can I change the Brush\n  size?\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1384279891000.yml",
    "content": "replying_to: '13'\nid: comment-1119924884\ndate: 2013-11-12T18:11:31Z\nupdated: 2013-11-12T18:11:31Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Sadly you can't change the brush size. The best you can do is manipulate\n  the width of the fountain pen depending on how fast you draw a stroke. Or you can\n  buy a Pogo Connect stylus and that lets you vary brush size depending on the amount\n  of pressure you apply. Press light get a small stroke, press hard get a thicker\n  one.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1384938799000.yml",
    "content": "id: comment-1130821287\ndate: 2013-11-20T09:13:19Z\nupdated: 2013-11-20T09:13:19Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Verna Koperu\nurl: ''\nmessage: \"Thank you so much for sharing this series...I found it super helpful\n  and I feel motivated to stick at working with Paper.  I actually found it in depth\n  and I got a greater understanding on how to use the app.  So kudos to you good sir\n  for this wonderful series.\"\navatar: https://disqus.com/api/users/avatars/VanillaSnap.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1385076228000.yml",
    "content": "replying_to: '14'\nid: comment-1133682554\ndate: 2013-11-21T23:23:48Z\nupdated: 2013-11-21T23:23:48Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: |\n  My pleasure. I learn something new every time I use Paper. It's\n  such a fun app!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1392222165000.yml",
    "content": "id: comment-1241335511\ndate: 2014-02-12T16:22:45Z\nupdated: 2014-02-12T16:22:45Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Ashton Kate\nurl: ''\nmessage: \"Being an artist, I've just about used every sketching, drawing, painting,\n  apps available out there in art heaven!  There is nothing that comes close to Paper53!  I\n  think it is the *simplicity* of the app, and the ability to create high quality\n  sketches and paintings!  I'm using it for my art journal this year.  I am using\n  an adonit stylus...it works great!  Love, love, love this app!\"\navatar: https://disqus.com/api/users/avatars/ashtonkate.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1394046009000.yml",
    "content": "id: comment-1271661227\ndate: 2014-03-05T19:00:09Z\nupdated: 2014-03-05T19:00:09Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Renee\nurl: ''\nmessage: \"Do you have any tips for perfecting rewind?\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1394046321000.yml",
    "content": "replying_to: '16'\nid: comment-1271669002\ndate: 2014-03-05T19:05:21Z\nupdated: 2014-03-05T19:05:21Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Use two fingers, and move it in a circular motion (see <http://support.fiftythree.com>).\n  Not too fast and not too slow. Just stick with it and you'll eventually learn how\n  to trigger it 100% of the time.\\r\\n\\r\\nAnd if you're really having problems using\n  it, you can always buy a Pogo Connect if you have a 3rd/4th generation iPad. There's\n  a button on the stylus that acts as an undo in Paper.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1395342927000.yml",
    "content": "id: comment-1293693509\ndate: 2014-03-20T19:15:27Z\nupdated: 2014-03-20T19:15:27Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: J Doe\nurl: ''\nmessage: \"Like you, I used the heck out of this app for a very long time. I finally\n  walked away when I realized that they would never add an undo button option. Without\n  it, the app is frustrating for me and many users. I have a physical disability that\n  causes problems with my hands. Some users simply don't like the rewind feature.\\r\\n\\r\\nRegardless,\n  the company knows it is an accessibility issue for some and have refused to accommodate\n  by simply providing the option of an undo button for users who cannot use rewind\n  for one reason or another. I wish Apple would require art apps to include this important\n  feature, but I honestly don't think they should have to require it – developers\n  should want their apps to be accessible.\\r\\n\\r\\nIt's too bad because this really\n  is an innovative app that encourages people from all walks of life to be more creative.\n  Adding an undo button option wouldn't threaten 'rewind' (a similar app added it\n  as an option, leaving their gesture-based undo as default). It would, however, require\n  the development team to be less arrogant. Not holding my breath.\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1395344315000.yml",
    "content": "replying_to: '17'\nid: comment-1293727456\ndate: 2014-03-20T19:38:35Z\nupdated: 2014-03-20T19:38:35Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Have you tried playing with the [AssistiveTouch options](http://support.apple.com/kb/HT5587) in the iPad's Settings\n  app? You can assign favorites to any gesture you want. In theory you would make\n  one for Rewind and then you can activate it anytime you want.\\r\\n\\r\\nIt'll take an\n  extra tap to do it, but it's an option until FiftyThree adds it natively to the\n  app.\\r\\n\\r\\nAnother option, albeit expensive is to purchase a Pogo Connect stylus. It has a dedicated\n  undo button on the pen that you can click to activate Rewind. That's how I do it\n  since it's much quicker for small undos.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1395382469000.yml",
    "content": "id: comment-1294441088\ndate: 2014-03-21T06:14:29Z\nupdated: 2014-03-21T06:14:29Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: April\nurl: ''\nmessage: \"Thank you for sharing your knowledge of Paper 53. I'm new to the app\n  and already like what I see!!!\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1400766868000.yml",
    "content": "id: comment-1399372360\ndate: 2014-05-22T13:54:28Z\nupdated: 2014-05-22T13:54:28Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: hsl2000\nurl: ''\nmessage: \"Okay, so this is a rank beginner asking, but I cannot find out how to\n  control (ie, access and use) Rewind. It pops up sporadically in the middle of the\n  page but I can't seem to choose it even then. And how do I get to it when I want\n  it?\\r\\n\\r\\nOh, and Zoom is the same thing--HOW do I get to it? Sorry, but this has\n  been a real trial, and I do feel like I have some basic familiarity with apps like\n  this.\\r\\n\\r\\n>(I am using Paper with the Pencil stylus, but am having problems with\n  Rewind and Zoom both with my fingers and Pencil.)\\r\\n\\r\\nThanks for help with this;\n  can't seem to find any of this REALLY basic stuff on any of the Paper Fifty Three\n  pages\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1400767548000.yml",
    "content": "replying_to: '19'\nid: comment-1399386844\ndate: 2014-05-22T14:05:48Z\nupdated: 2014-05-22T14:05:48Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Rewind and Zoom are both gesture based (meaning you need to use your\n  fingers in specific motions). I would suggest watching the built in tutorial videos\n  Paper comes with to see how they're done. If you tap the 53 circle in the upper\n  right corner you can get at them.\\r\\n\\r\\nOr you can scroll down a few comments, I\n  provided a link to FiftyThree's support forum where they have videos of all the\n  gestures and tips for doing them.\\r\\n\\r\\nRewind can be tricky to master at first.\n  The basic idea is you use two fingers and swipe them in a circular motion.Counter\n  clockwise rewinds a mistake, and clockwise goes forward if you rewind too far.\\r\\n\\r\\nZoom\n  works almost the same as pinching in the Photos app. Just take your two fingers\n  and pinch outward. You should see a magnifying glass appear that you can re-position\n  by dragging it at the circle's edge.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1407354540000.yml",
    "content": "id: comment-1530648335\ndate: 2014-08-06T19:49:00Z\nupdated: 2014-08-06T19:49:00Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: LizD\nurl: ''\nmessage: \"Love the app - and I wanted to thank you for taking the time and using\n  your skills to share your knowledge and experience with us.  Your guides and tutorials\n  have helped enormously.  Many thanks!\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1408198975000.yml",
    "content": "id: comment-1545502351\ndate: 2014-08-16T14:22:55Z\nupdated: 2014-08-16T14:22:55Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Cis\nurl: ''\nmessage: \"Michael, being new to Paper 53, I am finding it difficult to retrieve\n  my tool/palette while doing my drawing/painting.  Can you give me some direction\n  please?\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1408225050000.yml",
    "content": "replying_to: '21'\nid: comment-1545963352\ndate: 2014-08-16T21:37:30Z\nupdated: 2014-08-16T21:37:30Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"If you swipe up from the bottom of the screen it should bring the tool\n  palette back.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1409523852000.yml",
    "content": "id: comment-1567941764\ndate: 2014-08-31T22:24:12Z\nupdated: 2014-08-31T22:24:12Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: BMK\nurl: ''\nmessage: \"Thanks so much for this extremely useful lesson. Very helpful indeed.\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1411341215000.yml",
    "content": "id: comment-1599654444\ndate: 2014-09-21T23:13:35Z\nupdated: 2014-09-21T23:13:35Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: mario garcia\nurl: ''\nmessage: \"I'm learning also, i find useful to zoom by spreading two fingers in\n  a blank area (in case i miss) i can erase, and drag the zoom by the edge line. You\n  see a faint version with a center dot for accurate positioning as u drag.\"\navatar: https://disqus.com/api/users/avatars/disqus_ONaMDZ2O03.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1426443252000.yml",
    "content": "id: comment-1908553391\ndate: 2015-03-15T18:14:12Z\nupdated: 2015-03-15T18:14:12Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Claudette\nurl: ''\nmessage: \"How Can i save It and email a drawing\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1426446187000.yml",
    "content": "replying_to: '24'\nid: comment-1908620429\ndate: 2015-03-15T19:03:07Z\nupdated: 2015-03-15T19:03:07Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You'll find more information on how to share on [FiftyThree's support site](https://support.fiftythree.com/hc/en-us/articles/201713541-Sharing-and-Export).\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1426559129000.yml",
    "content": "id: comment-1911043195\ndate: 2015-03-17T02:25:29Z\nupdated: 2015-03-17T02:25:29Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Dick Blakely\nurl: ''\nmessage: \"The rewind feature is the worst. Why do I have to put down my pencil\n  and go through a very unstable process only to find that half the time it does not\n  work. AND...every time it doesn't work, which is often, I end up with unwanted smudges\n  an/or circular lines on my drawing. Fifty Three's refusal to acknowledge this problem\n  only complicates the issue. Their own website has closed down comments in their\n  own forum regarding all things relating to UNDO/Rewind. That says a lot.\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1426621912000.yml",
    "content": "replying_to: '25'\nid: comment-1912361281\ndate: 2015-03-17T19:51:52Z\nupdated: 2015-03-17T19:51:52Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Probably not the answer you want to hear but if you want to spend the\n  money on an expensive Bluetooth stylus give the Pogo Connect a try. It is the only\n  stylus I know of that has a dedicated **undo** button supported by Paper.\\r\\n\\r\\nI\n  do know where you're coming from. I absolutely hated the Rewind gesture when I first\n  used Paper. Once I got over trying to second guess it and follow through with the\n  gesture it started working better for me. A few years later and I have almost no\n  problem using it now.\\r\\n\\r\\nThe speed at which you make the circular gesture and\n  the amount of fingers you use makes a big difference. Sometimes you'll notice it\n  drawing on screen instead of undoing, but if you continue with the motion it fixes\n  itself. The Blend feature works that way too.\\r\\n\\r\\nThere appears to be some sort\n  of **auto-correct** going on in the software that tries to fix mistakes, but it only\n  figures that out after the fact. Learning to trust that it will do the right thing\n  can help.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1436371794000.yml",
    "content": "id: comment-2123995920\ndate: 2015-07-08T16:09:54Z\nupdated: 2015-07-08T16:09:54Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Jisha Pareth Chalil\nurl: ''\nmessage: \"Great great article..! Michael, is there a way to save a color shade\n  you mixed in palette for future use? I am novice in painting, not sure of remembering\n  numbers associated to colors. Thanks again\"\navatar: https://disqus.com/api/users/avatars/jishaparethchalil.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1436373150000.yml",
    "content": "replying_to: '26'\nid: comment-2124068518\ndate: 2015-07-08T16:32:30Z\nupdated: 2015-07-08T16:32:30Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"There is! Once you have the color mixed the way you want, tap and hold\n  on the small circle inside of the larger one and then drag it into a palette slot\n  over in the lower right corner of the tool tray. If you drop it on top of an existing\n  color it will replace it so be careful of that.\\r\\n\\r\\nYou can also rearrange the\n  colors by tap and holding on them and if you screw up the default colors you can\n  go into Paper's settings and reset them.\\r\\n\\r\\nAnother option if you fill up all\n  your palette slots with colors is to make some swatches on your drawings. I sometimes\n  do that by coloring a circle over to the side of the canvas and then use the [Color\n    Picker tool](https://mademistakes.com/mastering-paper/color-picker/) to sample it when needed. If you haven't used the picker yet and want\n  some pointers I wrote an article about it.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1436637701000.yml",
    "content": "id: comment-2130501037\ndate: 2015-07-11T18:01:41Z\nupdated: 2015-07-11T18:01:41Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Frankiet\nurl: ''\nmessage: \"I'm glad I found your site.  Makes me wanna go back to Paper and Pencil\n  again.\"\navatar: https://disqus.com/api/users/avatars/disqus_929ixX6wgp.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1436715257000.yml",
    "content": "id: comment-2131872193\ndate: 2015-07-12T15:34:17Z\nupdated: 2015-07-12T15:34:17Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Georjajim\nurl: ''\nmessage: \"Michael:\\r\\n\\r\\nJust opened paper yesterday after non use for a while.\n  My tool tray no longer shows the various pens/ markers, just a pen with a ruler\n  underneath. What happened?  Thank you.\"\navatar: https://disqus.com/api/users/avatars/Georjajim.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1436717252000.yml",
    "content": "replying_to: '28'\nid: comment-2131914954\ndate: 2015-07-12T16:07:32Z\nupdated: 2015-07-12T16:07:32Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Those are the new **Think Kit** tools. Just swipe left on them to get at\n  the other tools (marker, pens, pencil, etc.)\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1436726596000.yml",
    "content": "replying_to: '28'\nid: comment-2132126849\ndate: 2015-07-12T18:43:16Z\nupdated: 2015-07-12T18:43:16Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Georjajim\nurl: ''\nmessage: \"Thank you muchly!\"\navatar: https://disqus.com/api/users/avatars/Georjajim.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1436873234000.yml",
    "content": "id: comment-2135617636\ndate: 2015-07-14T11:27:14Z\nupdated: 2015-07-14T11:27:14Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Jisha Pareth Chalil\nurl: ''\nmessage: \"Thanks a lot Michael.!! I started reading your tutorials in order. Now\n  i am getting all tips and tricks. I love drawing and painting but couldn't get a\n  direction. The tutorial on drawing trees itself gave me the right start.!!! It would\n  be great to get comments/advice on my drawing...!!\\r\\n\\r\\n![Paper by 53 tree drawing](https://a.disquscdn.com/uploads/mediaembed/images/2268/3715/original.jpg)\"\navatar: https://disqus.com/api/users/avatars/jishaparethchalil.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1449835011000.yml",
    "content": "id: comment-2404619189\ndate: 2015-12-11T11:56:51Z\nupdated: 2015-12-11T11:56:51Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Anateresa Mendes\nurl: ''\nmessage: \"I just downloaded the app and some of the features I was looking forward\n  to using are not there (notebooks, zoom bubble). Is the generation iPad I am using?\n  It says it works with 3rd generation which is what I have. Love the app even without\n  the features that are missing.\"\navatar: https://disqus.com/api/users/avatars/anateresamendes.jpg\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1449850201000.yml",
    "content": "replying_to: '30'\nid: comment-2404938201\ndate: 2015-12-11T16:10:01Z\nupdated: 2015-12-11T16:10:01Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"It's not your iPad, its Paper. They had a really big update a few months\n  ago and much of the UI changed or was refreshed. Zoom loupe was removed in favor\n  of zooming the entire screen. Notebooks are now stacks of ideas. Etc etc etc.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1450828345000.yml",
    "content": "id: comment-2422314097\ndate: 2015-12-22T23:52:25Z\nupdated: 2015-12-22T23:52:25Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Crickbob\nurl: ''\nmessage: \"I can't seem to find a way to change the drawing 'width' of a tool to\n  get a precise width.\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1450829807000.yml",
    "content": "replying_to: '31'\nid: comment-2422341272\ndate: 2015-12-23T00:16:47Z\nupdated: 2015-12-23T00:16:47Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Width isn't controlled or set in a conventional sense. The speed at which\n  you draw allows you to vary it. Each tool is slightly different in how speed affects\n  it.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1450829987000.yml",
    "content": "id: comment-2422344675\ndate: 2015-12-23T00:19:47Z\nupdated: 2015-12-23T00:19:47Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Crickbob\nurl: ''\nmessage: \"So there is no way change width and opacity as in other apps like ProCreate?\\r\\n\\r\\nI have a Pencil 53 and having a hard time figuring that out for painting.\"\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1450830099000.yml",
    "content": "replying_to: '32'\nid: comment-2422346791\ndate: 2015-12-23T00:21:39Z\nupdated: 2015-12-23T00:21:39Z\n_parent: /mastering-paper/introduction-tool-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Nope nothing like Procreate where you can manually set the width. Width\n  is more organic with Paper. When you want a fatter stroke you use the long side\n  of Pencil's tip. When you want a thin stroke you use the tip.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1482796039786.yml",
    "content": "_id: a385f580-cbc5-11e6-99ca-4334121032fa\nmessage: >-\n  Hi Michael  -  received \"Paper\"as a Christmas present. Today your site was\n  emailed to me. Wonderful. Thankful for the gift and for your gift of so useful\n  a guide.\nemail: 0641f3eb0e81572534026190fbdcacfb\nname: shirley creazzo\nurl: ''\nhidden: ''\ndate: '2016-12-26T23:47:19.785Z'\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1483358374441.yml",
    "content": "_id: ed14f9e0-d0e2-11e6-9105-3b0a58ef0a97\nmessage: \"Hi Michael, thank you so much for that masterpiece you created here! Helped a lot!\\r\\nStill I have one question: is there any way of \\\"resizing\\\" objects? I mean you can obviously cut out parts and move them but is there a way of changing their size?\\r\\nThank you so much!\"\nemail: 1762ac0f818a39aeb58924c4a016c032\nname: Claus\nurl: ''\nhidden: ''\ndate: '2017-01-02T11:59:34.438Z'\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1483378029067.yml",
    "content": "_id: b02e6010-d110-11e6-9105-3b0a58ef0a97\nreplying_to: '34'\nmessage: \"As far as I know of, no. You can just reposition objects you've cut out using the scissors.\\r\\n\\r\\nSeems like a feature that would beer nice to have though. [Procreate](http://procreate.si/) for example let's you resize, rotate, and reposition selections.\"\nemail: 1ce71bc10b86565464b612093d89707e\nname: Michael Rose\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2017-01-02T17:27:09.067Z'\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1521003277476.yml",
    "content": "_id: cb88c370-2743-11e8-ac89-b753cc11aef0\n_parent: /mastering-paper/introduction-tool-guide/\nmessage: >-\n  How i can set canvas size? Because i want to designed with 120cm of square. I\n  will be print in that measurement.\nname: Nadia\nemail: 32e334829d6a10c0ecd34346f3d23faf\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2018-03-14T04:54:37.475Z'\n"
  },
  {
    "path": "src/_data/comments/introduction-tool-guide/comment-1521031808041.yml",
    "content": "_id: 38f2d760-2786-11e8-ac89-b753cc11aef0\n_parent: /mastering-paper/introduction-tool-guide/\nmessage: \"You can't change the canvas size in Paper. You'll have to use a different app after the fact, that can resize/crop your image.\\r\\n\\r\\nIf you want more control over the canvas size you might want to look at [**Procreate**](https://procreate.art/).\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '35'\nhidden: ''\ndate: '2018-03-14T12:50:08.040Z'\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1443288485000.yml",
    "content": "id: comment-2275505732\ndate: 2015-09-26T17:28:05Z\nupdated: 2015-09-26T17:28:05Z\n_paper: /articles/ipad-pro/\nname: Ezhik\nurl: ''\nmessage: \"Have you ever considered the Surface Pro?\"\navatar: https://disqus.com/api/users/avatars/Ezhik.jpg\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1443288919000.yml",
    "content": "replying_to: '1'\nid: comment-2275515207\ndate: 2015-09-26T17:35:19Z\nupdated: 2015-09-26T17:35:19Z\n_paper: /articles/ipad-pro/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I did. If I wasn't tied into iOS I probably would have been more likely\n  to try one. But I like all the apps on iOS and using a Surface Pro just for art\n  seems silly in my case. Same reason I'm not really into Cintiqs.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1445087452000.yml",
    "content": "id: comment-2311995389\ndate: 2015-10-17T13:10:52Z\nupdated: 2015-10-17T13:10:52Z\n_paper: /articles/ipad-pro/\nname: Jay Versluis\nurl: ''\nmessage: \"Let me be that inner artist in you and give it to you straight: yes,\n  you're going to get an iPad Pro on Launch Day, and yes, you're going to have the\n  time of your life with it. You're too curious and way too talented to pass this\n  opportunity up. All those thoughts about *it's too expensive, it's too beta, it's\n  too unnecessary* - they will all go away moments after you start playing with Apple\n  Pencil. Trust your gut instinct on this.\\r\\n\\r\\nAsk yourself, have you ever regretted\n  the iPad Air 2 purchase? Was your previous iPad not good enough when you had it?\n  Or the purchase of that new iPhone when the old one was still packing a good punch?\n  You will love the iPad Pro, and it will be an investment into yourself as an artist.\n  It's the tablet you've we been waiting for. Why wait longer? There's always *a\n  better device coming soon*, but with that attitude, you'll be forever waiting and\n  not creating. And that's just not you.\\r\\n\\r\\nIf you're not sure about it, buy\n  it on launch day anyway and return it within 2 weeks. They'll give you a full refund\n  and won't ask questions. That will be a much bigger challenge, one you will pass\n  easily if you feel the technology just isn't there yet. Without buying it, and\n  thoroughly testing it, you'll never know what it's like to use the iPad Pro and\n  Apple Pencil. Besides, you'll get a good blog post out of it too ;-)\\r\\n\\r\\nPS:\n  I'm not working for Apple, and I don't get a commission when you buy the iPad\n  Pro.\"\navatar: https://disqus.com/api/users/avatars/jayversluis.jpg\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1445094865000.yml",
    "content": "replying_to: '2'\nid: comment-2312139915\ndate: 2015-10-17T15:14:25Z\nupdated: 2015-10-17T15:14:25Z\n_paper: /articles/ipad-pro/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"All good points. I'm certain I'd love the Pro. What I'm wrestling with\n  is will I have buyer's remorse if I drop a grand on something I don't really *need*\n  when I'm pretty sure they will release the cheaper iPad Air 3 in the springtime.\\r\\n\\r\\nThat\n  and I'm still having a hard time convincing my wife it's a worthy purchase. Haha.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1446477237000.yml",
    "content": "id: comment-2338999630\ndate: 2015-11-02T15:13:57Z\nupdated: 2015-11-02T15:13:57Z\n_paper: /articles/ipad-pro/\nname: Nancy\nurl: ''\nmessage: \"My inner artist screams, I want that...but I'm a waiter by nature. The\n  best time to purchase if you want one soon would be to wait till January and buy\n  one from Best Buy in an opened box return. They are certified with full warranties.\n  I have always purchased popular electronics this way and have never had to return\n  any. Buying after Christmas returns...IT'S A GOOD THING...\"\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1446477609000.yml",
    "content": "replying_to: '3'\nid: comment-2339007702\ndate: 2015-11-02T15:20:09Z\nupdated: 2015-11-02T15:20:09Z\n_paper: /articles/ipad-pro/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"That sounds like the way to go. I wouldn't be surprised if Apple offers\n  refurbs on them too. I've bought a few Mac's over the years and they're typically\n  more reliable than the new stuff just because they've been thoroughly tested before\n  resale.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1446825359000.yml",
    "content": "id: comment-2345951129\ndate: 2015-11-06T15:55:59Z\nupdated: 2015-11-06T15:55:59Z\n_paper: /articles/ipad-pro/\nname: Marty\nurl: ''\nmessage: \"Great Article. I too like Procreate but sometimes feel there are too\n  many options which can be overwhelming. Also wished they would put the color palettes\n  and tools always visible like in Paper.\\r\\n\\r\\nAs for the iPad Pro will be getting\n  it at launch and will probable get a charging Apple Pencil dock from Moxiware.\"\navatar: https://disqus.com/api/users/avatars/disqus_jAimaZBv1z.jpg\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1446825629000.yml",
    "content": "replying_to: '4'\nid: comment-2345958429\ndate: 2015-11-06T16:00:29Z\nupdated: 2015-11-06T16:00:29Z\n_paper: /articles/ipad-pro/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I've started adding a *palette* layer to my Procreate works so I can quickly\n  sample and switch colors. Not quite the same as an always visible palette toolbar,\n  but it helps.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/ipad-pro/comment-1459302268000.yml",
    "content": "id: comment-2596065967\ndate: 2016-03-30T01:44:28Z\nupdated: 2016-03-30T01:44:28Z\n_paper: /articles/ipad-pro/\nname: 'Alex '\nurl: ''\nmessage: \"I bought an iPad pro and a pencil and you don't have to plug the pencil\n  into the pad because with it comes a connection which you can use to plug it directly into the charger.\"\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1471818805944.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nmessage: This post definitively deserves static comments.\nname: Frank Taillandier\nemail: 398aad0e0e78f0db97a937fa6cb5ebea\nurl: 'http://frank.taillandier.me'\nhidden: ''\ndate: '2016-08-21T22:33:25.272Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1471902168765.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nmessage: >-\n  Thank you once again to rise the bar for the development of Jekyll themes. Now\n  I want to try this, too. Disqus was – *like you wrote* – a necessary evil.\n  Staticman looks like the ideal solution.\nname: Moritz »mo.« Sauer\nemail: 427cc33a6a0b82643396f1b0acbba087\nurl: 'http://mo.phlow.de/'\nhidden: ''\ndate: '2016-08-22T21:42:48.075Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1471904599908.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '2'\nmessage: >-\n  It's pretty darn slick that's for sure! Hardest part to the whole thing was\n  getting all the Disqus comments converted into `.yml` files.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-08-22T22:23:19.187Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1473470466689.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nmessage: \"This is simply fantastic, Michael. Great work! I'm curious to know how the switch to static comments has affected your [crawl stats in Google Search Console](https://www.google.com/webmasters/tools/crawl-stats?hl=en&siteUrl=https://mademistakes.com/). If I had to guess you should see more frequent crawling and less time spent downloading, which could carry aggregate benefits not obvious until analyzed over a longer period of time.\\r\\n\\r\\nSince you're looking for alternative static commenting strategies...I stumbled upon [jekyll-aws-comments](https://github.com/ummels/jekyll-aws-comments) today linked from [lambda-comments](https://github.com/jimpick/lambda-comments). It's probably more complex to get going but ideal for control freaks who don't want to rely on a 3rd party, and who might already be [hosting their Jekyll blogs on AWS with CloudFront](https://habd.as/pagespeed-100-with-jekyll-s3-and-cloudfront/) for example. Again, great work! Love it!!\"\nname: Josh Habdas\nemail: bda486b80a2e80a8e22afe69dd621303\nurl: 'https://habd.as'\nhidden: ''\ndate: '2016-09-10T01:21:05.995Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1473476859458.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '3'\nmessage: \"Thanks Josh. I came across those as well in my search but since I don't have any experience with AWS I passed them over. Definitely seem like good options though, especially if you're hosting with AWS.\\r\\n\\r\\nAs far as stats. I launched static comments in mid-August, looking at my crawl stats there isn't much that jumps out to me. Kilobytes downloaded seems to be trending up but hard to tell.\\r\\n\\r\\n![Made Mistakes crawl stats](https://mademistakes.com/assets/images/crawl-stats.png)\\r\\n\\r\\nOne thing I've noticed is the need for better comment spam filtering. I get around 1-3 submitted comments a day that are clearly spammers trying to get backlinks. Back with Disqus I got zero, so it must have been doing a good job of filtering that junk out.\\r\\n\\r\\nNot entirely sure if its bot driven or not but thinking if Staticman adds [support for ReCaptcha](https://github.com/eduardoboucas/staticman/issues/20), that might help combat it.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-09-10T03:07:38.790Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1474541157403.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nmessage: \"I have been searching for a decent alternative of Disqus for a few years now. This is the best one so far. Thanks a lot, Michael! \\r\\nI was wondering, does Staticman support threaded comments? If not, would I be able to get it by tinkering with the styling?\"\nname: Arnab Wahid\nemail: 2b5f4253acf477e13cea08554f070fef\nurl: ''\nhidden: ''\ndate: '2016-09-22T10:45:56.616Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1474544952860.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '4'\nmessage: \"@Arnab,\\r\\n\\r\\nI'm sure Staticman could be \\\"bended\\\" to support threaded comments, but it would take some work on your end. Off the top of my head I'd probably do something similar to how Wordpress adds **reply** links to each comment.\\r\\n\\r\\nThat could be used to create a variable that references the comment # being replied to. Which you'd send with the rest of the comment data to Staticman, adding it the YAML Front Matter.\\r\\n\\r\\nThen in the comment Liquid code you'd add some sort of check for that variable and if present on the current comment, pull in any replies. Probably using something like [the `where` filter](https://www.siteleaf.com/blog/advanced-liquid-where/).\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-09-22T11:49:12.123Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1475225027509.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nmessage: \"Hey Michael,\\r\\nGreat post indeed, However I have some questions:\\r\\n\\r\\n1. How would you include pictures in your comments?\\r\\n2. I want my pages to have comments to, especially the homepage. But I don't know what would be my homepage slug.\\r\\n\\r\\nWith thanks\"\nname: Hosein\nemail: a9d5ac624b6aefd6919c2ea624a4642b\nurl: ''\nhidden: ''\ndate: '2016-09-30T08:43:46.706Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1475234134458.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '5'\nmessage: \"Since Markdown is supported you can write something like:\\r\\n\\r\\n```markdown\\r\\n![title](image.jpg)\\r\\n```\\r\\n\\r\\nTo add images to a comment.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-09-30T11:15:33.750Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1475236046603.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '5'\nmessage: \"Also. I'm pretty sure `slug` is available to not only posts, but pages. I know for certain it works with collection documents because I use this exact same method to add comments to my [FAQ section](https://mademistakes.com/faqs/website-tools/), which is built using a collection.\\r\\n\\r\\nExperiment and try it out. As long as a page has a unique identifier you should be able to pull a `_data` file with comments (or any other content).\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-09-30T11:47:25.820Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1475310701030.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '5'\nmessage: >-\n  Thank you Michael. As far as I tried, there was no page slug available for\n  pages. I solved this problem by defining 'slug' as a custom variable for each\n  page.\nname: Hosein\nemail: a9d5ac624b6aefd6919c2ea624a4642b\nurl: ''\nhidden: ''\ndate: '2016-10-01T08:31:40.216Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1475532174089.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nmessage: >-\n  Thanks Michael. i have a question: how can i add staticman comment to my blog?\n  i'm using Windows and host my Jekyll on Firebase\nname: Duc Nguyen\nemail: 651918741a734b1cad5b2c22e1cc39c5\nurl: ''\nhidden: ''\ndate: '2016-10-03T22:02:53.283Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1475632403135.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '6'\nmessage: >-\n  @Duc Start by reading this post :wink:. The steps I followed to add Staticman\n  are all here. I have no experience with Firebase so I'd be no help there but\n  the Jekyll side of things would be very similar to what I've outlined above.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-10-05T01:53:22.342Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1477998248959.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nmessage: >-\n  I am revamping my website and moving to Jekyll. I am not sure, if Staticman\n  works in case I am pushing only `_site` folder to Github?\nname: Bozdar\nemail: 59ca798bb22d86663d64803adb03ea34\nurl:\nhidden: ''\ndate: '2016-11-01T11:04:08.323Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1478016071095.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '7'\nmessage: \"@Bozdar - I think it's doable, just might introduce some complexity to your build/deploy process.\\r\\n\\r\\nFor example, I don't use GitHub to build or host my site, but simply store my source files there in a repo. My build/deploy process with Staticman goes like this:\\r\\n\\r\\n1. Comment is submitted to Staticman, which creates a pull request against my site repo on GitHub.\\r\\n2. Comment pull request is merged and then I pull that commit to my local repo.\\r\\n3. Build the site locally.\\r\\n4. Deploy the contents of my `_site` folder to my server. I use a [Gulp rsync](https://www.npmjs.com/package/gulp-rsync) task but there are several [other options](https://jekyllrb.com/docs/deployment-methods/) available to you.\\r\\n\\r\\nAll Staticman needs is to be made a collaborator on your repo and be able to see your `_config.yml` so it can be configured.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\nurl: 'https://mademistakes.com'\ndate: '2016-11-01T16:01:10.425Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1478063323913.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '7'\nmessage: \"Michael. Then, it seems a bit easy but real situation is that I am hosting my website on Github, at least for the time being. So, I do not find Staticman helpful enough because it needs  `_config.yml` file to work. I may use Staticman in future when I change my host.\\r\\n\\r\\nMany thanks, for the help.\"\nname: Bozdar\nemail: d05a562b97e8c991809dca114bcd6dd8\nhidden: ''\ndate: '2016-11-02T05:08:43.280Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1480411331742.yml",
    "content": "_id: 4eb7dde0-b615-11e6-afed-91cd03f51af0\n_parent: /articles/jekyll-static-comments/\nmessage: \"Thanks for the awesome template *Minimal Mistakes*.\\r\\n\\r\\nUnfortunately, I couldn't configure static comments for my project.\\r\\n\\r\\nI receive pull requests on github, but comments not published in my post.\\r\\n<https://github.com/danykeep/danykeep.github.io>\\r\\n\\r\\nHelp me please, how can i solve this problem? I tried to turn to false moderation option, but it didn't help.\"\nname: Dany Keep\nemail: ''\nhidden: ''\ndate: '2016-11-29T09:22:11.741Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1480420973319.yml",
    "content": "_parent: /articles/jekyll-static-comments/\nreplying_to: '8'\n_id: c1953950-b62b-11e6-afed-91cd03f51af0\nmessage: \"@Dany\\r\\n\\r\\nChange Staticman's path in **_config.yml**. You were probably using the demo site's path which places the comment data files in a different location. You want it set as:\\r\\n\\r\\n```yaml\\r\\nstaticman:\\r\\n  path: \\\"/_data/comments/{options.slug}\\\"\\r\\n```\\r\\n\\r\\nMove your existing `/comments/` folder under `/_data/` after you make the config change and on rebuild they should up.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2016-11-29T12:02:53.318Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1480543395287.yml",
    "content": "_id: cac44ed0-b748-11e6-9b81-0bc3350a75b6\n_parent: /articles/jekyll-static-comments/\nreplying_to: '4'\nmessage: >-\n  Staticman now supports [threaded\n  comments](https://github.com/eduardoboucas/staticman/issues/35). The Liquid\n  you need to craft can get messy, but it's manageable if you don't nest too\n  deep.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2016-11-30T22:03:15.286Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1481420308218.yml",
    "content": "_id: 839c63b0-bf42-11e6-b898-f5b6dfcafc8b\n_parent: /articles/jekyll-static-comments/\nreplying_to: '4'\nmessage: >-\n  **Thanks for the update.** I have been meaning to bother you with a couple of\n  questions but been hesitant about it for obvious reasons. I am still not sure\n  if I should attempt a conversation that will probably never end! However,\n  initially , I am just looking for some advice. But first, let me read your\n  latest post first. I will continue my nervous babbling there.\nemail: 2b5f4253acf477e13cea08554f070fef\nname: Arnab Wahid\nurl: ''\nhidden: ''\ndate: '2016-12-11T01:38:28.216Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1483340098562.yml",
    "content": "_id: 5fd540f0-d0b8-11e6-83c1-37ee8f07523d\n_parent: /articles/jekyll-static-comments/\nmessage: >-\n  This code has been a terrific help to me for a site I'm working on... but I'm\n  having quite a time trying to sort my comments by the date. `{% raw %}{% assign\n  comments = site.data.comments[page.slug] | sort: \"date\" %}{% endraw %}` is throwing an\n  error to the effect that there's no implicit conversion of String into\n  Integer. My filenames aren't going to be guaranteed sequential, so sorting by\n  those won't work... any idea what might be going wrong here?\nemail: 08ed66551d57a545c0d07b7b659e4076\nname: Chuck\nurl: ''\nhidden: ''\ndate: '2017-01-02T06:54:58.560Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1483381261200.yml",
    "content": "_id: 36ac4a60-d118-11e6-9105-3b0a58ef0a97\n_parent: /articles/jekyll-static-comments/\nreplying_to: '9'\nmessage: \"I had the same problem when trying to sort using the `date` value. I think the issue is Staticman captures that field as a string since it's encased in single quotes, causing Liquid to throw an error as it can't compare strings against integers... or a date timestamp.\\r\\n\\r\\nI tried everything I could think of to convert the `date` values from a string so they could be sorted, but never found a solution. Jekyll has several [filters](http://jekyllrb.com/docs/templates/#filters) for converting to various date formats and even the `to_integer`, so I thought if I could capture the array, filter it the date fields, then I'd have an array with date values that I could sort. Never got that working though.\\r\\n\\r\\nIn the end I threw in the towel and just renamed all my legacy comment `_data` files so they were sequential using a Unix timestamp, matching the same filename format I defined for Staticman (`filename: comment-{@timestamp}`).\"\nemail: 1ce71bc10b86565464b612093d89707e\nname: Michael Rose\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2017-01-02T18:21:01.199Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1486117804509.yml",
    "content": "_id: b9a043d0-e9fb-11e6-9036-933179d399bb\n_parent: /articles/jekyll-static-comments/\nreplying_to: '8'\nmessage: \"I had similar problem with @Dany, and it has been resolved by changing `path` and `/comment/` folder. \\r\\n\\r\\nBut, now I get another problem that comment cannot be submitted. Error message: \\r\\n\\r\\n`Sorry, there was an error with your submission. Please make sure all required fields have been completed and try again` \\r\\n\\r\\nThank you.\\r\\n\\r\\nRepo: https://github.com/nurandi/nurandi.github.io\"\nname: Nur Andi Setiabudi\nemail: 8d27cffdf7fdf83b6fb4f75e6d7f4ece\nhidden: ''\ndate: '2017-02-03T10:30:04.508Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1486142233909.yml",
    "content": "_id: 9aa06260-ea34-11e6-ad79-4f1d9783ac7b\n_parent: /articles/jekyll-static-comments/\nreplying_to: '8'\nmessage: \"@Nur - Likely something is off with your Staticman config. If you open your browser's web development tools and look at the Console output it will give you a better idea of what data from the form Staticman doesn't like.\\r\\n\\r\\nFor example if I try to submit a comment with the name and email fields blank you'll see this error in the Console.\\r\\n\\r\\n![Console screenshot](https://i.imgur.com/xW4WJWh.jpg)\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-02-03T17:17:13.904Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1486169040991.yml",
    "content": "_id: 04dbef80-ea73-11e6-ad79-4f1d9783ac7b\n_parent: /articles/jekyll-static-comments/\nreplying_to: '8'\nmessage: \"@Michael\\r\\n\\r\\nProblem has been resolved by changing \\r\\n\\r\\n```\\r\\nstaticman:\\r\\n     path: \\\"/_data/comments/{options.slug}\\\"\\r\\n```\\r\\n\\r\\nto\\r\\n\\r\\n```\\r\\nstaticman:\\r\\n    path: \\\"_data/comments/{options.slug}\\\"\\r\\n```\"\nname: Nur Andi Setiabudi\nemail: 8d27cffdf7fdf83b6fb4f75e6d7f4ece\nhidden: ''\ndate: '2017-02-04T00:44:00.988Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1486206444999.yml",
    "content": "_id: 1b6e0fb0-eaca-11e6-ad79-4f1d9783ac7b\n_parent: /articles/jekyll-static-comments/\nmessage: \"@Michael,\\r\\n\\r\\nI get problem when import comment from disqus by running `rake disquscomments`\\r\\n\\r\\n```\\r\\n$ rake disquscomments\\r\\n\\r\\nrake aborted!\\r\\nLoadError: cannot load such file -- domainatrix\\r\\n_rake/disqus_comments.rake:5:in `<top (required)>'\\r\\n/Users/widyaningsih/Documents/3. Andi/nurandi.github.io/Rakefile:8:in `load'\\r\\n/Users/widyaningsih/Documents/3. Andi/nurandi.github.io/Rakefile:8:in `block in <top (required)>'\\r\\n/Users/widyaningsih/Documents/3. Andi/nurandi.github.io/Rakefile:8:in `each'\\r\\n/Users/widyaningsih/Documents/3. Andi/nurandi.github.io/Rakefile:8:in `<top (required)>'\\r\\n/usr/local/lib/ruby/gems/2.4.0/gems/rake-12.0.0/exe/rake:27:in `<top (required)>'\\r\\n```\\r\\n\\r\\nAny idea what might be going wrong here?\"\nname: Nur Andi Setiabudi\nemail: 8d27cffdf7fdf83b6fb4f75e6d7f4ece\nhidden: ''\ndate: '2017-02-04T11:07:24.993Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1486222105647.yml",
    "content": "_id: 91f557f0-eaee-11e6-ad79-4f1d9783ac7b\n_parent: /articles/jekyll-static-comments/\nreplying_to: '10'\nmessage: >-\n  The error message is a clue. It's looking for the domainmatrix gem. You likely\n  don't have it installed so it's failing. Try `gem install domainmatrix`\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-02-04T15:28:25.646Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1494496419518.yml",
    "content": "_id: b4f94f90-362f-11e7-8856-9b031097afe5\n_parent: /articles/jekyll-static-comments/\nmessage: >-\n  On an individual post, how can show comments but disable any new comments\n  (maybe by not showing the 'add comment' box)? Am using staticman.\nname: SS\nemail: 194b0f78b3831beab2453b68535c5b67\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-05-11T09:53:39.510Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1494504562948.yml",
    "content": "_id: ab143860-3642-11e7-8856-9b031097afe5\n_parent: /articles/jekyll-static-comments/\nmessage: \"You can do something like what I've done wrapping the comment form with a Liquid conditional:\\r\\n\\r\\n```html\\r\\n{% unless page.comments_locked == true %}\\r\\n  <!-- comment form here -->\\r\\n{% else %}\\r\\n  <p><em>Comments are closed.</em></p>\\r\\n{% endunless %}\\r\\n```\\r\\n\\r\\nThen I add `comments_locked: true` to a post's YAML Front Matter that I want to disable adding new comments to. You can see an example of [how that looks here](https://mademistakes.com/articles/ipad-pro/#comments).\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '11'\nhidden: ''\ndate: '2017-05-11T12:09:22.946Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1494703323003.yml",
    "content": "_id: 7143d5c0-3811-11e7-9482-f763614034ec\n_parent: /articles/jekyll-static-comments/\nmessage: >-\n  Thank you for this great article. I will have a look at how to use this in\n  Hugo (I am just starting with Hugo but it should not be that of a big deal\n  with the details you provided)\nname: Wojtek\nemail: 6a8f2f5f292c75c5e81a6607530a0ab6\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-05-13T19:22:02.962Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-static-comments/comment-1508081755669.yml",
    "content": "_id: 88270290-b1be-11e7-b553-d17830342549\n_parent: /articles/jekyll-static-comments/\nmessage: >-\n  Thanks for the post. I'm looking to add comments to my blog...though I can't\n  help but wonder, if my website is to be interactive, why aren't I using\n  wordpress or something? Feels like a lot of trouble to do something that\n  *should* be pretty basic\nname: Chris\nemail: 3cabb2808f31727a972349bc65a87081\nurl: 'http://browncj.io'\nreplying_to: ''\nhidden: ''\ndate: '2017-10-15T15:35:55.655Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1423858419000.yml",
    "content": "id: comment-1852346108\ndate: 2015-02-13T20:13:39Z\nupdated: 2015-02-13T20:13:39Z\n_parent: /articles/jekyll-style-guide/\nname: 'Moritz \"mo.\" Sauer'\nurl: http://phlow.de/\nmessage: \"Hey Michael! Thank you for sharing. Since I saw the [pattern library by Mail Chimp](http://ux.mailchimp.com/patterns) I wanted to create a styleguide and already began. Like you, I want to do it with Jekyll. But doing it with a dedicated collection didn't cross my mind. Thank you for all your insights. Thank you for sharing your ideas and knowledge.\"\navatar: https://disqus.com/api/users/avatars/Moritz_mo_Sauer.jpg\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1424188094000.yml",
    "content": "replying_to: '1'\nid: comment-1859975107\ndate: 2015-02-17T15:48:14Z\nupdated: 2015-02-17T15:48:14Z\n_parent: /articles/jekyll-style-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Excellent. Glad it was helpful!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1429720942000.yml",
    "content": "id: comment-1981551893\ndate: 2015-04-22T16:42:22Z\nupdated: 2015-04-22T16:42:22Z\n_parent: /articles/jekyll-style-guide/\nname: Karlon Cromwell\nurl: ''\nmessage: \"Hey Michael how hard would it be to install Jekyll on digital ocean (or\n  a VPS)?\"\navatar: https://disqus.com/api/users/avatars/dantewaters.jpg\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1429721096000.yml",
    "content": "replying_to: '2'\nid: comment-1981556397\ndate: 2015-04-22T16:44:56Z\nupdated: 2015-04-22T16:44:56Z\n_parent: /articles/jekyll-style-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I feel like I've seen some blog posts talking about how to do it if you\n  Google around. But personally I don't have experience with it. I've only ever built\n  locally and rsync'd my content or used GitHub Pages.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1429722033000.yml",
    "content": "replying_to: '2'\nid: comment-1981586445\ndate: 2015-04-22T17:00:33Z\nupdated: 2015-04-22T17:00:33Z\n_parent: /articles/jekyll-style-guide/\nname: Karlon Cromwell\nurl: ''\nmessage: \"Let me try it and see.\"\navatar: https://disqus.com/api/users/avatars/dantewaters.jpg\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1451908434000.yml",
    "content": "replying_to: '2'\nid: comment-2438690300\ndate: 2016-01-04T11:53:54Z\nupdated: 2016-01-04T11:53:54Z\n_parent: /articles/jekyll-style-guide/\nname: Karlon Cromwell\nurl: ''\nmessage: \"Not good :(\"\navatar: https://disqus.com/api/users/avatars/dantewaters.jpg\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1474160329348.yml",
    "content": "_parent: /articles/jekyll-style-guide/\nmessage: Cool thing !\nname: RELSA\nemail: 9d6e1795705b314d834c768623e62a3d\nurl: ''\nhidden: ''\ndate: '2016-09-18T00:58:48.618Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1480597317935.yml",
    "content": "_id: 5721f670-b7c6-11e6-9b81-0bc3350a75b6\n_parent: /articles/jekyll-style-guide/\nmessage: \"As always this is goldmine! Thank you for the time you put in to research and share Jekyll tips! \\r\\n\\r\\nDid you figure out how to use rendered collection documents (output: true) as includes? Seems that this way there'd be a single point of reference for every component. Both the styleguide and the UI would be using the same component code and changes to component markup would have to be done only once.\"\nname: Ivan\nemail: a2f305dcdc125ddffdfcb18516f19ef1\nhidden: ''\ndate: '2016-12-01T13:01:57.922Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1480617534927.yml",
    "content": "_id: 6961b3a0-b7f5-11e6-9770-0502f5541edb\n_parent: /articles/jekyll-style-guide/\nreplying_to: '4'\nmessage: \"The thought never occurred to me to output the collection documents as includes. That would be pretty cool if you could output to `_includes` to DRY things up.\\r\\n\\r\\nBut I get the feeling that folder is probably reserved by Jekyll, or that it would end up outputting to `_site/_includes` which wouldn't help.\\r\\n\\r\\nWorth some testing though :smile:\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-12-01T18:38:54.926Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1480641516709.yml",
    "content": "_id: 3fb4c730-b82d-11e6-9770-0502f5541edb\n_parent: /articles/jekyll-style-guide/\nmessage: \"Hey Michael, thanks for replying! \\r\\n\\r\\nJust thought of another slightly quirky way of achieving this DRY-ness.\\r\\n\\r\\nWhat if a component markup is stored in `_includes/components/btn.html` and the collection document includes it via `{% include components/btn.html text=\\\"click me\\\" %}`? This could also be a nudge to liquidify the components for reuse in multiple contexts (e.g., same button with different copy)\"\nname: Ivan\nemail: a2f305dcdc125ddffdfcb18516f19ef1\nurl: 'http://ivanbabko.com/'\nhidden: ''\ndate: '2016-12-02T01:18:36.708Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1480648884375.yml",
    "content": "_id: 671b3be0-b83e-11e6-9770-0502f5541edb\n_parent: /articles/jekyll-style-guide/\nreplying_to: '5'\nmessage: >-\n  This is exactly how Hugo Giraudel proposes [building a living style guide with\n  Jekyll](https://www.sitepoint.com/setting-up-a-living-styleguide-in-jekyll/).\n  It's something I've been meaning to adapt for my site, just haven't had the\n  time.\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-12-02T03:21:24.373Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-style-guide/comment-1509381022944.yml",
    "content": "_id: a0108660-bd8f-11e7-b840-6d18dcdaf523\n_parent: /articles/jekyll-style-guide/\nmessage: \"A bit late to the conversation, but I want to note that you can include Markdown in the Frontmatter in an HTML by using a pipe to escape the content. This is what I used for my Jekyll styleguide\\r\\n\\r\\n```field: |\\r\\n    Markdown can be used *here*\\r\\n```\\r\\n\\r\\n`{{ page.field | markdownify }}`\"\nname: Matt G\nemail: f1a625b44f5dcff994266b4998905d87\nurl: 'http://himatt.com'\nreplying_to: ''\nhidden: ''\ndate: '2017-10-30T16:30:22.937Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1472608507317.yml",
    "content": "_parent: /work/jekyll-themes/\nmessage: Great job! You are doing amazing stuff. Happy to learn from you.\nname: Sergio\nemail: 53afaf67d940adcc68dae02590df75d1\nurl: http://sergiofores.es\nhidden: ''\ndate: '2016-08-31T01:55:06.632Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1473482520505.yml",
    "content": "_parent: /work/jekyll-themes/\nmessage: \"Hi Michael. I'm upgrading my site which is based on Phlow's Feeling Responsive; I figured the best way is to do that is to simply migrate my small site over to the code based on mademistakes. It's an awesome site. There is though one thing I can't figure out how to do which is to get a large header like this: https://mmistakes.github.io/minimal-mistakes/layout-header-image-text-readability/.\\r\\n\\r\\nAs an aside, though I started out looking for a way to upgrade my site's Foundation code, I discover a whole new world of painting on the iPad. I now got a 53 pencil and Procreate. Thank you for sharing with the world your very own beautiful world. You've made us all so much richer.\"\nname: Nghi Nguyen\nemail: 8c5e5237fe7ddc1e13e6ae13b9c133bb\nurl: ''\nhidden: ''\ndate: '2016-09-10T04:41:59.854Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1473556533295.yml",
    "content": "_parent: /work/jekyll-themes/\nreplying_to: '2'\nmessage: \"Made Mistakes isn't the same code base as my Minimal Mistakes theme. Some things are similar but not all. It also isn't that documented since it's my personal site.\\r\\n\\r\\nI'd suggest using Minimal Mistakes since that is released and [documented](https://mmistakes.github.io/minimal-mistakes/docs/quick-start-guide/) as a full fledged theme.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-09-11T01:15:32.607Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1473558917905.yml",
    "content": "_parent: /work/jekyll-themes/\nreplying_to: '2'\nmessage: >-\n  Yes, you've convinced me. It looks like it has everything I wanted, and more.\n  Thank you so much.\nname: Nghi Nguyen\nemail: 8c5e5237fe7ddc1e13e6ae13b9c133bb\nurl: ''\nhidden: ''\ndate: '2016-09-11T01:55:17.238Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1477568749399.yml",
    "content": "_parent: /work/jekyll-themes/\nmessage: >-\n  Minimal Mistakes theme is very good stuff. Can I put a photo on excerpt of\n  posts ? I try multiple things but i don't find !\nname: Frédéric Letellier\nemail: fda5a0af300f7d6762f26007975d9de6\nurl: ''\nhidden: ''\ndate: '2016-10-27T11:45:48.764Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1477582192405.yml",
    "content": "_parent: /work/jekyll-themes/\nreplying_to: '3'\nmessage: \"@Frédéric - with some hacking of the theme files you can add images to an archive listing. I would suggest adding something like {% raw %}`{% if post.image.teaser %}<img src=\\\"{{ post.image.teaser }}\\\" alt=\\\"\\\">{% endif %}`{% endraw %} to [**_includes/archive-single.html**](https://github.com/mmistakes/minimal-mistakes/blob/master/_includes/archive-single.html) where you'd like the image to appear.\\r\\n\\r\\nWith some additional CSS to style things how you want and adding the following YAML Front Matter to your posts you should be able to do what you want.\\r\\n\\r\\n```yaml\\r\\nimage:\\r\\n  teaser: path-to-your-post-image.jpg\\r\\n```\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-10-27T15:29:51.735Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1477583060139.yml",
    "content": "_parent: /work/jekyll-themes/\nreplying_to: '3'\nmessage: \"You can also leverage the [\\\"grid\\\" archive type](https://mmistakes.github.io/minimal-mistakes/docs/layouts/#grid-view) if you don't want to edit any templates.\\r\\n\\r\\nSimply change `{% include archive-single.html %}` to `{% include archive-single.html type=\\\"grid\\\" %}` in your index pages (eg. the [home page](https://github.com/mmistakes/minimal-mistakes/blob/master/index.html#L11)) and you'll get a 4 column grid of posts.\\r\\n\\r\\n![grid view screenshot](https://mmistakes.github.io/minimal-mistakes/assets/images/mm-archive-grid-view-example.jpg)\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-10-27T15:44:19.479Z'\n"
  },
  {
    "path": "src/_data/comments/jekyll-themes/comment-1477660246228.yml",
    "content": "_parent: /work/jekyll-themes/\nreplying_to: '3'\nmessage: >-\n  @Michael Rose  Thank you, I have implement the first solution, but the second\n  solution works too ! I think you would say : Simply change {% raw %}`{% if\n  post.image.teaser %}<img src=\"{{ post.image.teaser }}\" alt=\"\">{% endif %}`{% endraw %}\nname: Frédéric Letellier\nemail: fda5a0af300f7d6762f26007975d9de6\nurl: 'http://fredericletellier.com'\nhidden: ''\ndate: '2016-10-28T13:10:45.559Z'\n"
  },
  {
    "path": "src/_data/comments/kramdown-table-html/comment-1486592019781.yml",
    "content": "_id: d7f60000-ee4b-11e6-b550-7b45ad070525\n_parent: /til/kramdown-table-html/\nmessage: >-\n  I have the opposite challenge ... getting kramdown to process text inside a\n  `<details>` tag. I would prefer not to drop into html when writing `<details>`.\n  The solution I've come across is <http://movb.de/jekyll-details-support.html>.\n  This plugin works great, but it is not supported by github pages, so I have to\n  transfer my whole `_site` to github. Have you come across a kramdown extension\n  that says \"hey kramdown, process me!\".\nname: Willy McAllister\nemail: 72f6ffec6e34ab5d69f3811272b5ae97\nhidden: ''\ndate: '2017-02-08T22:13:39.780Z'\n"
  },
  {
    "path": "src/_data/comments/kramdown-table-html/comment-1486649903528.yml",
    "content": "_id: 9d4beb40-eed2-11e6-b550-7b45ad070525\n_parent: /til/kramdown-table-html/\nreplying_to: '1'\nmessage: \"Have you looked at the [`markdownify` filter](https://jekyllrb.com/docs/templates/)? I use it to do something similar to place Markdown text inside of a `figcaption` element.\\r\\n\\r\\nThere's several ways to handle this without the need of a plugin. You could do something like this with a Liquid `capture`:\\r\\n\\r\\n```liquid\\r\\n{% capture your_md %}Here is some Markdown you'd like to **capture**.{% endcapture %}\\r\\n```\\r\\n\\r\\nThen inject the captured variable into whatever you want and add the Markdownify filter so Kramdown processes it like so:\\r\\n\\r\\n```html\\r\\n<details>\\r\\n  {{ your_md | markdownify }}\\r\\n</details>\\r\\n```\\r\\n\\r\\nWhich would give you the following HTML output:\\r\\n\\r\\n```html\\r\\n<details>\\r\\n  <p>Here is some Markdown you'd like to <strong>capture</strong>.</p>\\r\\n</details>\\r\\n```\\r\\n\\r\\nIf you don't want to bother with all the captures you could build your own [Jekyll include](https://jekyllrb.com/docs/includes/#passing-parameters-to-includes) that you could pass text through as a `parameter` to be Markdownified.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-02-09T14:18:23.527Z'\n"
  },
  {
    "path": "src/_data/comments/kramdown-table-html/comment-1486666477277.yml",
    "content": "_id: 33ffac40-eef9-11e6-b550-7b45ad070525\n_parent: /til/kramdown-table-html/\nreplying_to: '1'\nmessage: \"Captures work nicely! I added a summary, and removed the spurious `<p>` tags so the summary lines up with the open icon. \\r\\n\\r\\n```html\\r\\n{% capture summary %}Here is my Markdown *summary*{% endcapture %}\\r\\n{% capture details %}Here is my Markdown **captured**.{% endcapture %}\\r\\n\\r\\n<details>\\r\\n    <summary>{{ summary | markdownify | remove: '<p>' | remove: '</p>' }}</summary>\\r\\n    {{ details | markdownify }}\\r\\n</details>\\r\\n```\"\nname: Willy McAllister\nemail: 72f6ffec6e34ab5d69f3811272b5ae97\nhidden: ''\ndate: '2017-02-09T18:54:37.276Z'\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1374242320000.yml",
    "content": "---\nid: comment-968908628\ndate: 2013-07-19T13:58:40Z\nupdated: 2013-07-19T13:58:40Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Mihai Soloi\nurl: ''\nmessage: \"amazing design man, long time waiting for a theme like this... love it!!!\"\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1374242363000.yml",
    "content": "replying_to: '1'\nid: comment-968909883\ndate: 2013-07-19T13:59:23Z\nupdated: 2013-07-19T13:59:23Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks sir!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1376016953000.yml",
    "content": "id: comment-993903275\ndate: 2013-08-09T02:55:53Z\nupdated: 2013-08-09T02:55:53Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: nxbtch\nurl: ''\nmessage: \"fucking beautiful. only exist in my dream!\"\navatar: https://disqus.com/api/users/avatars/nxbtch.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1380310527000.yml",
    "content": "id: comment-1061677465\ndate: 2013-09-27T19:35:27Z\nupdated: 2013-09-27T19:35:27Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Lindsay Kay\nurl: http://xeolabs.com/\nmessage: \"Michael - brilliant work, exactly what I needed. Typography spot on,\n  clean code, flawless install. Thanks!\"\navatar: https://disqus.com/api/users/avatars/lindsaykay.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1380310612000.yml",
    "content": "replying_to: '3'\nid: comment-1061680044\ndate: 2013-09-27T19:36:52Z\nupdated: 2013-09-27T19:36:52Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Awesome. Glad it's been useful.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1382812169000.yml",
    "content": "replying_to: '3'\nid: comment-1097694156\ndate: 2013-10-26T18:29:29Z\nupdated: 2013-10-26T18:29:29Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Lindsay Kay\nurl: http://xeolabs.com/\nmessage: 'Minimal Mistakes in the wild: <a href=\"http://xeolabs.com\" rel=\"nofollow\">http://xeolabs.com</a>'\navatar: https://disqus.com/api/users/avatars/lindsaykay.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1382816973000.yml",
    "content": "replying_to: '3'\nid: comment-1097760204\ndate: 2013-10-26T19:49:33Z\nupdated: 2013-10-26T19:49:33Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Sweet! Thanks for sharing.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1383048145000.yml",
    "content": "id: comment-1100665316\ndate: 2013-10-29T12:02:25Z\nupdated: 2013-10-29T12:02:25Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: taiar, a.\nurl: http://taiar.com.br/\nmessage: \"this theme is awesome. wonderful work!\"\navatar: https://disqus.com/api/users/avatars/ataiar.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1384332903000.yml",
    "content": "id: comment-1120936380\ndate: 2013-11-13T08:55:03Z\nupdated: 2013-11-13T08:55:03Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: zjxhz\nurl: ''\nmessage: \"A simple yet beautiful theme, thanks! However, I would like to be able\n  to customize the style a bit, for example I don't like the indent of a new paragraph\n  and its close margin to the previous one. So I had to comment out the `\\\"p+p\\\"` part\n  in `main.min.css`. I'm very new to css, actually I had only spent less than a few\n  hours to learn it today, so it was difficult for me to customize it further, e.g.\n  to change the font of the posts, without a clear document.\\r\\n\\r\\nSo my question\n  is that is there a document associated with this `main.min.css` file? Or at least\n  can I find a pretty formatted one(formatting it with some tools led me to some errors)?\n  I can only guess that it contains something from <git.io/normalize> but they seem very different now, or it a combination\n  of other css files too?\"\navatar: https://disqus.com/api/users/avatars/zjxhz.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1384343739000.yml",
    "content": "replying_to: '5'\nid: comment-1121070288\ndate: 2013-11-13T11:55:39Z\nupdated: 2013-11-13T11:55:39Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I've created a few Jekyll themes after this one so forgive me if I jumble\n  this up. They're all starting to blend together to me now ;-)\\r\\n\\r\\nThe typography\n  in this theme was heavily based off of Typeplate's set of styles. I liked the indents\n  and no padding around paragraphs because it mimic the typography of most books,\n  which is a feel I was going for.\\r\\n\\r\\n[Typeplate](http://typeplate.com) has since dropped support for LESS, so I removed\n  it for the most part and incorporated a few mixins as a base to build off of.\\r\\n\\r\\nIf\n  you're new to CSS then there's a lot going on with the theme that I can't easily\n  explain in a comment. To further complicate it I use LESS to build all of the stylesheets,\n  which are broken up into smaller chunks and preprocessed to output `main.min.css`.\n  That's another layer of abstraction that you'd have to get familiar with on top\n  of learning CSS.\\r\\n\\r\\nBut if you take a look at the .less files you'll see they're\n  much more logical than digging through `main.min.css` which has been optimized for\n  speed by removing extra spaces and comments. The .less files have more documentation\n  to help customize. For the most part if you bump around `typography.less`, `page.less`,\n  and `variables.less` you should be able to do some simple modifications to suit your\n  taste.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1384349480000.yml",
    "content": "replying_to: '5'\nid: comment-1121193256\ndate: 2013-11-13T13:31:20Z\nupdated: 2013-11-13T13:31:20Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: zjxhz\nurl: ''\nmessage: \"Thanks for the quick reply! It seems to me now more clear and logical\n  even I'm still confused, but I'm happy already with the paragraph changes I've made\n  and I'll leave other customizations to future.\"\navatar: https://disqus.com/api/users/avatars/zjxhz.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1412440284000.yml",
    "content": "id: comment-1619564868\ndate: 2014-10-04T16:31:24Z\nupdated: 2014-10-04T16:31:24Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Luca\nurl: http://lucablog.it\nmessage: \"This is a beautiful theme!! One question, if possible.\\r\\n\\r\\nI want to\n  change the home page , so that it contains the list of posts instead of recent posts\n  (like your theme \\\"hpstr\\\")\\r\\n\\r\\nIs it possible? If yes, how?\\r\\n\\r\\nThank you very\n  much.\"\navatar: https://disqus.com/api/users/avatars/disqus_qtQpBfAMF0.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1412448545000.yml",
    "content": "replying_to: '6'\nid: comment-1619754090\ndate: 2014-10-04T18:49:05Z\nupdated: 2014-10-04T18:49:05Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Anything is possible. You'll have to modify `index.html` to pull in full\n  posts instead of just the title and excerpt.\\r\\n\\r\\nIf you look at HPSTR you should\n  be able to get some inspiration and modify the [homepage code](https://github.com/mmistakes/hpstr-jekyll-theme/blob/master/index.html) and apply it to the\n  Minimal Mistakes theme.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1412858111000.yml",
    "content": "id: comment-1626912450\ndate: 2014-10-09T12:35:11Z\nupdated: 2014-10-09T12:35:11Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Jordi Pont-Tuset\nurl: http://jponttuset.github.io/\nmessage: \"Thanks a lot for this theme, I love it!\\r\\n\\r\\nYou can check [my version here](http://jponttuset.github.io) :)\"\navatar: https://disqus.com/api/users/avatars/jponttuset.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1413708833000.yml",
    "content": "id: comment-1643151037\ndate: 2014-10-19T08:53:53Z\nupdated: 2014-10-19T08:53:53Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: raathigesh\nurl: 'http://raathigesh.com/'\nmessage: \"Beautiful Theme. Love it :)\"\navatar: https://disqus.com/api/users/avatars/raathigesh.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1413994614000.yml",
    "content": "replying_to: '8'\nid: comment-1648340641\ndate: 2014-10-22T16:16:54Z\nupdated: 2014-10-22T16:16:54Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Looking good!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1414713040000.yml",
    "content": "id: comment-1662243662\ndate: 2014-10-30T23:50:40Z\nupdated: 2014-10-30T23:50:40Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Clayton Burlison\nurl: https://clburlison.com/\nmessage: \"You have a bad link on this page. Under the \\\"Usage\\\" header, the \\\"read\n  up here\\\" should now link to <https://mmistakes.github.io/minimal-mistakes/>.\"\navatar: https://disqus.com/api/users/avatars/clburlison.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1414763591000.yml",
    "content": "replying_to: '9'\nid: comment-1663038741\ndate: 2014-10-31T13:53:11Z\nupdated: 2014-10-31T13:53:11Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Eagle eyes. That's for the bad link catch.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1418667408000.yml",
    "content": "id: comment-1743554074\ndate: 2014-12-15T18:16:48Z\nupdated: 2014-12-15T18:16:48Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: chippyash\nurl: http://the-matrix.github.io/\nmessage: \"Thank you Michael - just started with it (and Jekyll.) Made setting up\n  my Github page very easy and quick.\"\navatar: https://disqus.com/api/users/avatars/disqus_maZQ0V355P.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1418916531000.yml",
    "content": "id: comment-1748621898\ndate: 2014-12-18T15:28:51Z\nupdated: 2014-12-18T15:28:51Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Luca\nurl: http://lucablog.it\nmessage: \"Thanks for the advice! This is my first work with \\\"minimal mistakes\\\" theme\n  (v. 0.1 beta ;)).\"\navatar: https://disqus.com/api/users/avatars/disqus_qtQpBfAMF0.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1421030768000.yml",
    "content": "id: comment-1787843988\ndate: 2015-01-12T02:46:08Z\nupdated: 2015-01-12T02:46:08Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Brian Moseley\nurl: ''\nmessage: \"Is it possible to create a dropdown \\\"submenu\\\" with this theme through\n  the data file and some alterations to `navigation.html`?\"\navatar: https://disqus.com/api/users/avatars/disqus_Kr3WZABtYx.jpg\n"
  },
  {
    "path": "src/_data/comments/minimal-mistakes-jekyll-theme/comment-1421031174000.yml",
    "content": "replying_to: '12'\nid: comment-1787850784\ndate: 2015-01-12T02:52:54Z\nupdated: 2015-01-12T02:52:54Z\n_parent: /work/minimal-mistakes-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"It is possible if your CSS skills are strong. It's tricky to do\n  multi-leveled navigation with Jekyll but it can be done. I couldn't think of a one-size\n  fits all solution to cover every use-case so I purposely kept things simple.\n  You can certainly hack something together that would meet your specific needs.\\r\\n\\r\\nYou'll likely have to hard code some of the navigation lists rather than relying on data\n  files for all of the menus. Unless you want to string together some crazy Liquid\n  spaghetti code to do it.\\r\\n\\r\\nI'd Google around for some ideas. I know I've seen\n  a blog post or two with ways of dealing with tiered and dynamic navigations in Jekyll.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/mix/comment-1412753804000.yml",
    "content": "id: comment-1624803068\ndate: 2014-10-08T07:36:44Z\nupdated: 2014-10-08T07:36:44Z\n_parent: /mastering-paper/mix/\nname: Aditya\nurl: ''\nmessage: \"Followed you using the web profile. Look forward to better learning your\n  clever methods!\\r\\n\\r\\nI'm not sure what the Search bar atop Mix is meant to be for.\n  I can't seem to be able to search for any person's name. Ideally one should even\n  be able to search also for things or tags.\\r\\n\\r\\nPerhaps being a new inductee into\n  the cult, 53 won't allow me to look people up, until I've proven my worth.\"\n"
  },
  {
    "path": "src/_data/comments/mix/comment-1492205887363.yml",
    "content": "_id: a59f6730-215a-11e7-9019-797640daeab0\n_parent: /mastering-paper/mix/\nmessage: \"I am not going anywhere once I get on the Mix site.  I can't get anything but public stream and the sites suggested to follow by Mix..no forums and none of the tutorials or things you  mention above.  On my iPad all the folders are different and all are private. I don't know how to make them public.  Could you  do a tutorial that goes into the actual step by step procedures? \\r\\nThe two links above that say \\\"Using...\\\" go to \\\"Oops!\\\" pages\\r\\nI tried the 53 support forum but got into another dead end.\\r\\nThanks.\"\nname: Lynn Mason\nemail: 36706b1d526ff840e9cfa9bbfb26c818\nurl: 'https://www.instagram.com/lynn.mason/?hl=en'\nreplying_to: ''\nhidden: ''\ndate: '2017-04-14T21:38:07.361Z'\n"
  },
  {
    "path": "src/_data/comments/mix/comment-1492213260760.yml",
    "content": "_id: d0823160-216b-11e7-9019-797640daeab0\n_parent: /mastering-paper/mix/\nmessage: \"I haven't used Mix in years and it looks like things might have changed some since I first wrote this up.\\r\\n\\r\\nThere are no forums on the Mix/Paper site. It's just a place to share ideas and collaborate by remixing them. To find \\\"tutorials\\\" you'll have to follow people who share them. \\r\\n\\r\\nSince I'm not really involved with the community much these days not really sure where to start but following 53 on [Twitter](https://twitter.com/fiftythree) and [Facebook](https://www.facebook.com/fiftythree) would be good options. They often feature creators, and I know I've seen various tutorials and such in their feeds. They also do artist takeovers on their [Instagram page](https://www.instagram.com/fiftythree/) if that's more of your thing.\\r\\n\\r\\nThe forums I mentioned are the [FiftyThree support](https://support.fiftythree.com/hc/en-us) ones... which looks like they changed too... that's why some of the links were broken.\\r\\n\\r\\nI've updated the ones at the end to remedy that. Hope this helps.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '2'\nhidden: ''\ndate: '2017-04-14T23:41:00.758Z'\n"
  },
  {
    "path": "src/_data/comments/mix/comment-1504542666081.yml",
    "content": "_id: 72d896b0-918e-11e7-acc3-59682e045002\n_parent: /mastering-paper/mix/\nmessage: >-\n  Hello, I've used P53 for a long time now, however I stopped for a bit, and now\n  it seems that the Mix is gone! I talked with some of my friends from the Mix,\n  but no one knows what happened, they too had stopped using it. Do you have an\n  idea as to what has happened? I am thoroughly baffled.\nname: PeaceCrane13\nemail: c86b7d7624fc9334112739daa0d9ec3d\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-09-04T16:31:06.079Z'\n"
  },
  {
    "path": "src/_data/comments/mix/comment-1504543993669.yml",
    "content": "_id: 8a181910-9191-11e7-acc3-59682e045002\n_parent: /mastering-paper/mix/\nmessage: \"End of June FiftyThree sent out an email saying they were shutting down the Public Stream/Mix on August 15th due to low usage.\\r\\n\\r\\n> **Shutting down the Public Stream / Mix**\\r\\n>\\r\\n> The Public Stream feature of Paper will shut down on August 15th. Three years ago, we launched the Public Stream (previously known as Mix) as a place for users to share and remix Paper creations. It was born out of idealism and curiosity, a wish to open up creativity and share Paper creations around the globe. While sharing sparked tremendous creativity, a relatively small number of Paper creators continue to use the Public Stream today. Many creators find a larger, more engaged audience by sharing publicly on [Instagram](https://www.instagram.com/explore/tags/madewithpaper/), [Twitter](https://twitter.com/search?f=tweets&vertical=default&q=%23madewithpaper&src=typd), [Tumblr](https://www.tumblr.com/tagged/madewithpaper) and elsewhere. Since the social web has proven to be better place to share your work with the world, we have decided to shut down the Public Stream and focus on the core Paper experience.\\r\\n>\\r\\n> Be sure to save ideas posted only to the Public Stream before August 15th if you want to keep them. Ideas in Paper grids other than the Public Stream will remain on your device.\\r\\n>\\r\\n> Starting today, we encourage you to share your Paper creations on your preferred social network using the #MadeWithPaper hashtag. We will be launching a website soon that showcases Paper creations from popular social networks.\\r\\n>\\r\\n> Shutting down the Public Stream will allow us to iterate faster on Paper and introduce many exciting new features. A major update is planned for Paper later this year that includes the return of Paper journals and other features. Stay tuned for details in the coming months.\\r\\n>\\r\\n> We want to thank everyone who shared their creativity on Mix. In many ways, seeing your ideas has made us even stronger believers in our cause, to make creativity more accessible.\\r\\n>\\r\\n> We hope to see you online.\\r\\n>\\r\\n> Georg Petschnigg\\r\\nCo-Founder and CEO, FiftyThree\\r\\n\\r\\n[![Mix shutdown email screenshot](https://mademistakes.com/assets/images/mix-shutdown-email.png)](https://mademistakes.com/assets/images/mix-shutdown-email.png)\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: ''\nhidden: ''\ndate: '2017-09-04T16:53:13.667Z'\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1384271634000.yml",
    "content": "id: comment-1119728380\ndate: 2013-11-12T15:53:54Z\nupdated: 2013-11-12T15:53:54Z\n_parent: /mastering-paper/moleskine-book/\nname: CarminaSimdesigner\nurl: ''\nmessage: \"Hey Michael, this is a fantastic example of how awesome creating a Book\n  with Paper is and also how your amazing artistic skills are. Thank you for sharing\n  your process in such a beautifully crafted blog page. I appreciate every detail.\"\navatar: https://disqus.com/api/users/avatars/carminasimdesigner.jpg\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1384374095000.yml",
    "content": "replying_to: '1'\nid: comment-1121844898\ndate: 2013-11-13T20:21:35Z\nupdated: 2013-11-13T20:21:35Z\n_parent: /mastering-paper/moleskine-book/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks for the encouraging words and for reading. I appreciate it!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1384716886000.yml",
    "content": "id: comment-1127183766\ndate: 2013-11-17T19:34:46Z\nupdated: 2013-11-17T19:34:46Z\n_parent: /mastering-paper/moleskine-book/\nname: GiaK@StonedSoulUrban\nurl: ''\nmessage: \"This is beautiful. Wish the app was available for androids. I would love\n  to be able to sketch my own lookbooks for jewelry design, and have them printed\n  immediately, without having to go to a printing place. :(\"\navatar: https://disqus.com/api/users/avatars/giakstonedsoulurban.jpg\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1389535857000.yml",
    "content": "id: comment-1197201101\ndate: 2014-01-12T14:10:57Z\nupdated: 2014-01-12T14:10:57Z\n_parent: /mastering-paper/moleskine-book/\nname: Peter Bryenton\nurl:\nmessage: \"I read a lot of user guides and watch some videos. Your skills as a graphic\n  designer and your experience as a digital artist really shine through this series.\n  I am looking forward to seeing the rest of this series as it 'unfolds' (your pun\n  I believe).\"\navatar: https://disqus.com/api/users/avatars/Peter_Bryenton.jpg\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1389540070000.yml",
    "content": "replying_to: '3'\nid: comment-1197252147\ndate: 2014-01-12T15:21:10Z\nupdated: 2014-01-12T15:21:10Z\n_parent: /mastering-paper/moleskine-book/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I'm still new to guide writing and reviews, so I'm glad to hear they're\n  coming off well. Thanks for reading, I appreciate it.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1396289276000.yml",
    "content": "id: comment-1312106206\ndate: 2014-03-31T18:07:56Z\nupdated: 2014-03-31T18:07:56Z\n_parent: /mastering-paper/moleskine-book/\nname: Adrian\nurl: ''\nmessage: \"Brilliant and thorough article. Many thanks for this. I was wondering,\n  do you know if image quality if Paper is enough to send off to be printed on T-shirts\n  or CD covers? (Or does one have to go through this custom print process in order\n  to see images of decent quality happen outside of the digital world?)\"\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1396300941000.yml",
    "content": "replying_to: '4'\nid: comment-1312366673\ndate: 2014-03-31T21:22:21Z\nupdated: 2014-03-31T21:22:21Z\n_parent: /mastering-paper/moleskine-book/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks. You should be fairly safe printing outside of Paper's \\\"book\\\" feature.\n  I've printed 8x10\\\" images just fine and I know others have blown them up 18x24 as\n  canvas prints. There will probably be some artifacts and noise when you enlarge\n  past 8x10, but depending on the drawing it might look just fine.\\r\\n\\r\\nIf you have\n  an iPad with retina screen, images output to your camera roll at 2048×1536 pixels.\n  On an iPad mini it's half that.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1407656447000.yml",
    "content": "id: comment-1535815316\ndate: 2014-08-10T07:40:47Z\nupdated: 2014-08-10T07:40:47Z\n_parent: /mastering-paper/moleskine-book/\nname: David\nurl: ''\nmessage: \"Hi there. Can the books be ordered from outside the US?\"\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1407693910000.yml",
    "content": "replying_to: '5'\nid: comment-1536326395\ndate: 2014-08-10T18:05:10Z\nupdated: 2014-08-10T18:05:10Z\n_parent: /mastering-paper/moleskine-book/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"As far as I know yes they can be ordered and shipped internationally.\n  Don't know if every country is supported but a good majority of them are.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1409500178000.yml",
    "content": "id: comment-1567513567\ndate: 2014-08-31T15:49:38Z\nupdated: 2014-08-31T15:49:38Z\n_parent: /mastering-paper/moleskine-book/\nname: Tote\nurl: ''\nmessage: \"Hello!\\r\\n\\r\\nI am thinking on get a paper book as gift to my boyfriend.\n  If you leave blank pages can you write on them later with a pen, for example or\n  is photographic paper?\\r\\n\\r\\nThank you!\"\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1409500579000.yml",
    "content": "replying_to: '6'\nid: comment-1567520668\ndate: 2014-08-31T15:56:19Z\nupdated: 2014-08-31T15:56:19Z\n_parent: /mastering-paper/moleskine-book/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You can write on the blank pages. They aren't glossy and have a matte\n  finish like a normal piece of paper so they should hold ink just fine.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1409501319000.yml",
    "content": "replying_to: '6'\nid: comment-1567533759\ndate: 2014-08-31T16:08:39Z\nupdated: 2014-08-31T16:08:39Z\n_parent: /mastering-paper/moleskine-book/\nname: Tote\nurl: ''\nmessage: \"Thank you very much from Granada, Spain.\"\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1414348570000.yml",
    "content": "id: comment-1654742438\ndate: 2014-10-26T18:36:10Z\nupdated: 2014-10-26T18:36:10Z\n_parent: /mastering-paper/moleskine-book/\nname: Xavier\nurl: ''\nmessage: \"Thank you Michael! Xavier, From Spain\"\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1416273233000.yml",
    "content": "id: comment-1698388324\ndate: 2014-11-18T01:13:53Z\nupdated: 2014-11-18T01:13:53Z\n_parent: /mastering-paper/moleskine-book/\nname: Gary Birtles\nurl: ''\nmessage: \"There is some great are on here. I love the color choices and the style\n  overall. I'd love to have something like this. I really enjoyed looking at your\n  work.\"\navatar: https://disqus.com/api/users/avatars/garybirtles.jpg\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1419841481000.yml",
    "content": "id: comment-1762745141\ndate: 2014-12-29T08:24:41Z\nupdated: 2014-12-29T08:24:41Z\n_parent: /mastering-paper/moleskine-book/\nname: Jean Newman\nurl: ''\nmessage: \"I am an ancient person familiar with file and image saving in MS Office\n  and Photoshop. Can I save Paper images in the same way or send them to my camera\n  roll?  Thanks.\"\navatar: https://disqus.com/api/users/avatars/jeannewman.jpg\n"
  },
  {
    "path": "src/_data/comments/moleskine-book/comment-1419875526000.yml",
    "content": "replying_to: '9'\nid: comment-1763323579\ndate: 2014-12-29T17:52:06Z\nupdated: 2014-12-29T17:52:06Z\n_parent: /mastering-paper/moleskine-book/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yes you can save your Paper pages to the Camera Roll. You have to pinch\n  the page you want to export so it zooms out some. Then 3 buttons should appear below\n  it, the middle one with the Share icon is what you want. Tap that and swipe over\n  to the right one screen to reveal the \\\"Save to Camera Roll\\\" button.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1409692467000.yml",
    "content": "---\nid: comment-1570995903\ndate: 2014-09-02T21:14:27Z\nupdated: 2014-09-02T21:14:27Z\n_parent: /mastering-paper/moving-the-loupe/\nname: sebohannon\nurl: ''\nmessage: \"Thank you for being here for us Michael. I'm only nine days into Paper\n  and you've been invaluable to me. You're an angel. Sarah B.\"\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1409709008000.yml",
    "content": "replying_to: '1'\nid: comment-1571313456\ndate: 2014-09-03T01:50:08Z\nupdated: 2014-09-03T01:50:08Z\n_parent: /mastering-paper/moving-the-loupe/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \":smile:\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1411765932000.yml",
    "content": "id: comment-1607533470\ndate: 2014-09-26T21:12:12Z\nupdated: 2014-09-26T21:12:12Z\n_parent: /mastering-paper/moving-the-loupe/\nname: Nick Bova\nurl: ''\nmessage: \"By any chance do you have a YouTube with step by step tutorials?\"\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1411775661000.yml",
    "content": "replying_to: '2'\nid: comment-1607725055\ndate: 2014-09-26T23:54:21Z\nupdated: 2014-09-26T23:54:21Z\n_parent: /mastering-paper/moving-the-loupe/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I have a bunch of [Paper videos on YouTube](http://youtube.com/user/anotherjpeg), but they're not traditional\n  step by step tutorials. More of time lapse videos of me drawing from start to finish.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1411776807000.yml",
    "content": "replying_to: '2'\nid: comment-1607742396\ndate: 2014-09-27T00:13:27Z\nupdated: 2014-09-27T00:13:27Z\n_parent: /mastering-paper/moving-the-loupe/\nname: Nick Bova\nurl: ''\nmessage: \"That's perfect I can still learn from time lapse videos! Thanks for all\n  of these tutorials they are really helping me as starting on my artistic career!\"\navatar: https://disqus.com/api/users/avatars/nickbova.jpg\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1444333805000.yml",
    "content": "id: comment-2297132275\ndate: 2015-10-08T19:50:05Z\nupdated: 2015-10-08T19:50:05Z\n_parent: /mastering-paper/moving-the-loupe/\nname: Zoe\nurl: ''\nmessage: \"I recently started using paper app and can not figure out a way to bring\n  out the zoom loupe, when I pinch to zoom, all it does is to zoom normally as apple\n  images does. Please some one help me?\"\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1444333880000.yml",
    "content": "replying_to: '3'\nid: comment-2297134488\ndate: 2015-10-08T19:51:20Z\nupdated: 2015-10-08T19:51:20Z\n_parent: /mastering-paper/moving-the-loupe/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"FiftyThree removed the zoom loupe in version 3.0. Pinching now zooms\n  the entire canvas.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/moving-the-loupe/comment-1444369942000.yml",
    "content": "replying_to: '3'\nid: comment-2297828430\ndate: 2015-10-09T05:52:22Z\nupdated: 2015-10-09T05:52:22Z\n_parent: /mastering-paper/moving-the-loupe/\nname: Zoe\nurl: ''\nmessage: \"Thank you, I was straggling to make it happen all day.\\r\\n\\r\\nYour posts\n  are very helpful, Thank you, and good luck with everything!\"\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1412001283000.yml",
    "content": "id: comment-1610928891\ndate: 2014-09-29T14:34:43Z\nupdated: 2014-09-29T14:34:43Z\n_parent: /mastering-paper/paper-2-0/\nname: Edwin van den Bogert\nurl: ''\nmessage: \"Thanks for this article Michael ! ps. the Bamboo stylus not only draws\n  instead of blending, sometimes it also starts acting as the eraser. I tried both\n  the soft nib and the hard nib (ACK20501 and ACK20601) and both have these problems.\"\navatar: https://disqus.com/api/users/avatars/edwinvandenbogert.jpg\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1412001496000.yml",
    "content": "replying_to: '1'\nid: comment-1610933422\ndate: 2014-09-29T14:38:16Z\nupdated: 2014-09-29T14:38:16Z\n_parent: /mastering-paper/paper-2-0/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I noticed a similar thing with some styli erasing when Pencil is connected.\n  I couldn't reproduce it 100% of the time but it does happen. At one point I had\n  Blend turned off and my finger started erasing stuff. That was partially my fault\n  because my other hand was pressing down the Eraser end of Pencil while my finger\n  slide across the screen, but I did have it happen a few times when I wasn't holding\n  Pencil.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1414194263000.yml",
    "content": "---\nid: comment-1652452391\ndate: 2014-10-24T23:44:23Z\nupdated: 2014-10-24T23:44:23Z\n_parent: /mastering-paper/paper-2-0/\nname: CeliaMaria Lana-daCosta Zannon\nurl: ''\nmessage: \"Idem ibidem!...\"\navatar: https://disqus.com/api/users/avatars/celiamarialanadacostazannon.jpg\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1414194627000.yml",
    "content": "---\nid: comment-1652458137\ndate: 2014-10-24T23:50:27Z\nupdated: 2014-10-24T23:50:27Z\n_parent: /mastering-paper/paper-2-0/\nname: CeliaMaria Lana-daCosta Zannon\nurl: ''\nmessage: \"Thank you for another enlightening article, Michael! It is a relief knowing\n  these are not problems due to my naive lack of skills... In fact when I noticed\n  my Bamboo and Targus Styluses were drawing instead of blending I experienced sorrow\n  for a while ... Then I thought it was not such a terrible thing to happen. 'Cause\n  I could save my Pencil tip from wearing out when painting over larger areas... Anyway\n  I hope bug corrections will come soon...\"\navatar: https://disqus.com/api/users/avatars/celiamarialanadacostazannon.jpg\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1414195676000.yml",
    "content": "replying_to: '3'\nid: comment-1652474485\ndate: 2014-10-25T00:07:56Z\nupdated: 2014-10-25T00:07:56Z\n_parent: /mastering-paper/paper-2-0/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"From my quick tests most of these bugs were fixed in the 2.0.1 update.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1414200349000.yml",
    "content": "replying_to: '3'\nid: comment-1652629208\ndate: 2014-10-25T01:25:49Z\nupdated: 2014-10-25T01:25:49Z\n_parent: /mastering-paper/paper-2-0/\nname: CeliaMaria Lana-daCosta Zannon\nurl: ''\nmessage: \"Nope! I have the last 2.0.2 update... experienced erasing just today...\n  and I did not inadvertently touched erase tool!... And still can draw with my Bamboo\n  with Pencil connected!...\"\navatar: https://disqus.com/api/users/avatars/celiamarialanadacostazannon.jpg\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1414201059000.yml",
    "content": "replying_to: '3'\nid: comment-1652640199\ndate: 2014-10-25T01:37:39Z\nupdated: 2014-10-25T01:37:39Z\n_parent: /mastering-paper/paper-2-0/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Maybe I'm not noticing the bugs as much because I'm using the new iPad\n  Air 2 that has some changes with touch.\\r\\n\\r\\nTo be honest none of these bugs have\n  really plagued me. I have to go out of my way to reproduce them. Could be my particular\n  way of drawing and using the tools doesn't trigger them as much. The Bamboo bug\n  in particular doesn't bother me since I blend with my finger as the tool was intended.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1414208123000.yml",
    "content": "replying_to: '3'\nid: comment-1652738175\ndate: 2014-10-25T03:35:23Z\nupdated: 2014-10-25T03:35:23Z\n_parent: /mastering-paper/paper-2-0/\nname: CeliaMaria Lana-daCosta Zannon\nurl: ''\nmessage: \"Thanks for taking your time replying.\"\navatar: https://disqus.com/api/users/avatars/celiamarialanadacostazannon.jpg\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1418870081000.yml",
    "content": "---\nid: comment-1747802928\ndate: 2014-12-18T02:34:41Z\nupdated: 2014-12-18T02:34:41Z\n_parent: /mastering-paper/paper-2-0/\nname: Flapjack McWafflebacon\nurl: ''\nmessage: \"Thanks for the thorough article on these bugs! I'm glad to see I'm not\n  the only one. I posted on 53's support threads about the update killing my ability\n  to use a Bamboo stylus to blend. Their response indicated that they were unaware\n  of this but that they would pass it on to the engineers. I hope they take care of\n  it because I really can't go back to blending with my finger. Has anyone else mentioned\n  it to 53 and/or heard anything else about plans to fix it?\"\n"
  },
  {
    "path": "src/_data/comments/paper-2-0/comment-1418870541000.yml",
    "content": "replying_to: '4'\nid: comment-1747810444\ndate: 2014-12-18T02:42:21Z\nupdated: 2014-12-18T02:42:21Z\n_parent: /mastering-paper/paper-2-0/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I've seen a few bring it up that the Bamboo doesn't let you blend anymore.\n  Since it has been a few months since then with no change my guess is it's not a\n  high priority.\\r\\n\\r\\nMy only suggestion is to try a different stylus that has a\n  thicker nub if blending with your finger isn't an option. I only use my finger so\n  I can't really say if it's gotten better with recent updates or not. I tend to use\n  all of the tools as they were designed rather than fighting with the app.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/paper-3-features/comment-1442496381000.yml",
    "content": "id: comment-2258464233\ndate: 2015-09-17T13:26:21Z\nupdated: 2015-09-17T13:26:21Z\n_parent: /mastering-paper/paper-3-features/\nname: Nancy\nurl: ''\nmessage: \"Thank you for this review! Usually, I just pick up the new features as\n  I stumble across them and then play with how I might use them. I found your MASTERING\n  PAPER series last year and became an avid (silent) fan...* : )\"\n"
  },
  {
    "path": "src/_data/comments/paper-3-features/comment-1444847315000.yml",
    "content": "id: comment-2307350853\ndate: 2015-10-14T18:28:35Z\nupdated: 2015-10-14T18:28:35Z\n_parent: /mastering-paper/paper-3-features/\nname: Sophie Lynn\nurl: ''\nmessage: \"Wow! This review is amazing! Looks like I haven't got the best of it\n  out yet~\"\navatar: https://disqus.com/api/users/avatars/disqus_rBWEjYNPHD.jpg\n"
  },
  {
    "path": "src/_data/comments/paper-3-features/comment-1451637735000.yml",
    "content": "id: comment-2434559460\ndate: 2016-01-01T08:42:15Z\nupdated: 2016-01-01T08:42:15Z\n_parent: /mastering-paper/paper-3-features/\nname: Sel Orm\nurl: ''\nmessage: \"I owe you a debt of gratitude for this blog, but I'll come right out\n  and say that this sounds like sponsored PR hogwash to me. When I got my fifty three\n  pencil I decided to learn how to draw all over again more naturally (without layers).\n  I'd had paper before the pencil, I'd used it before and it was great, but pairing\n  Paper with pencil took the experience to a whole new level. Making strokes with\n  the tip, flipping it over to erase, blending and even using palm grip (I'd never\n  used palm grip in my life. Not even with real pencils) and then there was the time\n  you could export and get your journal printed. How awesome was that? Say what you\n  will about the journals, they are most impressive (And really? You'd draw in the\n  same journal for a year?) Paper didn't feel like an app. It felt like...Paper. Real\n  paper. Now all that is gone, and it's been replaced by this...ordinary note taking\n  app which is fine (because I found a backed up older version and reinstalled it).\n  My point I do not believe there's an artist alive who experienced the magic of paper\n  and is excited by features that existed in MS paint. The new features are more geared\n  towards note taking than artistic expression - spotlight, annotation etc... Paper\n  is not paper anymore. It's just another soulless app. A big big shame.\"\navatar: https://disqus.com/api/users/avatars/sel_orm.jpg\n"
  },
  {
    "path": "src/_data/comments/paper-3-features/comment-1451669973000.yml",
    "content": "replying_to: '3'\nid: comment-2434912960\ndate: 2016-01-01T17:39:33Z\nupdated: 2016-01-01T17:39:33Z\n_parent: /mastering-paper/paper-3-features/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Agree about all the note taking features added, I use none of them and\n  prefer more powerful apps like Evernote for that sort of thing.\\r\\n\\r\\nThe journal\n  UI switch is a matter of preference I think. I don't disagree that Paper had some\n  growing pains when 3.0 launched, but most of those have been addressed in recent\n  updates. I personally like to organize my thousands of sketches into a few journals\n  vs. hundreds of smaller journals. I accept that I'm not the norm since I seriously\n  doubt the average Paper user has as many sketches as I have. Being able to scroll\n  throw a grid view to find something is way more usable then the old tedious way\n  of flipping page by page if you ask me. And even if I broke a journal of 100+ pages\n  into several smaller ones you now have the added problem of remembering what journal\n  you stuck a sketch in.\\r\\n\\r\\nAnd that's not even addressing the problems with the\n  old journals and how they'd often accidentally flip to a new page when drawing near the canvas' edge. Sure the Moleskine look is gone but if you ask me that\n  was a necessary change to make the app usable on both iPad and iPhone.\\r\\n\\r\\nAt\n  the end of the day I care most about how the actual pens, pencil, and watercolor\n  tools function. None of that was messed with. Everything else is either icing\n  on the cake or a distraction depending on your perspective. If you don't like the\n  social stuff don't use it, note taking and picture import... don't use it.\\r\\n\\r\\nI get\n  why people are upset with the core stuff being changed or removed, but the addition of new tools\n  and features? Not a big deal if you ask me.\\r\\n\\r\\nThats a bummer on the Book printing feature being killed.\n  I wrongly assumed it was still available since there's an option to \\\"Print Book\\\"\n  when in journal view, but it just goes to a currently unavailable page. Not sure if that's permanent or what.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/paperfaces-ipad-portrait-project/comment-1397086226000.yml",
    "content": "id: comment-1327655813\ndate: 2014-04-09T23:30:26Z\nupdated: 2014-04-09T23:30:26Z\n_parent: /articles/paperfaces-ipad-portrait-project/\nname: designrock\nurl: ''\nmessage: \"Thanks for recommending the app. Love it.\"\navatar: https://disqus.com/api/users/avatars/designrock.jpg\n"
  },
  {
    "path": "src/_data/comments/paperfaces-ipad-portrait-project/comment-1409086872000.yml",
    "content": "id: comment-1560642013\ndate: 2014-08-26T21:01:12Z\nupdated: 2014-08-26T21:01:12Z\n_parent: /articles/paperfaces-ipad-portrait-project/\nname: Kevin Bradberry\nurl:\nmessage: \"iPad art fan, here. I love how you've mixed free time creativity, generosity,\n  and income stream. Very cool. I think I'll share this article on my blog.\"\navatar: https://disqus.com/api/users/avatars/kevinbradberry.jpg\n"
  },
  {
    "path": "src/_data/comments/paperfaces-ipad-portrait-project/comment-1409101674000.yml",
    "content": "replying_to: '2'\nid: comment-1560982980\ndate: 2014-08-27T01:07:54Z\nupdated: 2014-08-27T01:07:54Z\n_parent: /articles/paperfaces-ipad-portrait-project/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Kevin. Appreciate the kind words and potential share on your blog.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/paperfaces-ipad-portrait-project/comment-1409744303000.yml",
    "content": "replying_to: '2'\nid: comment-1571741422\ndate: 2014-09-03T11:38:23Z\nupdated: 2014-09-03T11:38:23Z\n_parent: /articles/paperfaces-ipad-portrait-project/\nname: Kevin Bradberry\nurl:\nmessage: \"Posted it a few days ago. My blog is young, so take this with a grain\n  of salt, but it became my second most popular post http://kevinbradberry.net/2014/08/27/ipad-artist-michael-rose/. The credit is all yours.\\r\\n\\r\\n\"\navatar: https://disqus.com/api/users/avatars/kevinbradberry.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil/comment-1436507171000.yml",
    "content": "id: comment-2127954974\ndate: 2015-07-10T05:46:11Z\nupdated: 2015-07-10T05:46:11Z\n_parent: /mastering-paper/pencil/\nname: Ramma Mak\nurl: https://www.ramma.net/\nmessage: \"Awesome! Very helpful, thanks!\"\navatar: https://disqus.com/api/users/avatars/RammaMak.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil/comment-1436635594000.yml",
    "content": "id: comment-2130454287\ndate: 2015-07-11T17:26:34Z\nupdated: 2015-07-11T17:26:34Z\n_parent: /mastering-paper/pencil/\nname: Keeven Eeven\nurl: ''\nmessage: \"Wow. You've taken this tool as far as it can go nice work. I love sketching\n  with my pencil. I hope they continue to develop it...\"\navatar: https://disqus.com/api/users/avatars/keeveneeven.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil/comment-1450107421000.yml",
    "content": "id: comment-2409196092\ndate: 2015-12-14T15:37:01Z\nupdated: 2015-12-14T15:37:01Z\n_parent: /mastering-paper/pencil/\nname: Mike Moon\nurl: ''\nmessage: \"I wanted to learn a little something about the 53 Pencil before the anticipated\n  Saint Nick delivery of one.\\r\\n\\r\\nWow. You've covered a ton of techniques.Thank\n  you ever so much.\"\navatar: https://disqus.com/api/users/avatars/disqus_T8PXqkkThQ.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil/comment-1454859871000.yml",
    "content": "id: comment-2501074557\ndate: 2016-02-07T15:44:31Z\nupdated: 2016-02-07T15:44:31Z\n_parent: /mastering-paper/pencil/\nname: Suzé Gilbert\nurl: ''\nmessage: \"Michael, this and all of your Paper tutorials are fantastic. Thank you\n  so much for sharing your techniques and tips. Question, can you provide all of these\n  in an ePub or PDF format so one can download them and read it in iBooks? I would\n  very gladly pay for something like this. Just a thought.\"\navatar: https://disqus.com/api/users/avatars/suz_gilbert.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil/comment-1498956349543.yml",
    "content": "_id: caa25450-5ebf-11e7-86d0-f3e2da84fd3f\n_parent: /mastering-paper/pencil/\nmessage: 'ANDROID APP PLEASE. very sad user base, so many android users want this'\nname: Robert P Wilson\nemail: 5e84f6ec80a67f1c3571cf9881d90a1d\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-07-02T00:45:49.541Z'\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1386811734000.yml",
    "content": "id: comment-1159482200\ndate: 2013-12-12T01:28:54Z\nupdated: 2013-12-12T01:28:54Z\n_parent: /mastering-paper/pencil-53-review/\nname: markwhite007\nurl: ''\nmessage: \"All we need now is the ability to buy extra tips.\"\navatar: https://disqus.com/api/users/avatars/markwhite007.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1386856922000.yml",
    "content": "replying_to: '1'\nid: comment-1160021192\ndate: 2013-12-12T14:02:02Z\nupdated: 2013-12-12T14:02:02Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Agreed!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387010432000.yml",
    "content": "id: comment-1162790360\ndate: 2013-12-14T08:40:32Z\nupdated: 2013-12-14T08:40:32Z\n_parent: /mastering-paper/pencil-53-review/\nname: Jay Versluis\nurl: ''\nmessage: \"It's a nice enough stylus alright, but for $60 you might as well buy\n  a Pogo Connect and use it with many other apps. Who wants a stylus that works with\n  only a single app, with severe limitations, that prides itself on not having a proper\n  backup option?\\r\\n\\r\\nNice try, FiftyThree... but get with the picture!\"\navatar: https://disqus.com/api/users/avatars/jayversluis.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387034954000.yml",
    "content": "id: comment-1163220840\ndate: 2013-12-14T15:29:14Z\nupdated: 2013-12-14T15:29:14Z\n_parent: /mastering-paper/pencil-53-review/\nname: Guest\nurl: ''\nmessage: \"Do you have a screen protector on your iPad? FiftyThree said having one\n  would severely affect the tip. Which might explain why yours wore down so quickly.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387035962000.yml",
    "content": "replying_to: '3'\nid: comment-1163249735\ndate: 2013-12-14T15:46:02Z\nupdated: 2013-12-14T15:46:02Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"No screen protector for me so that's not it.  How quickly it wears is\n  based on the amount of pressure you apply. Because there's a hard tip behind the\n  rubber covering it eventually tares through it. Other styli that are just a rubber\n  nib don't have that problem.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387036146000.yml",
    "content": "replying_to: '2'\nid: comment-1163255031\ndate: 2013-12-14T15:49:06Z\nupdated: 2013-12-14T15:49:06Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Well Pencil does work with other apps, as a normal \\\"dumb\\\" capacitive stylus\n  ;-)\\r\\n\\r\\nMaybe they'll work on a SDK for Pencil and allow app makers to support\n  it like TenOne Design does with the Pogo Connect.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387384508000.yml",
    "content": "id: comment-1168878251\ndate: 2013-12-18T16:35:08Z\nupdated: 2013-12-18T16:35:08Z\n_parent: /mastering-paper/pencil-53-review/\nname: Bill Morein (FiftyThree)\nurl: ''\nmessage: \"We are planning to release an SDK - details to come soon.\"\navatar: https://disqus.com/api/users/avatars/billmoreinfiftythree.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387384550000.yml",
    "content": "replying_to: '1'\nid: comment-1168879158\ndate: 2013-12-18T16:35:50Z\nupdated: 2013-12-18T16:35:50Z\n_parent: /mastering-paper/pencil-53-review/\nname: Bill Morein (FiftyThree)\nurl: ''\nmessage: \"That is coming soon. If you need some urgently email support@fiftythree.com.\"\navatar: https://disqus.com/api/users/avatars/billmoreinfiftythree.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387386524000.yml",
    "content": "replying_to: '4'\nid: comment-1168921828\ndate: 2013-12-18T17:08:44Z\nupdated: 2013-12-18T17:08:44Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Sweet!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387510284000.yml",
    "content": "id: comment-1171046134\ndate: 2013-12-20T03:31:24Z\nupdated: 2013-12-20T03:31:24Z\n_parent: /mastering-paper/pencil-53-review/\nname: Knight2472000\nurl: ''\nmessage: \"How responsive is it? Using my finger on an iPad Air there is a small\n  delay. Does it pass for a real pencil speed?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1387512031000.yml",
    "content": "replying_to: '5'\nid: comment-1171069521\ndate: 2013-12-20T04:00:31Z\nupdated: 2016-10-27T11:55:43-04:00\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"For what it's worth I've never noticed any serious lag drawing with my\n  finger, normal styli, Bluetooth styli, or Pencil with Paper. At least not enough\n  to effect how I use the app.\\r\\n\\r\\nI know Apple made changes to their screen tech\n  and that screwed with how some styli function (like the Pogo Connect). I use a 3rd\n  gen iPad so I can't confirm if Paper and Pencil lags on the Air. I suspect\n  if it was an issue I would have seen mention of it from a few folks I follow on\n  Twitter and Tumblr.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1389279619000.yml",
    "content": "id: comment-1193680626\ndate: 2014-01-09T15:00:19Z\nupdated: 2014-01-09T15:00:19Z\n_parent: /mastering-paper/pencil-53-review/\nname: Allison Atsiknoudas\nurl: ''\nmessage: |\n  Great. I'm looking forward to your next update very much.\n\n  I had been using pencil as a dumb stylus while waiting to upgrade to the iPad air. In\n  comparison to the bamboo, I find that you need very little pressure to use pencil\n  which makes it seem more life-like. I actually prefer the tip as just a plain stylus.\n  With the same light pressure, the bamboo does not register. On the flip side, the\n  bamboo is better weighted and is slightly textured which makes it grippy. The graphite\n  pencil is beautiful but too smooth. Wouldn't it be interesting if pencil acted more\n  like a real rectangular pencil such as the Generals sketch? Designed to be cut with\n  a knife, the chisel point line quality varies as you turn it (that would be cool)....\n  Or to use pencil + blend as you would real charcoal!\navatar: https://disqus.com/api/users/avatars/allisonatsiknoudas.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1389280429000.yml",
    "content": "replying_to: '6'\nid: comment-1193696538\ndate: 2014-01-09T15:13:49Z\nupdated: 2014-01-09T15:13:49Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I really like how Pencil feels to draw with and how it glides across the\n  screen compared to other styli I've used. I get the whole pressure sensitivity thing.\n  It adds another layer of complexity when drawing that most will never use. Once\n  you're exposed to it though it's really hard going back to a \\\"dumb\\\" stylus that\n  doesn't have the feature.\\r\\n\\r\\nI'd love to see Blend continue to evolve instead\n  of using the same Gaussian blur effect on everything you smudge. If pencil marks\n  blended more like real charcoal with a sense of texture to it that would be amazing.\n  Hell I'd love for a pastel or charcoal tool to be added to compliment the pencil.\n  Sure would make shading easier.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1389384921000.yml",
    "content": "id: comment-1195470625\ndate: 2014-01-10T20:15:21Z\nupdated: 2014-01-10T20:15:21Z\n_parent: /mastering-paper/pencil-53-review/\nname: Paul\nurl: ''\nmessage: \"Hi Michael, I had a question. So I've been having that issue with pencil\n  marks being mistaken for blend. Do you continue to have that issue? And a few times,\n  it won't register lines that I'm trying to make. It's either extremely delayed and\n  then it will appear or it won't appear at all. Have you had that issue at all? Basically,\n  I just wanted to know if these are issues that I'm just having with my specific\n  pencil or if these are kind of universal bugs that all pencil users are experiencing.\n  If these are universal issues, you think they'll be taken care of with software\n  updates?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1389386537000.yml",
    "content": "replying_to: '7'\nid: comment-1195507817\ndate: 2014-01-10T20:42:17Z\nupdated: 2014-01-10T20:42:17Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Hi Paul. Yes I still experience the mistaken blends. It has gotten better\n  from software updates, but I do notice it still happening. I've seen others go as far\n  as turning off the Blend feature in Paper's settings until they need it and then\n  flipping it back on.\\r\\n\\r\\nThat's pretty much how I use it now. I do 90% of my drawing\n  with a Pogo Connect (just because I like the extra sensitivity it allows) and then\n  I'll connect a Pencil if I need to Blend something.\\r\\n\\r\\nThe only other suggestion\n  I have is to press hard when you draw. If you press too light it won't trigger as\n  an input and therefore Paper thinks it's your finger and begins blending. The delays\n  you've noticed I think are from the software trying to be smart and determine if\n  a stroke was made by Pencil or your finger after the fact, and correcting accordingly.\\r\\n\\r\\nI've\n  also noticed Pencil's tip \\\"dulling\\\" after using it for a bit. The mechanism behind\n  the tip appears to lose its springiness and that could be another reason why blend\n  is falsely triggered.\\r\\n\\r\\nHope this helps!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1389418192000.yml",
    "content": "replying_to: '7'\nid: comment-1195954874\ndate: 2014-01-11T05:29:52Z\nupdated: 2014-01-11T05:29:52Z\n_parent: /mastering-paper/pencil-53-review/\nname: Paul\nurl: ''\nmessage: \"Thanks for your thoughts/tips. Very helpful.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1389540148000.yml",
    "content": "id: comment-1197253172\ndate: 2014-01-12T15:22:28Z\nupdated: 2014-01-12T15:22:28Z\n_parent: /mastering-paper/pencil-53-review/\nname: Mark McKay\nurl: http://notyouraveragedad.com\nmessage: \"So which one do you prefer in the end --- graphite or walnut? You seem\n  to list pros and cons of both, but which one do you like best and why?\"\navatar: https://disqus.com/api/users/avatars/disqus_plX6dCpZCU.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1389540794000.yml",
    "content": "replying_to: '8'\nid: comment-1197261665\ndate: 2014-01-12T15:33:14Z\nupdated: 2014-01-12T15:33:14Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Personally I like the extra weight and brushed metal look of the graphite\n  one. And since I have no use for the magnetic clip-on feature of the walnut one\n  I choose graphite, especially since it's $10 cheaper.\\r\\n\\r\\nThey both function exactly\n  the same so it really comes down to which one you like the look of better and if\n  clipping it onto a Smart Cover matters to you or not.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1392007917000.yml",
    "content": "id: comment-1237772431\ndate: 2014-02-10T04:51:57Z\nupdated: 2014-02-10T04:51:57Z\n_parent: /mastering-paper/pencil-53-review/\nname: Dean\nurl: ''\nmessage: \"How does Pencil perform in writing task? I'm a court interpreter who\n  rely more heavily on note taking and sketching than on drawing. Thanks!\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1392037704000.yml",
    "content": "replying_to: '9'\nid: comment-1238100822\ndate: 2014-02-10T13:08:24Z\nupdated: 2016-10-27T11:59:20-04:00\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"It's about the same as other styli... maybe slightly better. I find\n  writing with Paper hard. The only way I can write something is by zooming in, which\n  isn't the best if you're taking a lot of notes.\\r\\n\\r\\nI would think one of the Adonit\n  pens with the plastic disc tips would be better for writing since they're more precise.\n  It's hard writing with a rubber nib because you can't really see the point to place\n  your marks accurately.\\r\\n\\r\\nIt's similar to writing with a large crayon or marker.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1392090379000.yml",
    "content": "id: comment-1239214588\ndate: 2014-02-11T03:46:19Z\nupdated: 2014-02-11T03:46:19Z\n_parent: /mastering-paper/pencil-53-review/\nname: Arnie\nurl: ''\nmessage: \"With the graphite Pencil, were you ever worried that it would scratch\n  your screen?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1392090856000.yml",
    "content": "replying_to: '10'\nid: comment-1239221421\ndate: 2014-02-11T03:54:16Z\nupdated: 2014-02-11T03:54:16Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"The tip is rubber, so nope never worried about it or any other stylus\n  that has a rubber nib scratching it.\\r\\n\\r\\nThe glass screen's are pretty durable.\n  I've never used a screen protector on any of my iPhone's or iPad and they've been\n  scratch free for years.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393404529000.yml",
    "content": "id: comment-1261072011\ndate: 2014-02-26T08:48:49Z\nupdated: 2014-02-26T08:48:49Z\n_parent: /mastering-paper/pencil-53-review/\nname: Lee\nurl: ''\nmessage: \"Hello Michael. Thank you so much for the review. Are you using pencil\n  with screen protector? Will it work well with screen protector on?\\r\\n\\r\\nDo I need\n  to purchase tip often? I want my iPad to be protected with a durable stylus..\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393421987000.yml",
    "content": "replying_to: '11'\nid: comment-1261296640\ndate: 2014-02-26T13:39:47Z\nupdated: 2014-02-26T13:39:47Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I use a smart cover for my iPad when carrying it around to protect it\n  from drops, but no screen protector. The iPad's screen is quite durable and I haven't\n  noticed any scratches in the 2 years I've owned it.\\r\\n\\r\\nSince I don't use a screen\n  protector I can't say if Pencil works well with it. From what I've gathered the\n  preferred way to use a stylus is without the protector since it can interfere with\n  the tip.\\r\\n\\r\\nAs far as purchasing new tips often. It really depends on how hard\n  you press. I've worn out both of the tips that Pencil shipped with. They're not\n  the most durable I've used, but they're not awful either. If you draw a lot and\n  press hard you will go through them pretty fast.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393504408000.yml",
    "content": "replying_to: '11'\nid: comment-1262809793\ndate: 2014-02-27T12:33:28Z\nupdated: 2014-02-27T12:33:28Z\n_parent: /mastering-paper/pencil-53-review/\nname: Lee\nurl: ''\nmessage: \"By any chance do you how much does it cost to purchase extra tip and\n  eraser? Thank you for the reply!\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393506266000.yml",
    "content": "replying_to: '11'\nid: comment-1262839430\ndate: 2014-02-27T13:04:26Z\nupdated: 2016-10-27T12:02:32-04:00\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Looks like they're just [under $8 on Amazon](https://www.amazon.com/Pencil-FiftyThree-replacement-eraser-53T003/dp/B00MM4KD4U/ref=as_li_ss_tl?ie=UTF8&qid=1477584089&sr=8-6&keywords=pencil+by+fiftythree&linkCode=ll1&tag=2rosebuds-20&linkId=a95938172648db35145276dda2537d37).\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393898470000.yml",
    "content": "id: comment-1269350570\ndate: 2014-03-04T02:01:10Z\nupdated: 2014-03-04T02:01:10Z\n_parent: /mastering-paper/pencil-53-review/\nname: Ben\nurl: ''\nmessage: \"Michael, Great review. I first saw Pencil for Paper at a colleague's\n  desk and immediately knew I had to have one. One problem: I still have an iPad 2.\n  What stylus would you recommend for someone whose main interest using Paper would\n  be architectural sketching, rendering, etc.?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393902897000.yml",
    "content": "replying_to: '12'\nid: comment-1269419449\ndate: 2014-03-04T03:14:57Z\nupdated: 2016-10-27T12:07:33-04:00\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I don't do any sort of architectural sketching so I'm probably not qualified\n  to make a decent recommendation. I would assume precision will probably be important\n  and Adonit makes a bunch of styli I've heard are perfect for that.\\r\\n\\r\\nBut\n  they're not for everyone. Some like the plastic disc tips, others hate them and\n  complain they can scratch the screen. I've never used one so I can't say either\n  way.\\r\\n\\r\\nJust curious. Do you plan on using a straight edge for your renders or\n  will you be doing it all freehand? I've found trying to draw straight lines using\n  a ruler placed on the iPad's screen can be a huge challenge. Mostly because styli\n  tip's have to be huge to trigger a touch on the iPad and that makes placing your\n  lines accurately almost impossible.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393910402000.yml",
    "content": "replying_to: '12'\nid: comment-1269521709\ndate: 2014-03-04T05:20:02Z\nupdated: 2014-03-04T05:20:02Z\n_parent: /mastering-paper/pencil-53-review/\nname: Ben\nurl: ''\nmessage: \"I will take a look at the Adonit line. And the sketches I'm i there stead\n  in would not be hard-lined, but primarily freehand. (I attached a sample sketch\n  from the Paper app as an example.) I want to get the most out of the available tools\n  that Paper has to offer (i.e. Sketch and Color tools) but not sure if one stylus\n  would lend itself to those tools better than another. I'd also like to be able to\n  write and take notes, probably with Evernote Penultimate. Again, like I mentioned\n  in my initial post, I loved the Pencil until I found out it wouldn't work with my\n  iPad 2. Thanks for the help!\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393935628000.yml",
    "content": "replying_to: '12'\nid: comment-1269769818\ndate: 2014-03-04T12:20:28Z\nupdated: 2016-10-27T12:09:20-04:00\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"The [Wacom Bamboos](https://www.amazon.com/Bamboo-Stylus-Pen-iPad-iPhone/dp/B004VM0SE6/ref=as_li_ss_tl?ie=UTF8&qid=1480555779&sr=8-2&keywords=wacom+bamboo+stylus&linkCode=ll1&tag=mademist-20&linkId=9b036e8c4ed05e59520e4fa1e9f4a89c) are a pretty good all around affordable styli. I'd\n  suggest getting a stylus that is fairly cheap to see how you like drawing with one.\\r\\n\\r\\nSince\n  you're using an iPad 2 all *dumb* styli pretty\n  much work the same. It really comes down to your preferences on fit, finish, durability, and how\n  it feels in hand.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1393937463000.yml",
    "content": "replying_to: '12'\nid: comment-1269797986\ndate: 2014-03-04T12:51:03Z\nupdated: 2014-03-04T12:51:03Z\n_parent: /mastering-paper/pencil-53-review/\nname: Ben\nurl: ''\nmessage: \"Thanks, Michael. I appreciate your input.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1395503214000.yml",
    "content": "id: comment-1296472529\ndate: 2014-03-22T15:46:54Z\nupdated: 2014-03-22T15:46:54Z\n_parent: /mastering-paper/pencil-53-review/\nname: Mark Koch\nurl: ''\nmessage: \"Very nice video and review. I am new to drawing on my iPad and know very\n  little.  What is the ring you use in the video? It looks like it magnifies the area\n  you are working on? What is it called and where do you get one?  You mention it\n  doesn't work well with rulers yet you use one in the video.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1395507949000.yml",
    "content": "replying_to: '13'\nid: comment-1296556028\ndate: 2014-03-22T17:05:49Z\nupdated: 2014-03-22T17:05:49Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"The ring is part of the Paper app, I think it's officially called \\\"the\n  loupe\\\". You just [pinch to zoom](https://mademistakes.com/mastering-paper/moving-the-loupe/) and it appears.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396120588000.yml",
    "content": "replying_to: '13'\nid: comment-1309909428\ndate: 2014-03-29T19:16:28Z\nupdated: 2014-03-29T19:16:28Z\n_parent: /mastering-paper/pencil-53-review/\nname: Mark Koch\nurl: ''\nmessage: \"What styli (sp?) work with paper? only Pencil or a Bluetooth stylus?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396121500000.yml",
    "content": "replying_to: '13'\nid: comment-1309949541\ndate: 2014-03-29T19:31:40Z\nupdated: 2014-03-29T19:31:40Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"All styli \\\"work\\\" with Paper as \\\"dumb\\\" styli. Meaning they'll make a mark\n  but you won't get all the extra features like pressure sensitivity with Paper.\\r\\n\\r\\nThe\n  only Bluetooth styli that Paper officially supports is Pencil and the Pogo Connect.\n  A note about the Pogo Connect, it's not fully supported on newer iPad's like the\n  Air or Mini and they're prone to breaking, so buyer beware and all that.\\r\\n\\r\\nAny\n  of the others like the Wacom Inuos and Adonit Jot Touch that have pressure sensitive\n  tips don't work with Paper. If that matters to you then an app like Procreate is\n  a good alternative. It supports a bunch of styli.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396125122000.yml",
    "content": "replying_to: '13'\nid: comment-1310018753\ndate: 2014-03-29T20:32:02Z\nupdated: 2014-03-29T20:32:02Z\n_parent: /mastering-paper/pencil-53-review/\nname: Mark Koch\nurl: ''\nmessage: \"See I have a Wacom Bamboo and that stylus doesn't work, that's why I\n  was wondering.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396128011000.yml",
    "content": "replying_to: '13'\nid: comment-1310064881\ndate: 2014-03-29T21:20:11Z\nupdated: 2014-03-29T21:20:11Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"By not working what do you mean exactly? I was under the impression a\n  Wacom Bamboo stylus is a rubber nibbed one without Bluetooth. I know quite a few\n  artists who use it just fine with Paper and other apps.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396561268000.yml",
    "content": "id: comment-1317416873\ndate: 2014-04-03T21:41:08Z\nupdated: 2014-04-03T21:41:08Z\n_parent: /mastering-paper/pencil-53-review/\nname: wylekat\nurl: ''\nmessage: \"I have to use a screen protector, since I have a toddler that has to\n  grab and touch everything. It's pretty smooth- a flat piece of plastic as opposed\n  to a film (which I have had no luck with at all). Will this disrupt my use of Pencil?\n  The screen as it is now is completely usable with fingers and styli, like there\n  is no protection on it.\\r\\n\\r\\nI am seriously contemplating buying a pencil... But\n  I don't want worn tips mucking up stuff.\"\navatar: https://disqus.com/api/users/avatars/wylekat.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396561743000.yml",
    "content": "replying_to: '14'\nid: comment-1317426227\ndate: 2014-04-03T21:49:03Z\nupdated: 2014-04-03T21:49:03Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"As noted above I don't use a screen protector so I can't comment on how\n  well Pencil works with one. I know I read somewhere that they do impact Pencil's\n  performance but don't recall where.\\r\\n\\r\\nI have 2 toddlers myself. So far I've\n  been able to keep them from destroying my unprotected iPad's screen.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396565918000.yml",
    "content": "replying_to: '14'\nid: comment-1317504178\ndate: 2014-04-03T22:58:38Z\nupdated: 2014-04-03T22:58:38Z\n_parent: /mastering-paper/pencil-53-review/\nname: wylekat\nurl: ''\nmessage: \"As a suggestion- have you thought of using capacitive cloth/ mesh on\n  the tip? I have a stylus with the mesh, and it is amazingly accurate, and glides\n  across the screen like a real pen/ pencil. It also wears better than rubber, in\n  my opinion.\"\navatar: https://disqus.com/api/users/avatars/wylekat.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396566326000.yml",
    "content": "replying_to: '14'\nid: comment-1317511298\ndate: 2014-04-03T23:05:26Z\nupdated: 2014-04-03T23:05:26Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks for the tip I'll have to keep it in mind.\\r\\n\\r\\nI rarely use my\n  Pencil these days since I prefer the stroke enhancements a pressure sensitive stylus\n  like a Pogo Connect offers. I wonder if it would work with the Pogo's special tips\n  or interfere with them.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396990903000.yml",
    "content": "replying_to: '14'\nid: comment-1324758263\ndate: 2014-04-08T21:01:43Z\nupdated: 2014-04-08T21:01:43Z\n_parent: /mastering-paper/pencil-53-review/\nname: CarminaSimdesigner\nurl: ''\nmessage: \"Hey Michael, I've used the mesh tips and I also loved them until they\n  began picking up more environmental dust or oil from minor traces on the glass of\n  the iPad. I'm not one for messy screens at all, I'm borderline obsessive (understatement\n  probably).\\r\\n\\r\\nAnyway, I loved it for about 3-4 months and then it just stopped working\n  well. I even took suggestions for cleaning the tip. It was only a temporary fix.\n  As a smooth glide the [Lynktec TruGlide Pro](http://www.lynktec.com/TruGlide-Pro-Microfiber-Stylus-p/lttg-0005.htm) was a favorite. But as I said,\n  sadly the amazing contact faded with time. I didn't feel like investing in another\n  once I picked up the Pencil by 53. The smooth surface of the Pencil was enough glide\n  for me, but I have a much lighter hand.\\r\\n\\r\\nOH and regarding the Pencil and its blending\n  features, I really thought it was great until the bugs that came with it attacked\n  me. After an hour of work got completely wiped with a crash, I put the iPad down\n  for a couple of months. It really enraged me because I had some minor crashes prior\n  with the Bluetooth active. But that was a killer, lost too much. I've since started\n  sketching again and hope to blog some new Paper work soon but I'll be posting mostly\n  non-blend work. I'd rather avoid the potential for disaster. I really hate manually\n  duplicating or backing up often. I look forward to newer and better things! Thanks\n  for the great blog as always.. Mina\"\navatar: https://disqus.com/api/users/avatars/carminasimdesigner.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396996022000.yml",
    "content": "id: comment-1324880717\ndate: 2014-04-08T22:27:02Z\nupdated: 2014-04-08T22:27:02Z\n_parent: /mastering-paper/pencil-53-review/\nname: Rob Lewis\nurl: ''\nmessage: \"I can't figure out how to smudge with my finger. How is this accomplished?\n  Thanks. Great site you have here.\"\navatar: https://disqus.com/api/users/avatars/disqus_Y9fjoCjskM.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396998621000.yml",
    "content": "replying_to: '15'\nid: comment-1324967413\ndate: 2014-04-08T23:10:21Z\nupdated: 2014-04-08T23:10:21Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"To smudge you need to connect a Pencil with Paper. After that any stroke\n  you make with your [finger will smudge](https://mademistakes.com/mastering-paper/pencil/#blend-the-smudge-tool) unless you change the behavior in settings.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1396999153000.yml",
    "content": "replying_to: '14'\nid: comment-1324984938\ndate: 2014-04-08T23:19:13Z\nupdated: 2014-04-08T23:19:13Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks for sharing your experience with a mesh tipped stylus, it's been\n  helpful.\\r\\n\\r\\nI haven't experienced any major crashes with Paper (or Pencil) yet\n  that has caused me to lose work. Although I know others have so you're not alone.\n  The worst that's happen to me have been miss triggers with Pencil erasing a line\n  after I drew it. Those kinks have gotten much better with software updates.\\r\\n\\r\\nOne\n  safeguard you could try if duplicating pages becomes a burden is to flip between\n  journals and open other pages. I've noticed that doing so forces all the strokes\n  you've made to be committed to the page and helps avoid them potentially getting\n  lost.\\r\\n\\r\\nOnly drawback to this technique is you can't rewind on the page if you\n  go back to it after opening another. I think Paper only keeps one page in memory\n  at a time and flipping to a new one clears the undo (rewind) history. Same thing\n  happens if you force quit the app.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1398686996000.yml",
    "content": "id: comment-1358852256\ndate: 2014-04-28T12:09:56Z\nupdated: 2014-04-28T12:09:56Z\n_parent: /mastering-paper/pencil-53-review/\nname: meglet\nurl: ''\nmessage: \"Thank you for this review.  I like to do a lot of hand lettering..the\n  fountain pen and fine liner are too thin and the marker is too thick. What stylus\n  would you recommend for best control in hand lettering?\"\navatar: https://disqus.com/api/users/avatars/meglet.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1398687575000.yml",
    "content": "replying_to: '16'\nid: comment-1358860280\ndate: 2014-04-28T12:19:35Z\nupdated: 2014-04-28T12:19:35Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"For more precision one of the Adonit styli with the plastic tips is probably\n  better for writing. But you're going to have the same issue with line thickness\n  with the pens and marker since it won't effect them.\\r\\n\\r\\nA Pogo Connect will let\n  you control the thickness by the amount of pressure you apply. Lettering isn't really\n  my thing so your mileage may vary, but I find it incredibly hard to use a Pogo when\n  writing. Not sure what their return policy is but it's something I would try first\n  before buying to see if it suits your needs. It's an expensive stylus to sink money\n  into, doesn't work with the newer iPads, and has had some serious hardware issues\n  (see [my post about it](https://mademistakes.com/mastering-paper/pogo-connect-smart-pen/)).\\r\\n\\r\\nThat said I love it\n  for drawing.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1407690127000.yml",
    "content": "id: comment-1536256261\ndate: 2014-08-10T17:02:07Z\nupdated: 2014-08-10T17:02:07Z\n_parent: /mastering-paper/pencil-53-review/\nname: ourmanindubai\nurl: ''\nmessage: \"Hi Michael, do you or anyone else here notice using Pencil with the \\\"ink\n  pen\\\" that the \\\"hold the pencil for a dot\\\" function, which gets bigger the longer\n  you hold, will not work when you rest your hand on the screen? Thanks James\"\navatar: https://disqus.com/api/users/avatars/ourmanindubai.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1407694071000.yml",
    "content": "replying_to: '17'\nid: comment-1536329446\ndate: 2014-08-10T18:07:51Z\nupdated: 2014-08-10T18:07:51Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I don't rest my palm on the screen while drawing so I never noticed it.\n  Just tested it with my Pencil and yes dots don't get larger. Sounds to me like a\n  bug. I'd notify FiftyThree directly to see if they are aware of it. Could be a limitation\n  of the palm rejection feature too.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1407694916000.yml",
    "content": "replying_to: '17'\nid: comment-1536344791\ndate: 2014-08-10T18:21:56Z\nupdated: 2014-08-10T18:21:56Z\n_parent: /mastering-paper/pencil-53-review/\nname: ourmanindubai\nurl: ''\nmessage: \"Hi Michael, thanks for the reply, very useful to know if its a general\n  issue and not just mine! I will report it to FiftyThree. Keep up the great work\n  by the way! Cheers James\"\navatar: https://disqus.com/api/users/avatars/ourmanindubai.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1410046553000.yml",
    "content": "id: comment-1577312918\ndate: 2014-09-06T23:35:53Z\nupdated: 2014-09-06T23:35:53Z\n_parent: /mastering-paper/pencil-53-review/\nname: \"'Tasso Art'\"\nurl: ''\nmessage: \"I'm assuming the Walnut works with the new iPad Air Smartcover, is that\n  correct?\"\navatar: https://disqus.com/api/users/avatars/tassoart.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1410046857000.yml",
    "content": "replying_to: '18'\nid: comment-1577316770\ndate: 2014-09-06T23:40:57Z\nupdated: 2014-09-06T23:40:57Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I can't say for sure since I don't have an iPad Air or the official Apple\n  Smartcover.\\r\\n\\r\\nThe Walnut Pencil sticks fine to my knockoff cover. It has\n  a magnet in it so I don't see why it wouldn't work with the ones sold by Apple.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1412487441000.yml",
    "content": "id: comment-1620252762\ndate: 2014-10-05T05:37:21Z\nupdated: 2014-10-05T05:37:21Z\n_parent: /mastering-paper/pencil-53-review/\nname: Augustine\nurl: ''\nmessage: \"Hi Michael, is the Pencil that you are using still works perfectly? I\n  am considering to get one but just want to make sure the Pencil doesn't break that\n  often like the Pogo Connect that you mentioned in another post saying it broke after\n  2 months and another in 3 months.\\r\\n\\r\\nAnother thing, have you tried the pressure\n  sensitive with Pencil which release with the iOS 8 upgrade? (Not really sure if\n  it's available already. Sorry).\\r\\n\\r\\nThanks!\"\navatar: https://disqus.com/api/users/avatars/disqus_7sz3JFYlvV.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1412519582000.yml",
    "content": "replying_to: '19'\nid: comment-1620563653\ndate: 2014-10-05T14:33:02Z\nupdated: 2016-10-27T12:23:55-04:00\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yes still working perfectly, the build quality is excellent. I've pretty\n  much stopped using the Pogo Connect because it's so unreliable and went back to\n  Pencil with the 2.0.0 update. With iOS 8 came Surface Pressure in Paper and it brings\n  line weight enhancements that put it on par with a Pogo Connect.\\r\\n\\r\\nIf I have\n  one negative thing to say about Pencil it is the tips — they wear out much too fast.\n  I've been doing some testing to determine how long a tip lasts under typical use\n  and plan to post a follow up article soon.\\r\\n\\r\\nI also have an article in the works\n  [describing Surface Pressure](https://mademistakes.com/mastering-paper/pencil/#surface-pressure-whats-that)\n  in detail, but am waiting for an update to\n  Paper that fully enables it for all the tools.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1412568846000.yml",
    "content": "replying_to: '19'\nid: comment-1621332194\ndate: 2014-10-06T04:14:06Z\nupdated: 2014-10-06T04:14:06Z\n_parent: /mastering-paper/pencil-53-review/\nname: Augustine\nurl: ''\nmessage: \"That's really great to hear that the build quality is excellent! Thank\n  you Michael and I'll be waiting for more of your posts about Pencil.\"\navatar: https://disqus.com/api/users/avatars/disqus_7sz3JFYlvV.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1413223557000.yml",
    "content": "id: comment-1633666360\ndate: 2014-10-13T18:05:57Z\nupdated: 2014-10-13T18:05:57Z\n_parent: /mastering-paper/pencil-53-review/\nname: stelil\nurl: http://beebl.co.uk\nmessage: \"Thanks for the review. With your help I finally decided to make the leap\n  of faith a buy the pencil. So happy that using the side of the main tip now gives\n  a wider paint effect on some of the tools (brush, highlighter, brush) and the eraser\n  \\\"sort of knows\\\" if you want to erase thick or thin. e.g. if you use a corner it's\n  thin, if you hold it vertical it's wide. When used in vertical mode it doesn't know\n  if you are moving the pencil with the fat or thin orientation but for me that's\n  OK. So far I'm really pleased.\"\navatar: https://disqus.com/api/users/avatars/disqus_c3KfxeO9Lc.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1413223824000.yml",
    "content": "replying_to: '20'\nid: comment-1633673187\ndate: 2014-10-13T18:10:24Z\nupdated: 2014-10-13T18:10:24Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Glad you're enjoying Pencil.\\r\\n\\r\\nFrom what I've heard there will be\n  an update to Paper soon to enable \\\"Surface Pressure\\\" on the pencil tool. Hopefully\n  it's not too much longer until that update because I've been waiting to try out\n  the \\\"shading\\\" effect 53 teased in [this video](http://vimeo.com/98146708) months ago.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1413224830000.yml",
    "content": "replying_to: '20'\nid: comment-1633701728\ndate: 2014-10-13T18:27:10Z\nupdated: 2014-10-13T18:27:10Z\n_parent: /mastering-paper/pencil-53-review/\nname: stelil\nurl: http://beebl.co.uk\nmessage: \"Apart from the pencil shading at 47 seconds into the video everything\n  else works on my pencil already. I'm wondering if \\\"surface pressure\\\" is live already,\n  in that it knows when I'm using the wide edge, and perhaps the pencil shading is\n  just a feature that didn't quite make surface pressure v1? I can for example do\n  the squiggle at 38 seconds in, that starts small and ends huge. Am I right in thinking\n  that wasn't possible until recently?\"\navatar: https://disqus.com/api/users/avatars/disqus_c3KfxeO9Lc.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1413225527000.yml",
    "content": "replying_to: '20'\nid: comment-1633720339\ndate: 2014-10-13T18:38:47Z\nupdated: 2014-10-13T18:38:47Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"No you're right. Up until iOS 8 and Paper 2.0, using the fat edge of\n  Pencil didn't produce any different effects with the marks you made. Surface Pressure\n  is indeed enabled now in Paper, just not for the pencil tool.\\r\\n\\r\\nThat's coming\n  eventually. I'm not entirely sure why it wasn't turned on with the other tools.\n  I can only guess that the shading behavior teased in the video wasn't up to FiftyThree's\n  standards and they delayed releasing it to fine tune.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1413227104000.yml",
    "content": "replying_to: '20'\nid: comment-1633763149\ndate: 2014-10-13T19:05:04Z\nupdated: 2014-10-13T19:05:04Z\n_parent: /mastering-paper/pencil-53-review/\nname: stelil\nurl: http://beebl.co.uk\nmessage: \"Sorry just re-read your original post and I had miss understood  I read\n  \\\"Surface Pressure on the pencil tool\\\" to mean \\\"on the pencil stylus\\\" ! Thanks for\n  clarification. Now I just need to learn to draw ;)\"\navatar: https://disqus.com/api/users/avatars/disqus_c3KfxeO9Lc.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1413694720000.yml",
    "content": "id: comment-1643031479\ndate: 2014-10-19T04:58:40Z\nupdated: 2014-10-19T04:58:40Z\n_parent: /mastering-paper/pencil-53-review/\nname: Xiao\nurl: ''\nmessage: \"Hi Michael, thank you for all your guides and reviews. They're excellent.\n  I've been waiting for the pressure sensitivity function to come to Pencil before\n  buying one. I would very much appreciate your thoughts on Surface Pressure compared\n  to transitional pressure sensitive styluses.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1413733738000.yml",
    "content": "replying_to: '21'\nid: comment-1643480019\ndate: 2014-10-19T15:48:58Z\nupdated: 2014-10-19T15:48:58Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I'm planning on doing an [in-depth review of Surface Pressure](https://mademistakes.com/mastering-paper/pencil/#surface-pressure-whats-that)\n as it compares\n  to the Pogo Connect (a true pressure sensitive enabled stylus), but have been waiting\n  for an update to Paper that enables it for all of the tools.\\r\\n\\r\\nBut in the meantime\n  here are some of my quick thoughts:\\r\\n\\r\\n* Surface Pressure for the most part works\n  in a more natural and true to life way than other styli in it's category. When you\n  want to paint a wider stroke you use the fat side of Pencil just like you would\n  with a paint brush.\\r\\n* In some circumstances drawing with a Pogo Connect feels\n  more natural. For example the pencil tool. If you were using a real pencil you'd\n  press harder to make a darker line. The same behavior occurs with a Pogo Connect,\n  unlike 53's Pencil.\\r\\n* Learning to use Surface Pressure in a controlled and\n  fluid way can take some practice. Sure it's easy to use the broadside of Pencil\n  to fill in an area quickly. But if you want to create a line that varies from thin\n  to thick, in an exact and smooth way you have to perform some crazy maneuvers with\n  your hand by rotating Pencil's tip from side to point. Some will argue that pressing\n  on the tip of a Pogo to do the same thing can be difficult, but I always found it\n  pretty easy to pull off compared to Pencil.\\r\\n* Overall I think using Pencil\n  and Surface Pressure together is a more enjoyable experience than using a Pogo Connect.\n  I've gotten sick of the constant disconnects and manual restarts to get the stupid\n  thing working with Paper. Neither styli is perfect in all circumstances.\n  At this point I wouldn't bother wasting money on a Pogo because it has some serious\n  problems with newer iPad's since Apple changed the display technology behind the\n  screen.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1421335108000.yml",
    "content": "id: comment-1793997700\ndate: 2015-01-15T15:18:28Z\nupdated: 2015-01-15T15:18:28Z\n_parent: /mastering-paper/pencil-53-review/\nname: John S.\nurl: ''\nmessage: \"I recently got a Pencil 53 for Christmas. I'm not sure if I should keep\n  it; although I like the design, its feel in the hand and the blend feature, I've\n  got the impression that it isn't a round product. The eraser should perform its\n  action depending on how it is put on the screen (horizontal or vertical); the tip\n  is too rubberish and I fear it will wear out in no time; and although surface pressure\n  works well, sometimes it seems to have trouble to detect if the side is on the screen,\n  and how much. Not talking about these times it doesn't detect the pencil correctly,\n  but those are the less.\\r\\n\\r\\nAh, and when using watercolor, it doesn't paint like\n  a dumb stylus, being more accurate and dense. But this is not a drawback.\\r\\n\\r\\nAlso,\n  I don't understand why procreate doesn't make use of surface pressure, but that's\n  other story.\\r\\n\\r\\nMichael, is Pencil your main stylus or you prefer using a dumb\n  one or your hand?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1421351459000.yml",
    "content": "replying_to: '22'\nid: comment-1794525713\ndate: 2015-01-15T19:50:59Z\nupdated: 2015-01-15T19:50:59Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I didn't like the feel of Pencil at first and was more used to completely\n  round styli. Eventually I got over it and now I can't tell the difference. It's\n  just a tool I pick up and use like any other.\\r\\n\\r\\nI hardly ever use the eraser\n  and have yet to wear one out yet. The tips on the other hand... I go through fast\n  and often. Through my informal tests I average about 3 hours of drawing before a\n  tip rips and starts to streak on the screen. When applying a lot of pressure I've\n  gotten tips to rip in under an hour, and when barely touching the screen up to 9\n  hours. Even with the rubber ripping Pencil is usable for much longer, it just starts\n  leaving black residue on the screen (easy to wipe off). And you can always use the\n  other side of the tip until it rips there too.\\r\\n\\r\\nI think it really depends on\n  your style of drawing and if you use the edge of Pencil more than the tip. If more\n  people were pissed over tips wearing out too quickly there would be more noise about\n  it in the community. There those who have told me they've had Pencil for up to a\n  year and never replaced a tip. So there's that...\\r\\n\\r\\nAnd yes, Pencil is my main\n  stylus. I went full time with it after I got a new iPad Air 2 and Paper added Surface\n  Pressure. Previously I only used a Pencil to turn on the Blend feature and did the\n  bulk of my drawing with a Pogo Connect. But after getting fed up with all the Pogo's\n  hardware and software problems I ditched it.\\r\\n\\r\\nThe only time I don't use Pencil\n  is when doing rough sketches or if I'm going to do a lot of pencil/line-work. To\n  save my Pencil tips I use a cheap dumb stylus for my drawings until I'm ready for\n  the control Surface Pressure enables.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1422163526000.yml",
    "content": "id: comment-1815675823\ndate: 2015-01-25T05:25:26Z\nupdated: 2015-01-25T05:25:26Z\n_parent: /mastering-paper/pencil-53-review/\nname: Ken\nurl: ''\nmessage: \"For a teacher and classroom setting, would Pencil be a good tool for\n  writing math formulas and other hand written text?  How about using Pencil with\n  a Keynote presentation?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1422197574000.yml",
    "content": "replying_to: '23'\nid: comment-1816103987\ndate: 2015-01-25T14:52:54Z\nupdated: 2016-10-27T12:27:00-04:00\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I think that depends on the formulas and your expectations. If they're\n  small and you can write really big it shouldn't be a problem, but if they're long\n  and more involved formulas it might be a challenge.\\r\\n\\r\\nPersonally I have a hard\n  time writing anything legible with Pencil (or any other iPad stylus) unless I zoom\n  in really close, which can really slow you down.\\r\\n\\r\\nAs for presentations.\n  You can certainly export your Paper drawings and bring them into Keynote after the\n  fact. Paper also has a \\\"presentation mode\\\" where you can share the iPad's screen\n  to an AppleTV giving an unobstructed view\n  of whatever you're drawing/writing without the tool tray.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1424229701000.yml",
    "content": "id: comment-1861131058\ndate: 2015-02-18T03:21:41Z\nupdated: 2015-02-18T03:21:41Z\n_parent: /mastering-paper/pencil-53-review/\nname: David Roussel-Picard\nurl: ''\nmessage: \"This pen is it working with Evernote? I like to buy something I can use\n  on multiple software, apps, platforms. The same I like to use Evernote because\n  he can handle many thing and leave at one gathering point all my kind of note, so\n  I can focus rapidly on my main stream!\"\navatar: https://disqus.com/api/users/avatars/davidrousselpicard.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1424230597000.yml",
    "content": "replying_to: '24'\nid: comment-1861147227\ndate: 2015-02-18T03:36:37Z\nupdated: 2015-02-18T03:36:37Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Do you mean with the Penultimate app for Evernote? I've never tried it.\n  I haven't had much luck writing with Pencil in the Paper app. Like other fat tipped\n  styli for the iPad it's far from being a precise utensil. The Adonit styli that\n  are made with finer tips and built for detail work/writing would probably be a better\n  investment for you if note taking is your primary goal.\\r\\n\\r\\nPersonally I find\n  all iPad styli incredibly hard to write with. They're great for \\\"sketch notes\\\" and\n  doodles but they take a lot of practice to get over the lag and precision issues.\n  If you're expecting an experience similar to pen and paper you'll most likely be\n  disappointed. The technology just isn't there for iPad yet.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1424724380000.yml",
    "content": "id: comment-1871392455\ndate: 2015-02-23T20:46:20Z\nupdated: 2015-02-23T20:46:20Z\n_parent: /mastering-paper/pencil-53-review/\nname: Sarahjd\nurl: ''\nmessage: \"How's it compare to the old Wacom stylus+tablet? I lost my stylus for\n  my older Wacom tablet. It may have been the small version and plugs via sub but\n  the pen was battery free and I really enjoyed it. It worked best when wanting to\n  do virtual paintings etc and some doodling.\\r\\n\\r\\nI still lean towards getting out\n  actual paper. But felt like I didn't want to buy a whole new Wacom tablet, I can't\n  find a workable replacement pen. So I ordered the pencil, albeit through a,Aron\n  with one day shipping and it still isn't here (day 3).\\r\\n\\r\\nThanks for such a thorough\n  review by the way.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1424724894000.yml",
    "content": "replying_to: '25'\nid: comment-1871407083\ndate: 2015-02-23T20:54:54Z\nupdated: 2015-02-23T20:54:54Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"It's no where near as precise as a Wacom pen tablet. Drawing with a fat\n  rubber nib on iPad takes practice and can be disorienting when you first attempt it.\n  Not to mention you don't get any sort of pressure sensitivity with Pencil.\\r\\n\\r\\nThat\n  said, using any stylus with an iPad does have the benefit of drawing directly on\n  the surface your work is projected on. In that way it is closer to pen and paper\n  than a Wacom tablet, even if the precision isn't there. Unless of course you have\n  an expensive Cintiq. Then you get the best of both worlds.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1427108535000.yml",
    "content": "id: comment-1923049433\ndate: 2015-03-23T11:02:15Z\nupdated: 2015-03-23T11:02:15Z\n_parent: /mastering-paper/pencil-53-review/\nname: Terry Cclkin\nurl: ''\nmessage: \"Hi Michael, I am more of a part time pencil and paper user and so my\n  first tip is still in use after six months. I find, like you that there are occasional\n  times when pencil chooses to blur rather than draw and even worse, times when it\n  erases at random. both these things might be wear and tear on the tip looking at\n  your article here, what do you think? I find it useful to work with a dirt cheap\n  basic stylus and keep pencil near the iPad to fool it into thinking I am using pencil\n  this way I can smudge but not use surface pressure, hopefully saving my tip.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1427112426000.yml",
    "content": "replying_to: '26'\nid: comment-1923112589\ndate: 2015-03-23T12:07:06Z\nupdated: 2015-03-23T12:07:06Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"That's how I work now... use a \\\"dumb\\\" stylus for when I don't need Surface\n  Pressure or Blend and switch to Pencil when I do. It helps preserve the tips.\\r\\n\\r\\nThe\n  accidental blends seem to be a side effect of not pressing hard enough. When Paper\n  doesn't get that input from Pencil it thinks it is your finger and then Blends.\n  The software has certainly gotten better over the past year. I've seen it mistakenly\n  erase or smudge something but after following through with the stroke it auto corrects\n  and removes those mistaken marks.\\r\\n\\r\\nIt's by no means perfect but if you trust\n  the software to do the right thing, it usually does.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1427152059000.yml",
    "content": "id: comment-1924271266\ndate: 2015-03-23T23:07:39Z\nupdated: 2015-03-23T23:07:39Z\n_parent: /mastering-paper/pencil-53-review/\nname: Catherine\nurl: ''\nmessage: \"I love my Pencil, but I found that when I put a screen protector on the\n  iPad, there was a decrease in responsiveness. I removed the screen protector. However,\n  I really do feel more comfortable when there is a protector in place and wondered\n  if you use one, and if so, which one, and do you notice a decrease in responsiveness?\"\navatar: https://disqus.com/api/users/avatars/disqus_uwKKcM5oF2.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1427156659000.yml",
    "content": "replying_to: '27'\nid: comment-1924389862\ndate: 2015-03-24T00:24:19Z\nupdated: 2015-03-24T00:24:19Z\n_parent: /mastering-paper/pencil-53-review/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I've used cheap Smart Cover knockoffs and that's about it. In all the\n  iPhones and iPad's I've owned I never saw a need for a screen protector... even\n  with two small little ones who like throw and smash shiny things :-)\\r\\n\\r\\nAs you\n  mentioned they mess with the responsiveness of rubber tipped styli. They don't look\n  or feel all that great either. The screens are pretty tough and can take some abuse.\n  Just don't go dropping them on asphalt and you'll be fine.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1429900591000.yml",
    "content": "id: comment-1985525230\ndate: 2015-04-24T18:36:31Z\nupdated: 2015-04-24T18:36:31Z\n_parent: /mastering-paper/pencil-53-review/\nname: Nollind Whachell\nurl: ''\nmessage: \"For those experiencing weird quirks with Pencil using the Paper app,\n  try the following. Turn off the option to access the iOS Control Center within Apps\n  (found under Settings &gt; Control Center). This resolved a lot of issues with me,\n  especially when my palm was on the screen.\\r\\n\\r\\nIn terms of a question though,\n  how long does a charge last for you if you don't use it?\\r\\n\\r\\nFor example, I use\n  my Pencil rarely but when I have, it's been usable and still charged (even after\n  a month of no use). Lately though, I can charge it and if I come back to wanting\n  to use it in a couple of weeks, I have to charge it again because it won't connect\n  properly. (And it's not a tip issue, as I tried swapping it with a new one and the\n  problem persisted.)\\r\\n\\r\\nSo now if I want to use it every couple of weeks, I have\n  to charge it first, which impedes My workflow of just grabbing it when I need it.\"\navatar: https://disqus.com/api/users/avatars/nollindwhachell.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1431446463000.yml",
    "content": "id: comment-2020551371\ndate: 2015-05-12T16:01:03Z\nupdated: 2015-05-12T16:01:03Z\n_parent: /mastering-paper/pencil-53-review/\nname: Fredrik Graver\nurl: http://fgraver.wordpress.com/about\nmessage: \"I've been going all my handwritten notes on an iPad for about 4 years\n  now. I find the combination of AluPen and Notes+ works really well for me; the lag\n  is hardly noticeable, and with a little practice I've become just as fast writing\n  in the close-up window as I was on note paper previously. The main difference is\n  friction; the combination stylus/iPad is much smoother than pen/paper, but I got\n  used to that really quickly.\"\navatar: https://disqus.com/api/users/avatars/fgraver.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1437157323000.yml",
    "content": "id: comment-2142538865\ndate: 2015-07-17T18:22:03Z\nupdated: 2015-07-17T18:22:03Z\n_parent: /mastering-paper/pencil-53-review/\nname: kyidyl\nurl: ''\nmessage: \"I've had a lot of success with Notability + newer Wacom stylus.  The\n  newer ones have cloth on the tips, which helps with that rubber-on-glass drag. Plus\n  notability has a zoom feature with palm rejection. I take all my notes for school\n  that way. The zoom feature on Notability shows you the page you're writing on as\n  well as the zoomed in section, so you can write precisely and see the results at\n  the same time.\"\navatar: https://disqus.com/api/users/avatars/kyidyl.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-53-review/comment-1475677581969.yml",
    "content": "_parent: /mastering-paper/pencil-53-review/\nmessage: >-\n  Hello, I'd like to know if Pencil is good for writing, because I found that\n  the tip is not that thin. Thank you\nname: Rafael Hess\nemail: 0799d9492e2a8533e465de799c2d2b64\nurl: ''\nhidden: ''\ndate: '2016-10-05T14:26:21.209Z'\n"
  },
  {
    "path": "src/_data/comments/pencil-first-look/comment-1384966062000.yml",
    "content": "id: comment-1131300515\ndate: 2013-11-20T16:47:42Z\nupdated: 2013-11-20T16:47:42Z\n_parent: /mastering-paper/pencil-first-look/\nname: Naufal Mir\nurl:\nmessage: \"This is just stunning!\"\navatar: https://disqus.com/api/users/avatars/abijango.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-first-look/comment-1385043547000.yml",
    "content": "id: comment-1132689654\ndate: 2013-11-21T14:19:07Z\nupdated: 2013-11-21T14:19:07Z\n_parent: /mastering-paper/pencil-first-look/\nname: glenn sharron\nurl: ''\nmessage: \"Thanks Mr. Rose.\"\navatar: https://disqus.com/api/users/avatars/glennsharron.jpg\n"
  },
  {
    "path": "src/_data/comments/pencil-first-look/comment-1385070180000.yml",
    "content": "id: comment-1133534653\ndate: 2013-11-21T21:43:00Z\nupdated: 2013-11-21T21:43:00Z\n_parent: /mastering-paper/pencil-first-look/\nname: Guest\nurl:\nmessage: \"So nice, thanks! You have a Pencil, Katie Couric has a Pencil. Where's\n  *MY* Pencil? Come on, 53! :)\"\n"
  },
  {
    "path": "src/_data/comments/pencil-first-look/comment-1385159741000.yml",
    "content": "id: comment-1135078173\ndate: 2013-11-22T22:35:41Z\nupdated: 2013-11-22T22:35:41Z\n_parent: /mastering-paper/pencil-first-look/\nname: Pavan\nurl: ''\nmessage: \"The new Pencil looks great and I really appreciate the above first look.\n  As a user who also has a Pogo Connect, do you think its worth picking up? I guess\n  the main features being swapped are pressure sensitivity/button undo for blur/actual\n  erasing. I realize you are going to write a more in-depth review later but would\n  love to see the two pens discussed.\"\n"
  },
  {
    "path": "src/_data/comments/pencil-first-look/comment-1385162772000.yml",
    "content": "replying_to: '4'\nid: comment-1135145419\ndate: 2013-11-22T23:26:12Z\nupdated: 2013-11-22T23:26:12Z\n_parent: /mastering-paper/pencil-first-look/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Pressure sensitivity is a huge one for me. I simply can't get thinner\n  watercolor strokes without it. The fact that Pencil doesn't have that could be a\n  bummer, but I think it more than makes up for it by being a stylus that is really\n  responsive, feels great, and adds features to Paper that other styli simply can't\n  do.\\r\\n\\r\\nLately I haven't been too happy with my Pogo because of the tip problems.\n  TenOne Design's customer service is really great, but I don't think that should\n  give them a pass. And Apple screwing them by breaking compatibility with the iPad\n  Air doesn't help.\\r\\n\\r\\nI think I'll be able to live without pressure sensitivity\n  once Pencil starts to mature in ways I'm sure FiftyThree is already planning for.\n  With its current feature set I think it's designed more for the masses who wrestle\n  with drawing and need features like palm rejection, or a dedicated eraser on the\n  top. It's not really for us \\\"advanced\\\" folk who want the extra complexity of pressure\n  sensitive strokes, which is why I think it wasn't a focus this time around.\\r\\n\\r\\nThat's\n  not to say pro users can't get a lot out of Pencil. Blend is extremely nuanced and\n  I think it's going to be interesting to see where that goes once more people get\n  to play with it. I'm sure in the beginning there will be a ton of abusing the feature\n  like the dreaded lens flare filter in Photoshop, but it really does have promise.\n  As does the eraser on top. I could see that gaining new abilities by way of simple\n  app updates.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pencil-first-look/comment-1385260314000.yml",
    "content": "id: comment-1136537375\ndate: 2013-11-24T02:31:54Z\nupdated: 2013-11-24T02:31:54Z\n_parent: /mastering-paper/pencil-first-look/\nname: Lauren\nurl: ''\nmessage: \"Loving the last illustration, can't wait to see how it turns out! Thanks\n  for the review on blend, I found myself wanting this feature since I started using\n  Paper, but my question is, do you need to have the pencil to be able to blend inside\n  the app? How does that work?\"\n"
  },
  {
    "path": "src/_data/comments/pencil-first-look/comment-1385260939000.yml",
    "content": "replying_to: '5'\nid: comment-1136545145\ndate: 2013-11-24T02:42:19Z\nupdated: 2013-11-24T02:42:19Z\n_parent: /mastering-paper/pencil-first-look/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Lauren.\\r\\n\\r\\nTo answer your question, yes you need to have a\n  Pencil. I'm not sure if you're seen the videos on FiftyThree's website, but how\n  it works is you touch the tip of Pencil to an icon in the tool tray of Paper. After\n  a few seconds it connects with it and then the extra stuff like palm rejection and\n  blend.\\r\\n\\r\\nFor blend to work you need Pencil connected. When it's connected to\n  Paper you can only draw with it. Using your finger or another stylus will smudge\n  and blur whatever you touch.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1387991266000.yml",
    "content": "id: comment-1176626196\ndate: 2013-12-25T17:07:46Z\nupdated: 2013-12-25T17:07:46Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Rellite\nurl: ''\nmessage: \"much appreciate the in depth analysis! finally doing research myself\n  upon receiving a 1.0.4 firmware pen. I wanted to exchange it for a 1.1 so I can\n  upgrade to the latest 1.3.2 or so, but these articles make me think twice. strange\n  that the sensitivity would be so drastically reduced, but it wonder if they've made\n  any adjustments within the firmware upgrades to accommodate this prevalent problem.\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1388028878000.yml",
    "content": "replying_to: '1'\nid: comment-1176952307\ndate: 2013-12-26T03:34:38Z\nupdated: 2013-12-26T03:34:38Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"If the sensitivity levels you set in the Pogo Connect app actually stuck\n  and didn't need to be constantly refreshed it wouldn't be a problem. It appears\n  anytime that app is in the background for a certain amount of time it goes to sleep\n  and forgets the levels.\\r\\n\\r\\nI'm guessing the default levels were reduced some\n  to work better with the alternate tips that allow less sensitivity to adjust for\n  note taking uses.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1392146177000.yml",
    "content": "id: comment-1240035446\ndate: 2014-02-11T19:16:17Z\nupdated: 2014-02-11T19:16:17Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Jim Faris\nurl: http://farisgallery.tumblr.com\nmessage: \"I finally have to join in here. First, I love this site and Micheal your\n  work, explanations and such have been incredibly useful and inspiring.\\r\\n\\r\\nI bought\n  a Pogo Connect. I love the feel of it on screen, but I do not have any touch sensitivity\n  in Paper. i am using an iPad Mini retina and I'm guessing that is part of the problem.\n  But it works in Connect app, in Procreate and in Sketch, but not in Paper. Every\n  time I go through the process above, Paper's watercolor brush gives me an 1/8 inch\n  of finer line, then back to standard.\\r\\n\\r\\nIt's been tough following all the blogs\n  and support reports to know where things stand... So, right now Feb11, 2014... is\n  anyone getting the Pogo to work on a Mini Retina with PAPER?\\r\\n\\r\\nP.S. my Pogo\n  tip makes a little click when I use it, like the tip is clicking inside?\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1392148971000.yml",
    "content": "replying_to: '2'\nid: comment-1240125834\ndate: 2014-02-11T20:02:51Z\nupdated: 2014-02-11T20:02:51Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Jim!\\r\\n\\r\\nThis is a known problem, check out [TenOne Design's blog](https://tenonedesign.com/blog/t1pogomanager-sdk-v132-for-ipad-air/)\n  for more detail.\\r\\n\\r\\nThe gist is Apple farted\n  around with the technology behind their screens for the new iPad Air and Mini with\n  retina, which caused the Pogo Connect to stop working.\\r\\n\\r\\nTenOne Design has since\n  released an update that partially supports these new screens, but it still has issues.\n  I don't have a newer iPad so I can't verify any of this. My guess as to why it works\n  in Procreate and the Pogo Connect app is because they're using TenOne Design's newer\n  SDK and Paper hasn't updated to it yet.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1392149260000.yml",
    "content": "replying_to: '2'\nid: comment-1240132899\ndate: 2014-02-11T20:07:40Z\nupdated: 2014-02-11T20:07:40Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Jim Faris\nurl: http://farisgallery.tumblr.com\nmessage: \"Thanks for the info. You know the reason I upgraded from my old iPad\n  to the Mini Retina was portability and because Pencil would not work on my old iPad.\n  now I've got Pencil... I love the feel of it but still not touch... UGH... Keep\n  up the good work brother.\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1392149533000.yml",
    "content": "replying_to: '2'\nid: comment-1240139214\ndate: 2014-02-11T20:12:13Z\nupdated: 2014-02-11T20:12:13Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I'm with ya. Gimme a pressure sensitive Pencil and I can die a happy\n  man.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1395837289000.yml",
    "content": "id: comment-1303457712\ndate: 2014-03-26T12:34:49Z\nupdated: 2014-03-26T12:34:49Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Carlos D. Santiago\nurl: ''\nmessage: \"Thanks for hosting this.\n\n have an iPad Air, and wanted to get a\n  'sensitive' stylus which my Pencil doesn't support (yet?) in Paper so I got a Pogo\n  Connect used as I had known about limitations.\\r\\n\\r\\nThe odd thing to me at least\n  is the ranging firmware versions for this model T1-PGCT-302 as reported by the Pogo\n  app. Then I learned that there's a firmware upgrade, from 1.1.0 and beyond, to help\n  address this. As while using the Pogo app the sensitivity appears to work as expected,\n  I took this as good news that it's just a matter of time until 3rd party apps also\n  pick up this support. But my stylus firmware was 1.0.1 and there's no upgrade path.\n  I'm working with them in hopes towards an upgrade - they have good promotions IFF\n  you've got purchase receipt of their item *new* which I'm hoping they'll transfer\n  to me. Time will tell.\\r\\n\\r\\nI should point out that several retailers are selling\n  this pen somewhat discounted from list which leads me to think that there's inventory\n  out there at earlier than 1.1.0 firmware, so if you're out there with a mini or\n  full size Air and in the market for this pen - which btw is pretty nice, you might\n  want to take a close look at potential unit's firmware --- might be difficult to test\n  until you receive one, to ensure you're not left behind\"\navatar: https://disqus.com/api/users/avatars/carlosdsantiago.jpg\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-sensitivity/comment-1395845527000.yml",
    "content": "replying_to: '3'\nid: comment-1303625915\ndate: 2014-03-26T14:52:07Z\nupdated: 2014-03-26T14:52:07Z\n_parent: /mastering-paper/pogo-connect-sensitivity/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I went through a couple of Pogo's with the older 1.0.1 firmware. They\n  kept replacing them for me free of charge because of a design flaw in the tip that\n  broke inside.\\r\\n\\r\\nThis last Pogo I received appears to have fixed that and it\n  has the newer 1.1.0 firmware. Weird thing is it's much less sensitive than before.\n  Still not sure if it's the firmware or the extra soldering they applied inside to\n  keep the tip from busting off.\\r\\n\\r\\nI have seen things improve in 3rd party apps\n  as they've updated to newer versions of the Pogo's SDK. But it's still a mess. I\n  have to disconnect and reconnect all the time because it flakes out. When the pen\n  works it's great, but it's so unreliable.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1376491873000.yml",
    "content": "id: comment-1000772553\ndate: 2013-08-14T14:51:13Z\nupdated: 2013-08-14T14:51:13Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: PICMAR\nurl: ''\nmessage: \"Wonderful style of setting the words. As marvelous as the corresponding\n  drawings.\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1376491912000.yml",
    "content": "id: comment-1000773478\ndate: 2013-08-14T14:51:52Z\nupdated: 2013-08-14T14:51:52Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: PICMAR\nurl: ''\nmessage: \"And really helpful. Thanks!\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1376665972000.yml",
    "content": "id: comment-1003769524\ndate: 2013-08-16T15:12:52Z\nupdated: 2013-08-16T15:12:52Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Luliio\nurl: ''\nmessage: \"Amazing review but still I'm confused about the best stylus to use with Paper\n  \\\"drawing\\\".\\r\\n\\r\\nEspecially if we are talking about the small details on the pictures.\\r\\n\\r\\nYour\n  advice is highly appreciated.\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1376666976000.yml",
    "content": "replying_to: '3'\nid: comment-1003790951\ndate: 2013-08-16T15:29:36Z\nupdated: 2013-08-16T15:29:36Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"If it's detail you're after I suggest one of the pens by Adonit that have\n  the plastic disc on the tip. They're built for precision.\\r\\n\\r\\nIf you want the\n  ability to control line weight and darkness by varying the amount of pressure applied\n  the Pogo Connect is the only way to go.\\r\\n\\r\\nI came across this new pen from Adonit\n  called the [Jot Touch 4](http://adonit.net/jot/touch/)\n  that looks like the holy grail of styli, but it's not supported by Paper (and probably\n  never will be). But if you use apps like Procreate and Sketchbook Pro on your iPad\n  it might be the way to go.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1376743549000.yml",
    "content": "replying_to: '3'\nid: comment-1004665415\ndate: 2013-08-17T12:45:49Z\nupdated: 2013-08-17T12:45:49Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Luliio\nurl: ''\nmessage: \"Thats great Mr. Rose\\r\\n\\r\\nActually i have Adonit jot mini + AluPen, but\n  still confuse whats the best between them and Pogo connect as i never use it ....<\\r\\n\\r\\nMany\n  thanks for your reply..\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1377055622000.yml",
    "content": "replying_to: '3'\nid: comment-1009302361\ndate: 2013-08-21T03:27:02Z\nupdated: 2013-08-21T03:27:02Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"[This video](https://www.youtube.com/watch?v=RqUOU894nyE) might help explain the difference between pressure sensitive\n  pen's (like the Pogo Connect Smart Pen) and normal ones (like an AluPen).\\r\\n\\r\\nThe\n  other pressure sensitive styli shown in the video are not supported by Paper, but\n  it does a good job of showing the basics of how line width and color can be manipulated\n  by applying pressure with the pen.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1379019102000.yml",
    "content": "replying_to: '3'\nid: comment-1040959449\ndate: 2013-09-12T20:51:42Z\nupdated: 2013-09-12T20:51:42Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Luliio\nurl: ''\nmessage: \"Mr.Rose, I would really like to thank you for all the support and advises\n  you've been giving to me, it was really appreciated.\\r\\n\\r\\nYou can say now i have\n  a lot of stylus now, and the surprising funny thing that after weeks finally i got\n  my Pogo connect and i am in love with it... \\U0001F601❤\\r\\n\\r\\nI didn't believe how\n  smooth and amazing drawing with Pogo ...\\r\\n\\r\\nKeep watching your great draws &amp;\n  journals.\\r\\n\\r\\nThank you again Mr.Rose .. \\r\\n\\r\\nThanks to you also \\\"TenOne Design\\\"\\r\\n\\r\\nLuliio.\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1379039532000.yml",
    "content": "replying_to: '3'\nid: comment-1041380681\ndate: 2013-09-13T02:32:12Z\nupdated: 2013-09-13T02:32:12Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Great. Glad you're enjoying the Pogo Connect. It's easily my favorite\n  stylus to use with Paper.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1380161985000.yml",
    "content": "id: comment-1059359887\ndate: 2013-09-26T02:19:45Z\nupdated: 2013-09-26T02:19:45Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Iantm\nurl: ''\nmessage: \"My third stylus just broke. They responded by sending me a fourth and\n  saying that they have addresses the issue.  I love their customer service. I hope\n  the fourth pen won't break like they say. I have looked at the jot touch 4 for its\n  different approach and finer control but I'm not a fan of the rechargeable battery.\n  I like the user replaceable option. I've eyestalks the Wacom but if the new Pogo\n  holds up I'll stick with it.\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1380162833000.yml",
    "content": "replying_to: '4'\nid: comment-1059369642\ndate: 2013-09-26T02:33:53Z\nupdated: 2013-09-26T02:33:53Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Let me know how your fourth stylus goes. My replacement seems OK so far.\n  I did have some trouble getting a battery out of it. Not sure what the deal was,\n  but it was super tight and almost impossible to get out. The metal used in the pen's\n  frame is fairly soft and I ended up bending part of it trying to force the battery\n  out. Not the end of the world, but definitely not the most well made product.\\r\\n\\r\\nIt's\n  a shame, because I really like the tip and how it handles with Paper by 53. I'd\n  love to give the Jot Touch 4 a go, but it's not supported by Paper, and I don't\n  use Procreate or any of the dozen other apps it works with all that much.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1423345272000.yml",
    "content": "id: comment-1841048686\ndate: 2015-02-07T21:41:12Z\nupdated: 2015-02-07T21:41:12Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Alex\nurl: ''\nmessage: \"\\r\\n\\r\\nHey Michael! Was reading your block and your tricks and I'm really thankful\n  for the effort you're taking by creating all the tutorials!! Hope you'll really write\n  a book about paper, I'd be the first to buy it!!\\r\\n\\r\\nI have a question about the\n  Pogo. There's a bug i couldn't get rid of. I have an iPad Air and a Pogo Connect\n  2... In the Pogo App, the pressure sensitivity works great and also in Procreate\n  but in Paper everything works the other way round... The pencil for example draws\n  dark when i use almost no pressure and when i press harder the lines get lighter...\n  You also recognized those problems or do you have any solution for this?\\r\\n\\r\\n\"\n"
  },
  {
    "path": "src/_data/comments/pogo-connect-smart-pen/comment-1423348022000.yml",
    "content": "replying_to: '5'\nid: comment-1841125927\ndate: 2015-02-07T22:27:02Z\nupdated: 2015-02-07T22:27:02Z\n_parent: /mastering-paper/pogo-connect-smart-pen/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Alex.\\r\\n\\r\\nNot sure on the Pogo Connect 2. I only own the original\n  and gave up drawing with it when I upgraded to an Air 2. It's possible there's been\n  an update to the Pogo's SDK that Paper needs and that could explain why other apps\n  support it fine.\\r\\n\\r\\nProbably a question to ask TenOne and FiftyThree directly\n  since I have little insight on it.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1372721299000.yml",
    "content": "id: comment-948495061\ndate: 2013-07-01T23:28:19Z\nupdated: 2013-07-01T23:28:19Z\n_parent: /mastering-paper/short-guide/\nname: abernathy24\nurl: ''\nmessage: \"I love your blog :-)\"\navatar: https://disqus.com/api/users/avatars/abernathy24.jpg\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1375453850000.yml",
    "content": "id: comment-985836335\ndate: 2013-08-02T14:30:50Z\nupdated: 2013-08-02T14:30:50Z\n_parent: /mastering-paper/short-guide/\nname: Virginia Killmore\nurl: ''\nmessage: \"Is the difference between the polymer and alloy pens just the materials\n  used to make them. (case) When I went to the website and thought i understood that\n  to be the saw the only difference and since I am prone to loose things I thought\n  the polymer was a better choice?\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1375454172000.yml",
    "content": "replying_to: '2'\nid: comment-985848176\ndate: 2013-08-02T14:36:12Z\nupdated: 2013-08-02T14:36:12Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yeah I'm pretty sure that's the only difference. As far as I know the\n  tips are the same, which is all that really matters. The alloy pens are probably\n  heavier because of the material, but that shouldn't affect drawing too much.\\r\\n\\r\\nYou\n  should be fine getting the cheaper plastic one and saving your money.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1380651998000.yml",
    "content": "id: comment-1066287038\ndate: 2013-10-01T18:26:38Z\nupdated: 2013-10-01T18:26:38Z\n_parent: /mastering-paper/short-guide/\nname: anilg\nurl: ''\nmessage: \"Great article for artists!\"\navatar: https://disqus.com/api/users/avatars/anilg.jpg\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1383110161000.yml",
    "content": "id: comment-1101837390\ndate: 2013-10-30T05:16:01Z\nupdated: 2013-10-30T05:16:01Z\n_parent: /mastering-paper/short-guide/\nname: 'Katie Ryan '\nurl: ''\nmessage: \"Is there any way to get the greyish background edited out on the paper\n  app? I'm trying to use some lettering I did for a blog header.\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1383134271000.yml",
    "content": "replying_to: '4'\nid: comment-1102059903\ndate: 2013-10-30T11:57:51Z\nupdated: 2013-10-30T11:57:51Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yes there is a way to save it without the background. Just zoom out the\n  page and hit the Share circle button. Then if you tap on the Camera Roll icon it'll\n  give you an option to toggle to background on/off. Just turn it off, save to your\n  Camera Roll and then you can email or share it through Photostream.\\r\\n\\r\\nIt'll\n  give you a `.PNG` file with a transparent background.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1392306483000.yml",
    "content": "id: comment-1242732099\ndate: 2014-02-13T15:48:03Z\nupdated: 2014-02-13T15:48:03Z\n_parent: /mastering-paper/short-guide/\nname: Rusty Shackleberg\nurl: ''\nmessage: \"I really enjoyed the review of Paper. I will be using this app. Is there\n  a user friendly app that you know of like Paper to make simple animations with?\n  Thanks\"\navatar: https://disqus.com/api/users/avatars/rustyshackleberg.jpg\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1392320882000.yml",
    "content": "replying_to: '5'\nid: comment-1243073843\ndate: 2014-02-13T19:48:02Z\nupdated: 2014-02-13T19:48:02Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"No sorry I don't know of any simple apps for creating animations.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1392385299000.yml",
    "content": "replying_to: '5'\nid: comment-1244061279\ndate: 2014-02-14T13:41:39Z\nupdated: 2014-02-14T13:41:39Z\n_parent: /mastering-paper/short-guide/\nname: Rusty Shackleberg\nurl: ''\nmessage: \"Thank you for responding to my question. I enjoy your blog.\"\navatar: https://disqus.com/api/users/avatars/rustyshackleberg.jpg\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1396062860000.yml",
    "content": "id: comment-1309200087\ndate: 2014-03-29T03:14:20Z\nupdated: 2014-03-29T03:14:20Z\n_parent: /mastering-paper/short-guide/\nname: Nick\nurl: ''\nmessage: \"When you buy pencil does it give you all brushes if you don't already\n  have them.\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1396063398000.yml",
    "content": "replying_to: '6'\nid: comment-1309205930\ndate: 2014-03-29T03:23:18Z\nupdated: 2014-03-29T03:23:18Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yes. Any time you connect Pencil to Paper it unlocks all of the tools.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1397168579000.yml",
    "content": "id: comment-1330566096\ndate: 2014-04-10T22:22:59Z\nupdated: 2014-04-10T22:22:59Z\n_parent: /mastering-paper/short-guide/\nname: Rahat\nurl: ''\nmessage: \"Hi Michael, i am quite struggling while using the Pencil on paper 53\n  app. I was really excited when i received it yesterday, it does amazing job to some\n  extent. The main problem i am facing right now it falls out of track from its right\n  course of action. I mean while i am using the brush tool with the pencil it slips\n  off many times and instead of putting color on paper it starts blending; which is\n  quite annoying. my assumption was i can only blend colors when i am using my finger,\n  then why the pencil tip is doing that? Is there something wrong with the pencil\n  tip i got or i am not using it from right angle ! please advise ...\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1397171013000.yml",
    "content": "replying_to: '7'\nid: comment-1330678477\ndate: 2014-04-10T23:03:33Z\nupdated: 2014-04-10T23:03:33Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Hi Rahat. What you've described is quite common so you're not alone. I\n  talk about this some in my [Pencil review](https://mademistakes.com/mastering-paper/pencil-53-review/), but here's a quick recap if\n  you haven't read it.\\r\\n\\r\\nIn my experience Blend sometimes misfires if you aren't\n  pressing hard enough when drawing. Pressing down on the tip while drawing registers\n  as an input with Paper, while lightly gliding the tip across the screen might not.\\r\\n\\r\\nThere\n  is a spring in the tip that I can only guess aids in decipher touches versus non\n  touches. Paper tries to be smart about these touches too which is why sometimes\n  you might observe a blend or stroke disappear or correct itself.\\r\\n\\r\\nThe more\n  you use Pencil the less it happens, but it can still be quite annoying even after\n  getting comfortable with the stylus. A possible solution is to turn off the Blend\n  feature until you need it. It's not ideal, but will solve the misfires. You can\n  modify Pencils's behavior by tapping the 53 circle in the upper right corner, tapping\n  Pencil, and then flipping Finger between \\\"Blend\\\" and \\\"Nothing\\\" depending on if you\n  want to use it or not.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1397252467000.yml",
    "content": "replying_to: '7'\nid: comment-1332437310\ndate: 2014-04-11T21:41:07Z\nupdated: 2014-04-11T21:41:07Z\n_parent: /mastering-paper/short-guide/\nname: Rahat\nurl: ''\nmessage: \"Hi Michael,\\r\\n\\r\\nThanks for your advise. I have replaced the original\n  tip and its much better now. I quite like the blend feature of pencil, wondering\n  if its possible to achieve such effect while using other stylus. anyways, i really\n  appreciate your quick reply.\\r\\n\\r\\nCheers.\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1397259544000.yml",
    "content": "replying_to: '7'\nid: comment-1332558301\ndate: 2014-04-11T23:39:04Z\nupdated: 2014-04-11T23:39:04Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"That is good to hear.\\r\\n\\r\\nFor now Pencil is the only stylus that enables\n  the Blend feature. I really hope they add the ability to other Bluetooth enabled\n  styli at some point. Or make so you can toggle it on/off even if you don't use a\n  stylus.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1404910582000.yml",
    "content": "id: comment-1476293721\ndate: 2014-07-09T12:56:22Z\nupdated: 2014-07-09T12:56:22Z\n_parent: /mastering-paper/short-guide/\nname: Mikee\nurl: ''\nmessage: \"Wait, let me get this straight. I'm sorry if I'm too redundant. Even though\n  I still don't have the tools, \\\"If\\\" I buy a pencil, and connect it to paper, ALL\n  tools would be unlocked? Is that it? Please correct me if I'm wrong because I'm\n  dying to use the app with complete tools :[\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1404911653000.yml",
    "content": "replying_to: '8'\nid: comment-1476317574\ndate: 2014-07-09T13:14:13Z\nupdated: 2014-07-09T13:14:13Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yes that's correct. When you connect Pencil to Paper it unlocks the tools,\n  but they only stay unlocked for 30 days. You'll need to connect Pencil again and\n  they'll unlock for another 30 days. Rinse/repeat.\\r\\n\\r\\nAs far as I can tell it's\n  a measure 53 took to lock the tools down to those who actually \\\"own\\\" Pencil. Otherwise\n  you could just connect a friend's Pencil to your iPad once and have the tools for\n  free. It's not a big deal if you actually own Pencil and use it -- the tools will\n  stay unlocked that way.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1405128379000.yml",
    "content": "replying_to: '8'\nid: comment-1481381638\ndate: 2014-07-12T01:26:19Z\nupdated: 2014-07-12T01:26:19Z\n_parent: /mastering-paper/short-guide/\nname: Mikee\nurl: ''\nmessage: \"Oh my gosh. Super thanks. Now all I have to think about and do is to\n  buy that pretty darn pencil &lt;3\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1410119824000.yml",
    "content": "id: comment-1578376039\ndate: 2014-09-07T19:57:04Z\nupdated: 2014-09-07T19:57:04Z\n_parent: /mastering-paper/short-guide/\nname: Larry\nurl: ''\nmessage: \"Hi Michael, I noticed while watching the time lapse video you are able\n  to fill in the blue background (:45 sec into the video) with the brush tool without\n  going inside the lines of your characters, even in the tight places that are more\n  narrow than the width of the brush (between the two center characters). Is there\n  a technique for doing that? You didn't use the zoom in loop so I'm not sure how\n  you managed it. Whenever I try to fill in a tight spot (like the angle formed between\n  neck and chin) with the brush tool, the brush tool width is too wide to fill it\n  without going into the lines of the other parts of the drawing. Thanks. Love your\n  lessons\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1410136998000.yml",
    "content": "replying_to: '9'\nid: comment-1578688684\ndate: 2014-09-08T00:43:18Z\nupdated: 2014-09-08T00:43:18Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I'm using a [Pogo Connect stylus](https://mademistakes.com/mastering-paper/pogo-connect-smart-pen/) to get a thinner stroke with the Paper's\n  brush tool. It currently is the only pressure sensitive stylus Paper supports. I\n  wrote about it in greater detail but the basic idea is the harder you press the\n  the wider the stroke.\\r\\n\\r\\nSo when I'm painting\n  in smaller spots I barely touch the screen which thins out the brush to about half\n  as wide as you can possibly get without a Pogo Connect.\\r\\n\\r\\nFor me that makes\n  the Pogo extremely interesting because it lets you do things with Paper's tools\n  no other stylus can. There are a handful of other pressure sensitive styli on the\n  market that look way better than the Pogo Connect, but sadly none work with Paper.\\r\\n\\r\\nWorth\n  noting, if you have an iPad Air or Retina Mini I wouldn't bother with a Pogo Connect.\n  They have horrible support and barely work since Apple changed the technology behind\n  their screens.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1425120630000.yml",
    "content": "id: comment-1880140653\ndate: 2015-02-28T10:50:30Z\nupdated: 2015-02-28T10:50:30Z\n_parent: /mastering-paper/short-guide/\nname: MasterPiece\nurl: ''\nmessage: \"Hi how i can have a full colored background in paper 53 ?!\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1425146368000.yml",
    "content": "replying_to: '10'\nid: comment-1880641514\ndate: 2015-02-28T17:59:28Z\nupdated: 2015-02-28T17:59:28Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Here's instruction on how to [change the background color](https://support.fiftythree.com/hc/en-us/articles/201721151-Using-Color#fill-with-color).\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1428282766000.yml",
    "content": "id: comment-1948308246\ndate: 2015-04-06T01:12:46Z\nupdated: 2015-04-06T01:12:46Z\n_parent: /mastering-paper/short-guide/\nname: Ron\nurl: ''\nmessage: \"Is there an undo feature? Accidental errant strokes have destroyed entire\n  sketches. Help?\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1428285070000.yml",
    "content": "replying_to: '11'\nid: comment-1948343258\ndate: 2015-04-06T01:51:10Z\nupdated: 2015-04-06T01:51:10Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Yes there is an undo feature, Paper calls it [Rewind](https://support.fiftythree.com/hc/en-us/articles/203385492-Drawing-Tools#rewind). You use two fingers\n  and rotate them in a counter-clockwise direction to step through undos.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1428325994000.yml",
    "content": "replying_to: '11'\nid: comment-1948898232\ndate: 2015-04-06T13:13:14Z\nupdated: 2015-04-06T13:13:14Z\n_parent: /mastering-paper/short-guide/\nname: Ron\nurl: ''\nmessage: \"Cool. Thanks very much!\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1430472945000.yml",
    "content": "id: comment-1997413939\ndate: 2015-05-01T09:35:45Z\nupdated: 2015-05-01T09:35:45Z\n_parent: /mastering-paper/short-guide/\nname: MarcB\nurl: ''\nmessage: \"Try [**Animation Desk**](http://www.kdanmobile.com/en/animation-desk/)\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1432953004000.yml",
    "content": "id: comment-2052672321\ndate: 2015-05-30T02:30:04Z\nupdated: 2015-05-30T02:30:04Z\n_parent: /mastering-paper/short-guide/\nname: TheProgressiveTroll\nurl: http://www.mediajazz.com\nmessage: \"FiftyThree just put out a nice example of building up a car from basic\n  structures but what I can't figure out is how to do the same sized circle multiple\n  times. They also sent out an example a few weeks ago with a lattice of same sized\n  circles. Too similar to be eye balled. How?\\r\\n\\r\\nThanks in advance ... I hope.\n  8-)\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1432958065000.yml",
    "content": "replying_to: '13'\nid: comment-2052746632\ndate: 2015-05-30T03:54:25Z\nupdated: 2015-05-30T03:54:25Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Have you updated Paper recently? They added a new set of tools called\n  [**Think Kit**](http://www.fiftythree.com/think). These tools let you draw perfectly straight lines, circles, squares,\n  and arrows. So what was done here is they drew one blue circle and then used the\n  new cut tool to reposition and copy/duplicate the circle several times. Then drew\n  over that with the pen tool freehand.\\r\\n\\r\\n\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1432960234000.yml",
    "content": "replying_to: '13'\nid: comment-2052773885\ndate: 2015-05-30T04:30:34Z\nupdated: 2015-05-30T04:30:34Z\n_parent: /mastering-paper/short-guide/\nname: TheProgressiveTroll\nurl: http://www.mediajazz.com\nmessage: \"I have to admit that all I have done with the cut tool is select and\n  throw it off the screen, probably because of the video. I'll give it a try in the\n  morning. Thanks for the response.\"\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1439393532000.yml",
    "content": "id: comment-2188789433\ndate: 2015-08-12T15:32:12Z\nupdated: 2015-08-12T15:32:12Z\n_parent: /mastering-paper/short-guide/\nname: Rebecca MacPherson\nurl: ''\nmessage: \"I just want to say that you are very talented and watching this video\n  blew my mind. Incredible work!\"\navatar: https://disqus.com/api/users/avatars/rebecca_macpherson.jpg\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1439403660000.yml",
    "content": "replying_to: '14'\nid: comment-2189116778\ndate: 2015-08-12T18:21:00Z\nupdated: 2015-08-12T18:21:00Z\n_parent: /mastering-paper/short-guide/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks Rebecca :smile:\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1477264530494.yml",
    "content": "_parent: /mastering-paper/short-guide/\nmessage: \"Hi Michael,\\r\\nI just discovered your lessons as I am just getting into iPad art and I think they are really awesome! I apologize if I am being redundant about anything, but exactly which iPad are you using for this? I have an iPad Air 1 and am having trouble finding others who use this iPad and know which styli work with it. I understand apple changed the technology in the air 2, which is why I am often confused whether a stylus will work properly with my iPad. Would you recommend the Pencil to use with Paper, or the Pogo Connect, specifically on the iPad Air 1?  I've been reading great things on both styli but am unsure if it is for Air 1 or 2.\\r\\nThank you for taking the time to read my unnecessarily wrong message, and I look forward to hearing back! \\r\\nKeep up the great work!\"\nname: Cari\nemail: ab9e4031ce22d7ca7c977cb12c6f1a4c\nurl: ''\nhidden: ''\ndate: '2016-10-23T23:15:29.851Z'\n"
  },
  {
    "path": "src/_data/comments/short-guide/comment-1477270163289.yml",
    "content": "_parent: /mastering-paper/short-guide/\nreplying_to: '15'\nmessage: \"@Cari - I have an iPad Air 2 and you can read up on my [stylus recommendations here](https://mademistakes.com/faqs/stylus-recommendations/). Pencil has good [compatibility with older devices](https://support.fiftythree.com/hc/en-us/articles/201712591-Using-Pencil#ipad-compatibility) and does work with the Air.\\r\\n\\r\\nI don't have first hand experience with the newer Pogo Connect, but it does [support the older iPad Air](https://tenonedesign.com/connect.php#compatibility) if you want pressure sensitive tips (something FiftyThree's Pencil does not have).\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-10-24T00:49:22.600Z'\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1413902978000.yml",
    "content": "id: comment-1646420078\ndate: 2014-10-21T14:49:38Z\nupdated: 2014-10-21T14:49:38Z\n_parent: /work/skinny-bones-jekyll/\nname: Guest\nurl:\nmessage: \"Thanks for doing this. I'll be using Skinny Bones for both my personal\n  website, and the website for my SF series.\"\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1413994452000.yml",
    "content": "replying_to: '1'\nid: comment-1648336201\ndate: 2014-10-22T16:14:12Z\nupdated: 2014-10-22T16:14:12Z\n_parent: /work/skinny-bones-jekyll/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Fantastic. Glad it's been of use.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1415781199000.yml",
    "content": "id: comment-1689169431\ndate: 2014-11-12T08:33:19Z\nupdated: 2014-11-12T08:33:19Z\n_parent: /work/skinny-bones-jekyll/\nname: Moch Lutfi\nurl: http://lumochift.org/\nmessage: \"Thanks for created awesome themes... I'm use it for my personal website\n  but still in progress in customization.\"\navatar: https://disqus.com/api/users/avatars/mochlutfi.jpg\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1415909727000.yml",
    "content": "id: comment-1691869254\ndate: 2014-11-13T20:15:27Z\nupdated: 2014-11-13T20:15:27Z\n_parent: /work/skinny-bones-jekyll/\nname: Victor Caldas\nurl: http://vcaldas.github.io/\nmessage: \"Thanks a lot Michael. I started playing with Minimal Mistakes but the\n  Skinny bones fits even better.\\r\\nCheers\"\navatar: https://disqus.com/api/users/avatars/vcaldas.jpg\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1415911498000.yml",
    "content": "replying_to: '2'\nid: comment-1691932369\ndate: 2014-11-13T20:44:58Z\nupdated: 2014-11-13T20:44:58Z\n_parent: /work/skinny-bones-jekyll/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Looking good.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1415911529000.yml",
    "content": "replying_to: '3'\nid: comment-1691933189\ndate: 2014-11-13T20:45:29Z\nupdated: 2014-11-13T20:45:29Z\n_parent: /work/skinny-bones-jekyll/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You're welcome. It's definitely my favorite out of the two. Way more\n  fleshed out than my older Jekyll themes.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1416897798000.yml",
    "content": "replying_to: 2\nid: comment-1711371796\ndate: 2014-11-25T06:43:18Z\nupdated: 2014-11-25T06:43:18Z\n_parent: /work/skinny-bones-jekyll/\nname: Moch Lutfi\nurl: http://lumochift.org/\nmessage: \"Thanks. Finally I finished my customization. Copy cat from your current\n  websites themes but with some modification so it can run in github-pages.\\r\\n\\r\\nI\n  love this website themes. so clean and neat. :D\"\navatar: https://disqus.com/api/users/avatars/mochlutfi.jpg\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1417297264000.yml",
    "content": "id: comment-1718280717\ndate: 2014-11-29T21:41:04Z\nupdated: 2014-11-29T21:41:04Z\n_parent: /work/skinny-bones-jekyll/\nname: timani\nurl: ''\nmessage: \"Cheers Michael, an excellent way for someone to get started\"\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1418625404000.yml",
    "content": "id: comment-1742482456\ndate: 2014-12-15T06:36:44Z\nupdated: 2014-12-15T06:36:44Z\n_parent: /work/skinny-bones-jekyll/\nname: John Tigue\nurl: http://tigue.com/\nmessage: \"Nice work. Could I bother you for a quick summary of the difference between\n  this and HPSTR?\"\navatar: https://disqus.com/api/users/avatars/johntigue.jpg\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1418660390000.yml",
    "content": "replying_to: '5'\nid: comment-1743368592\ndate: 2014-12-15T16:19:50Z\nupdated: 2014-12-15T16:19:50Z\n_parent: /work/skinny-bones-jekyll/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"All of my themes share common traits but all look visually different.\\r\\n\\r\\nHPSTR\n  is more of a tumble-log styled theme, post after post. Skinny Bones has tile based\n  archives that are more visual based instead of a dump of full posts.\\r\\n\\r\\nOn my\n  [Jekyll themes page](https://mademistakes.com/work/jekyll-themes/) there are bullet points that describe each theme and what is unique\n  about them.\\r\\n\\r\\n\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1430184358000.yml",
    "content": "id: comment-1990959163\ndate: 2015-04-28T01:25:58Z\nupdated: 2015-04-28T01:25:58Z\n_parent: /work/skinny-bones-jekyll/\nname: Brian Moseley\nurl: ''\nmessage: \"This is great! Incredibly ignorant question: I've been messing around\n  with variables in Sass, but I can't figure out how to change the font. I make changes\n  in `_variables.scss`, but the fonts don't show up on the rendered site.\"\navatar: https://disqus.com/api/users/avatars/disqus_Kr3WZABtYx.jpg\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1430239460000.yml",
    "content": "replying_to: '6'\nid: comment-1992063401\ndate: 2015-04-28T16:44:20Z\nupdated: 2015-04-28T16:44:20Z\n_parent: /work/skinny-bones-jekyll/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Do you have a public repo somewhere for me to look at?\\r\\n\\r\\nHave you loaded\n  the actual font files as well? Just changing the name in the CSS won't work unless\n  it's a system font (Arial, Verdana, Georgia, Courier, etc) that is already installed.\\r\\n\\r\\nI'm\n  using Google webfonts and a script is placed in the head of the `default.html` layout\n  that loads the appropriate fonts. Then those are referenced in `_variables.scss` by\n  family name.\\r\\n\\r\\nDepending on what font(s) you're using you can either use a font\n  service (Google, Typekit, Fontdeck, etc) that hosts them for you and just include\n  their script in your templates. Or if you have the rights to embed fonts that you\n  own you can use a service like [Font Squirrel](http://www.fontsquirrel.com/tools/webfont-generator) to convert them for embedding.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/skinny-bones-jekyll/comment-1430240907000.yml",
    "content": "replying_to: '6'\nid: comment-1992110313\ndate: 2015-04-28T17:08:27Z\nupdated: 2015-04-28T17:08:27Z\n_parent: /work/skinny-bones-jekyll/\nname: Brian Moseley\nurl: ''\nmessage: \"I see. I'd forgotten that the fonts I was using weren't system fonts\n  and needed to be loaded.\\r\\n\\r\\nThanks for the Jekyll starter! It's really great!\"\navatar: https://disqus.com/api/users/avatars/disqus_Kr3WZABtYx.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1372917246000.yml",
    "content": "id: comment-951329172\ndate: 2013-07-04T05:54:06Z\nupdated: 2013-07-04T05:54:06Z\n_parent: /work/so-simple-jekyll-theme/\nname: L.\nurl: ''\nmessage: \"Cheers man - I'm working on creating a personal blog with Jekyll and\n  this is an excellent starting point. Appreciate the hard work :)\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1372926897000.yml",
    "content": "id: comment-951420040\ndate: 2013-07-04T08:34:57Z\nupdated: 2013-07-04T08:34:57Z\n_parent: /work/so-simple-jekyll-theme/\nname: Rajagopal\nurl: ''\nmessage: \"Brilliant theme! Using this for my blog. Thanks for opensourcing it!\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1372945264000.yml",
    "content": "replying_to: '1'\nid: comment-951663615\ndate: 2013-07-04T13:41:04Z\nupdated: 2013-07-04T13:41:04Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Excellent, glad it's of help.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1372945305000.yml",
    "content": "replying_to: '2'\nid: comment-951664586\ndate: 2013-07-04T13:41:45Z\nupdated: 2013-07-04T13:41:45Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"No problem. Let me know if you hit any issues. Always looking to make\n  it better.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1373660261000.yml",
    "content": "id: comment-960258679\ndate: 2013-07-12T20:17:41Z\nupdated: 2013-07-12T20:17:41Z\n_parent: /work/so-simple-jekyll-theme/\nname: Mike Carson\nurl: 'http://hack.ly'\nmessage: \"Great theme, thanks - I'm using it.\"\navatar: https://disqus.com/api/users/avatars/mike_carson.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1374677809000.yml",
    "content": "id: comment-974663528\ndate: 2013-07-24T14:56:49Z\nupdated: 2013-07-24T14:56:49Z\n_parent: /work/so-simple-jekyll-theme/\nname: Joe\nurl: ''\nmessage: \"Thanks for creating this theme. It's a great starting point.\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1377475983000.yml",
    "content": "id: comment-1017325612\ndate: 2013-08-26T00:13:03Z\nupdated: 2013-08-26T00:13:03Z\n_parent: /work/so-simple-jekyll-theme/\nname: Jason\nurl: ''\nmessage: \"I cannot get to this work. When I run it i see no styles.\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1377476182000.yml",
    "content": "replying_to: '5'\nid: comment-1017327745\ndate: 2013-08-26T00:16:22Z\nupdated: 2013-08-26T00:16:22Z\n_parent: /work/so-simple-jekyll-theme/\nname: Jason\nurl: ''\nmessage: \"Nevermind, sorry!\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1378075560000.yml",
    "content": "replying_to: '5'\nid: comment-1025687774\ndate: 2013-09-01T22:46:00Z\nupdated: 2013-09-01T22:46:00Z\n_parent: /work/so-simple-jekyll-theme/\nname: Marlon Cabrera\nurl: ''\nmessage: \"I see no styles too. How did you fixed it?\"\navatar: https://disqus.com/api/users/avatars/marlon_cabrera.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1378078073000.yml",
    "content": "replying_to: '5'\nid: comment-1025724164\ndate: 2013-09-01T23:27:53Z\nupdated: 2013-09-01T23:27:53Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"The URL is probably set wrong in `_config.yml`\\r\\n\\r\\nIf you're working\n  locally leave it blank or `http://localhost:4000`. When you're ready to deploy to GitHub pages or your own\n  server make sure it's set to use your domain name.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1378092010000.yml",
    "content": "replying_to: '5'\nid: comment-1025961767\ndate: 2013-09-02T03:20:10Z\nupdated: 2013-09-02T03:20:10Z\n_parent: /work/so-simple-jekyll-theme/\nname: Marlon Cabrera\nurl: ''\nmessage: \"I am working locally. It is working now, thank you so much!\"\navatar: https://disqus.com/api/users/avatars/marlon_cabrera.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1382543473000.yml",
    "content": "id: comment-1093853125\ndate: 2013-10-23T15:51:13Z\nupdated: 2013-10-23T15:51:13Z\n_parent: /work/so-simple-jekyll-theme/\nname: Jesse\nurl: ''\nmessage: \"On the \\\"sample-post\\\" the `{: .pull-right}` is not working and neither is\n  the table. It actually prints `{: .pull-right}` and `{: rules=\\\"groups\\\"}`. Do you think\n  that is a redcarpet issue or something else?\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1382543885000.yml",
    "content": "replying_to: '6'\nid: comment-1093861442\ndate: 2013-10-23T15:58:05Z\nupdated: 2013-10-23T15:58:05Z\n_parent: /work/so-simple-jekyll-theme/\nname: Jesse\nurl: ''\nmessage: \"Actually just verified it is. Did a `gem install kramdown` and switched\n  the `_config.yml` back to `kramdown` then regenerated. Works like it's supposed to.\n  Might consider adding kramdown to the `Gemfile` since the samples rely on it.\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1382544558000.yml",
    "content": "replying_to: '6'\nid: comment-1093881377\ndate: 2013-10-23T16:09:18Z\nupdated: 2013-10-23T16:09:18Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I'm not too familiar with RedCarpet but I'm guessing it doesn't support\n  that shortcut for applying classes. Kramdown does which is what I use for Markdown\n  with the theme.\\r\\n\\r\\nIf you don't want to switch, adding HTML to your Markdown\n  file is always an option.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1382672424000.yml",
    "content": "id: comment-1095977565\ndate: 2013-10-25T03:40:24Z\nupdated: 2013-10-25T03:40:24Z\n_parent: /work/so-simple-jekyll-theme/\nname: Anonymous\nurl: ''\nmessage: \"I know this sound stupid, but how do I set the button to be centered?\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1382709900000.yml",
    "content": "replying_to: '7'\nid: comment-1096354517\ndate: 2013-10-25T14:05:00Z\nupdated: 2013-10-25T14:05:00Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"If you want buttons to be centered \\\"globally\\\" then you''ll need to mess\n  around with the `.btn` class in the CSS. If you just want a specific instance of the\n  button you could wrap it in a `div` that has CSS to `text-align: center` and that should\n  do the trick. If you look at the `.pagination` wrapper that includes the next and\n  previous post links and that's how I centered them.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1382711236000.yml",
    "content": "replying_to: '7'\nid: comment-1096377519\ndate: 2013-10-25T14:27:16Z\nupdated: 2013-10-25T14:27:16Z\n_parent: /work/so-simple-jekyll-theme/\nname: Anonymous\nurl: ''\nmessage: \"thanks for the response, also keep rocking with themes.\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1384373346000.yml",
    "content": "id: comment-1121828245\ndate: 2013-11-13T20:09:06Z\nupdated: 2013-11-13T20:09:06Z\n_parent: /work/so-simple-jekyll-theme/\nname: Alessandro Amato del Monte\nurl: 'http://aadm.github.io/'\nmessage: \"Michael sorry if you see this post again. I think I've had a problem with\n  my Disqus account and believe my comment didn't go through -- in case it's awaiting\n  moderation then I'm sorry -- delete either one.\\r\\n\\r\\nSo I wanted to thank you for\n  this template which I love.\\r\\n\\r\\n\n  However I'm not able to do much with CSS etc so I wonder if you could give me an\n  help to enlarge the default column width and associated images because they are\n  all shrunk down to `640px` or so while I'd like my photographs BIG (`800px` wide big).\"\navatar: https://disqus.com/api/users/avatars/alessandroamatodelmonte.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1384373944000.yml",
    "content": "replying_to: '8'\nid: comment-1121841688\ndate: 2013-11-13T20:19:04Z\nupdated: 2013-11-13T20:19:04Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"No worries, doesn't look like you double posted the comment, it only\n  came up once.\\r\\n\\r\\nIf you want to make the main content column wider you can play\n  around `max-width` on the `.entry-content` element. Because the theme is responsive\n  that size is in a few locations depending on the width of your browser window (or\n  screen if on mobile), so you'll need to adjust accordingly.\\r\\n\\r\\nIt's probably\n  going to be some work getting all the widths to sort out. I optimized the pages\n  for readability and purposely left white space on the left and right so the line\n  widths weren't too long. If you do beef up the main content column's width it'll\n  screw with the left sidebar and things won't line up right.\\r\\n\\r\\nEasiest way to address\n  that would be to make the sidebar 1 column that spans the entire width (see what\n  I did on small screen sizes for ideas). You might have to increase the `max-width`\n  on `.entry-wrapper` as well to get everything to fit.\\r\\n\\r\\nHope this helps!\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1384374016000.yml",
    "content": "replying_to: '8'\nid: comment-1121843207\ndate: 2013-11-13T20:20:16Z\nupdated: 2013-11-13T20:20:16Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Kramdown to my knowledge is a Jekyll dependency. It should install along\n  with it, at least it does when I've tried a clean install or update.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1384375315000.yml",
    "content": "replying_to: '8'\nid: comment-1121870886\ndate: 2013-11-13T20:41:55Z\nupdated: 2013-11-13T20:41:55Z\n_parent: /work/so-simple-jekyll-theme/\nname: Alessandro Amato del Monte\nurl: ''\nmessage: \"That was very quick! Thank you so much for the reply. I will try and\n  follow your indications and will let you know of my (in)success!\"\navatar: https://disqus.com/api/users/avatars/alessandroamatodelmonte.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1385165860000.yml",
    "content": "id: comment-1135191019\ndate: 2013-11-23T00:17:40Z\nupdated: 2013-11-23T00:17:40Z\n_parent: /work/so-simple-jekyll-theme/\nname: lcallot\nurl: ''\nmessage: \"Thanks for the theme, it's very neat! I'm using it as a base for my site\n  but I'd like to limit the size of the `page.image.feature` element to some arbitrary\n  limit, say 800px, and keep it centered. By tinkering with the CSS I can do the former\n  (`max-width: 800px`) but the image pushed to the left and I can't figure how to center\n  it. I've tried to set margins to auto, and enclose the image in a wrapper, but none\n  of that work. Any chance you could help?\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1385166847000.yml",
    "content": "replying_to: '9'\nid: comment-1135203891\ndate: 2013-11-23T00:34:07Z\nupdated: 2013-11-23T00:34:07Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Sure no problem, this is a fairly easy one to fix.\\r\\n\\r\\nIf you add a\n  `display: block` declaration to `.entry-feature-image` along with a `max-width` you should\n  be all set.\\r\\n\\r\\nI did a quick test in Google's Developer Tools on the theme demo\n  site and it appeared to resize and center the image just fine.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1385205251000.yml",
    "content": "replying_to: '9'\nid: comment-1135681128\ndate: 2013-11-23T11:14:11Z\nupdated: 2013-11-23T11:14:11Z\n_parent: /work/so-simple-jekyll-theme/\nname: lcallot\nurl: ''\nmessage: \"Thanks a lot for the fast reply, it works perfectly. I just had to remember\n  setting the margin to `margin: 20px auto;` instead of the current `margin 20px 0 0;`\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1385214969000.yml",
    "content": "replying_to: '9'\nid: comment-1135835261\ndate: 2013-11-23T13:56:09Z\nupdated: 2013-11-23T13:56:09Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Meant to include the bit about making the left and right margins auto.\n  Glad it worked out.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1386794979000.yml",
    "content": "id: comment-1159180269\ndate: 2013-12-11T20:49:39Z\nupdated: 2013-12-11T20:49:39Z\n_parent: /work/so-simple-jekyll-theme/\nname: cehter\nurl: ''\nmessage: \"First of all, thanks for the lovely theme. I have a question about the\n  use of Disqus. I have an account and I added the s`hortname` to my `_config.yml`. Before\n  I used Jeykll on my server I tested it local and I could add an comment. Now on\n  my server I can't. Do you have an idea why? I checked the shortname and I also set\n  `comments: true`. thx :)\"\navatar: https://disqus.com/api/users/avatars/cehter.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1386795345000.yml",
    "content": "replying_to: '10'\nid: comment-1159188340\ndate: 2013-12-11T20:55:45Z\nupdated: 2013-12-11T20:55:45Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"That's strange. If it worked testing locally then it should work on your\n  live server. Can you verify if Disqus is loading at all? If you're comfortable with\n  posting a link to your site I can take a quick look at see if something obvious\n  jumps out at me.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1386795767000.yml",
    "content": "replying_to: '10'\nid: comment-1159198898\ndate: 2013-12-11T21:02:47Z\nupdated: 2013-12-11T21:02:47Z\n_parent: /work/so-simple-jekyll-theme/\nname: cehter\nurl: ''\nmessage: \"No, Disqus does not load. Here my site: <a href=\\\"http://lebensverrueckt.haktar.org/\\\"\n  rel=\\\"nofollow\\\">http://lebensverrueckt.haktar....</a>\\r\\n\\r\\nThanks :)\"\navatar: https://disqus.com/api/users/avatars/cehter.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1386796040000.yml",
    "content": "replying_to: '10'\nid: comment-1159206219\ndate: 2013-12-11T21:07:20Z\nupdated: 2013-12-11T21:07:20Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Doesn't look like it's loading the Disqus script, which is really odd\n  because if it worked locally and nothing changed I don't know why it wouldn't on\n  the live server.\\r\\n\\r\\nYou could try removing the Liquid if statements in `scripts.html`\n  include and force it to load the script.\\r\\n\\r\\nChange\\r\\n\\r\\n`{% if site.disqus_shortname\n  and page.comments %}{% include disqus_comments.html %}{% endif %}`\\r\\n\\r\\nto `{% include\n  disqus_comments.html %}` and see if the script loads.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1386796421000.yml",
    "content": "replying_to: '10'\nid: comment-1159214410\ndate: 2013-12-11T21:13:41Z\nupdated: 2013-12-11T21:13:41Z\n_parent: /work/so-simple-jekyll-theme/\nname: cehter\nurl: ''\nmessage: \"I made the changes and now the script loads. Thanks for the fast help!\n  :) \\r\\nBut the problem is strange...\"\navatar: https://disqus.com/api/users/avatars/cehter.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389569354000.yml",
    "content": "id: comment-1197790821\ndate: 2014-01-12T23:29:14Z\nupdated: 2014-01-12T23:29:14Z\n_parent: /work/so-simple-jekyll-theme/\nname: Alessandro Amato del Monte\nurl: ''\nmessage: \"Hi again Michael. Maybe you could shed some light here; I'm trying to\n  use [GalleryView](http://spaceforaname.com/galleryview) but it doesn't work.\\r\\n\\r\\n\n  So what I did is this -- installed [GalleryView jekyll\n    plugin](https://github.com/mgratzer/GalleryView),\n  installed GalleryView itself in a subdirectory of my site, added the lines to call\n  the various components of GalleryView (GalleryView JS, jQuery Timers Plugin JS,\n  GalleryView CSS) to `_includes/scripts.html` (pointing to the correct directories\n  of my site obviously) but the list of photos that is supposed to be taken by the\n  javascript and transformed into this cool looking and modern gallery does not appear...\n  ie, it displays a plain simple unordered list.\\r\\n\\r\\nSo I wonder if there's something\n  in your theme that prevents these javascripts to work or not (because something\n  like this also happened with another plugin I was testing yesterday, again to display\n  some sort of photo galleries).\\r\\n\\r\\nThanks!\"\navatar: https://disqus.com/api/users/avatars/alessandroamatodelmonte.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389577232000.yml",
    "content": "replying_to: '11'\nid: comment-1197946279\ndate: 2014-01-13T01:40:32Z\nupdated: 2014-01-13T01:40:32Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Just a quick question before I take a closer look at the GalleryView\n  plugin. Are you hosting your site on GitHub pages? I ask because you mentioned you've\n  had problems with other plugins. GitHub pages doesn't currently support any Jekyll\n  plugins, so that would explain why they're not working for you.\\r\\n\\r\\nTo use them\n  you have to generate your Jekyll site locally first and then deploy the files in\n  `_site`\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389605588000.yml",
    "content": "replying_to: '11'\nid: comment-1198202797\ndate: 2014-01-13T09:33:08Z\nupdated: 2014-01-13T09:33:08Z\n_parent: /work/so-simple-jekyll-theme/\nname: Alessandro Amato del Monte\nurl: ''\nmessage: \"I'm sorry for being so ignorant but I'm not sure if I'm hosting my\n  site to Github Pages... I mean I only have a single repo in github which is my site,\n  then when I update my site I push all changes to github, and my site is reached\n  at <http://aadm.github.io> does it mean\n  that my site is hosted on Github \\\"Pages\\\" (I would answer yes if you were asking\n  me whether I host my site on Github; Github \\\"Pages\\\" -- not sure what it is). Again\n  sorry for being so naive...\\r\\n\\r\\nAnyway you can look at the [source for my site\n  here](https://github.com/aadm/aadm.github.io)\\r\\n\\r\\nBTW\n  another thing that's confusing to me is the need to put my site on the `gh-pages`\n  branch as [some tutorial page](http://opentechschool.github.io/social-coding/extras/pages.html), section \\\"Manual Creation\\\")\n  recommend. I have it on my `master` branch. Not sure whether I need to move it?...\\r\\n\\r\\nAnyway\n  let's assume that the reason why the plugin fails is because I'm actually hosting\n  on Github Pages. It should be working locally anyway, right (creating the site with\n  `jekyll --serve` etc and testing it on `http://localhost:4000`)? Well it isn't. I also\n  am not sure I know how to \\\"deploy the files in `_site`\\\" as you suggest.\"\navatar: https://disqus.com/api/users/avatars/alessandroamatodelmonte.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389618393000.yml",
    "content": "replying_to: '11'\nid: comment-1198322409\ndate: 2014-01-13T13:06:33Z\nupdated: 2014-01-13T13:06:33Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Looks like you're using Github Pages then. There are two ways to host\n  your site with Github, on the `master` branch if you have one repo, or as a project\n  using the `gh-page` branch. For example I host all of my Jekyll themes on Github using\n  the project method because I have multiple repos. GH recently redid their hosting\n  documentation and [this page](http://pages.github.com/) should clear things up for you \\r\\n\\r\\nSo back to the plugin issue. You\n  won't be able to use them with your current git workflow but you can build the site\n  yourself and push that. The general idea is instead of committing your source Jekyll\n  files and letting Github generate the site, you need to build it locally yourself\n  and commit all the files in the `_site` folder instead. Here's a site that [explains it pretty\n    well](http://davidensinger.com/2013/04/deploying-jekyll-to-github-pages/) and also explains how you can automate things with rake.\\r\\n\\r\\nAnd yes. The plugins\n  should still work locally. I'll take a look at your repo when I get a chance to\n  see if something jumps out to me.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389640551000.yml",
    "content": "replying_to: '11'\nid: comment-1198827633\ndate: 2014-01-13T19:15:51Z\nupdated: 2014-01-13T19:15:51Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Re-read your original comment, doesn't seem like it's a plugin issue...\n  well not when you work locally. The fact that you are getting an unordered list\n  tells me the Jekyll plugin is working. The problem lies with loading the scripts\n  that does all the styling magic.\\r\\n\\r\\nWithout seeing that code I can't troubleshoot\n  effectively. But my guess is there is a jQuery or script conflict somewhere in the\n  code. If you open the web inspector on a page that doesn't load the gallery correctly,\n  do you see any JavaScript errors?\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389641807000.yml",
    "content": "replying_to: '11'\nid: comment-1198870502\ndate: 2014-01-13T19:36:47Z\nupdated: 2014-01-13T19:36:47Z\n_parent: /work/so-simple-jekyll-theme/\nname: Alessandro Amato del Monte\nurl: ''\nmessage: \"Right. So if I open the Javascript console in Chrome here's the problem:\\r\\n\\r\\n```\\r\\n\nUncaught ReferenceError: $ is not defined test-galleryview.html:165\\r\\nUncaught\n  TypeError: Object [object Object] has no method 'fitVids' scripts.min.js:1\\r\\n```\"\navatar: https://disqus.com/api/users/avatars/alessandroamatodelmonte.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389642711000.yml",
    "content": "replying_to: '11'\nid: comment-1198900264\ndate: 2014-01-13T19:51:51Z\nupdated: 2014-01-13T19:51:51Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I know enough Javascript to be dangerous so I might not have a 100% solution\n  for you. But the problem is certainly from the GalleryView scripts not loading properly\n  because of a conflict.\\r\\n\\r\\nFor starters you're loading 2 versions of jQuery that\n  might be causing the problem. I'm using 1.9.1 with the theme and then you're loading\n  1.7.1 after that (only use one version). No idea on how current the GalleryViewscript\n  is so it might not work with 1.9.1. And if you use 1.7.1 instead it might break\n  something with the theme. You'll have to experiment and adjust the scripts as necessary.\\r\\n\\r\\nAlso\n  I would comment out `<script src=\\\"{{ site.url }}/assets/js/scripts.min.js\\\"></script>`\n  just while you're troubleshooting. It's possible the GalleryView scripts are conflicting\n  with something in there, namely FitVids since I noticed a reference to it in your\n  console, but my money is on a jQuery conflict.\\r\\n\\r\\nOther than these suggestions\n  I don't have much else to offer about fixing scripts. It's not really my expertise.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389654080000.yml",
    "content": "replying_to: '11'\nid: comment-1199207931\ndate: 2014-01-13T23:01:20Z\nupdated: 2014-01-13T23:01:20Z\n_parent: /work/so-simple-jekyll-theme/\nname: Alessandro Amato del Monte\nurl: ''\nmessage: \"Ok so I tried a few things and:\\r\\n\\r\\n1. i need to run jquery 1.71. Looks\n  like the rest of your theme is unaffected by this so far.\\r\\n2. I had to move\n  the scripts within the head so I changed `_layouts/page.html` and `post.html` to have\n  `{% include scripts.html %}` just after the include.\\r\\n\\r\\nNow Galleryview\n  works! But the top menubar doesn't...\"\navatar: https://disqus.com/api/users/avatars/alessandroamatodelmonte.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389655402000.yml",
    "content": "replying_to: '11'\nid: comment-1199260101\ndate: 2014-01-13T23:23:22Z\nupdated: 2014-01-13T23:23:22Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"So close. My guess is using jQuery 1.7.1 broke something with the responsive\n  nav script and it's not triggering a few CSS classes that hide and show it based\n  on screen size. If you don't care about that you could strip it out and remove\n  some CSS styling. If you inspect `nav` element and the lists inside it you should\n  be able to spot the CSS that needs modifying.\\r\\n\\r\\nThere's probably a few `display:\n  none`s in there that is hiding the nav that could be taken out.\\r\\n\\r\\nOr check\n  the [Responsive Nav's site](ttp://responsive-nav.com) for a possible fix.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1389743148000.yml",
    "content": "replying_to: '11'\nid: comment-1200972409\ndate: 2014-01-14T23:45:48Z\nupdated: 2014-01-14T23:45:48Z\n_parent: /work/so-simple-jekyll-theme/\nname: Alessandro Amato del Monte\nurl: ''\nmessage: \"So I got everything to work now! At least locally, I still need to understand\n  how to push the compiled site up on github.\\r\\n\\r\\nAnyway, here's what I did:\\r\\n\\r\\n1,\n  added the js stuff required by GalleryView inside `page.html` and `post.html` in the\n  `<head>` section, right after `{% include head.html %}`. I've left jquery 1.7.1\n  which is compatible with all the things in your template, so no need for 1.9.1 which\n  effectively makes GalleryView fail.\\r\\n2 `_includes/scripts.html` is same as before\n  now, except for the jquery line which is commented out.\\r\\n\\r\\n(Little update of\n  the day after)<br />To push only the compiled source (=content of `_site`) I wasn't\n  able to follow the instructions given.\\r\\n\\r\\nBut I've found a [nice\n    script](https://github.com/balevine/jekyll-deploy) that makes the magic for me so it may help others\\r\\n\\r\\nAnd finally [this is an\n      example](http://aadm.github.io/2013-11-22-ciao-alfonsine.html) where you can see GalleryView in action.\"\navatar: https://disqus.com/api/users/avatars/alessandroamatodelmonte.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1400553642000.yml",
    "content": "id: comment-1394849650\ndate: 2014-05-20T02:40:42Z\nupdated: 2014-05-20T02:40:42Z\n_parent: /work/so-simple-jekyll-theme/\nname: Brandon\nurl: ''\nmessage: \"Great theme. I appreciate all the hard work. However, I'm having issues\n  with Open Graph posting the description of pages incorrectly into Facebook. It keeps\n  posting, \\\"A simple and clean responsive Jekyll theme for words and photos,\\\"\\r\\n\\r\\nAll the other OG meta-tags work fine. It is just :\\r\\n\\r\\n`<meta property=\\\"og:description\\\"\n  content=\\\"{% if page.description %}{{ page.description }}{% else %}{{ site.description\n  }}{% endif %}\\\">`\\r\\n\\r\\nthat is the issue. I have changed the description of the\n  index.html file, and I have double checked the files on Amazon S3, where I am hosting,\n  to make sure no old versions of it exist, but it keeps positing the original description.\\r\\n\\r\\nAny\n  thoughts? Could this be because the site is too new and I need to wait for crawls\n  to occur, etc?\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1400554108000.yml",
    "content": "replying_to: '12'\nid: comment-1394856414\ndate: 2014-05-20T02:48:28Z\nupdated: 2014-05-20T02:48:28Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Do you have a link to the page you're trying to share so I can look at\n  the source to troubleshoot?\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1400597874000.yml",
    "content": "replying_to: '12'\nid: comment-1395769744\ndate: 2014-05-20T14:57:54Z\nupdated: 2014-05-20T14:57:54Z\n_parent: /work/so-simple-jekyll-theme/\nname: Brandon\nurl: ''\nmessage: \"Hi Michael,\\r\\n\\r\\nThanks for the response! I think it was a Facebook\n  cache issue. I had originally thought that might be the case, but then when 4.5\n  hours went by and it still wasn't working I began to think it wasn't a cache issue.\n  When I woke up this morning everything was cool. However, when I use Facebook's\n  developer tool for object debugger I am getting an error: Object at URL of type\n  `article` is invalid because the given value `/index.html` for property `og:url`\n  could not be parsed as type `url`. Doesn't appear to be influencing Open Graph behavior,\n  so I think we are all set! Sorry to bug you. Thanks for making such awesome themes!\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1407035174000.yml",
    "content": "id: comment-1523504698\ndate: 2014-08-03T03:06:14Z\nupdated: 2014-08-03T03:06:14Z\n_parent: /work/so-simple-jekyll-theme/\nname: Max Galkin\nurl: http://yacoder.net/\nmessage: \"Hi, Michael. Thanks for this great theme! I'm considering to use Octopress\n  for my blog, they have some extra plugins that I'd like to use, is there a version\n  of your theme for Octopress?\"\navatar: https://disqus.com/api/users/avatars/yacoder.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1407041676000.yml",
    "content": "replying_to: '13'\nid: comment-1523658638\ndate: 2014-08-03T04:54:36Z\nupdated: 2014-08-03T04:54:36Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Currently no.\\r\\n\\r\\nWhen I update So Simple to support some new features\n  in Jekyll 2.x I plan on using the new Octopress gem that makes creating new posts/pages\n  much easier.\\r\\n\\r\\nOnce\n  the [Octopress Ink gem](https://github.com/octopress/ink) is released I may investigate making the theme compatible\n  with it. But for now I'm waiting to see how things shakeout and if there's a demand\n  for it. \"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1409551365000.yml",
    "content": "id: comment-1568359553\ndate: 2014-09-01T06:02:45Z\nupdated: 2014-09-01T06:02:45Z\n_parent: /work/so-simple-jekyll-theme/\nname: aaronchiang\nurl: ''\nmessage: \"Hi, Michael, I got a warning on Jekyll 2.3.0. The `feed.xml` need change\n  the layout from `none` to `null`\"\navatar: https://disqus.com/api/users/avatars/aaronchiang.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1409576060000.yml",
    "content": "replying_to: '14'\nid: comment-1568738800\ndate: 2014-09-01T12:54:20Z\nupdated: 2014-09-01T12:54:20Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You can remove `layout: none` from the YAML Front Matter in `feed.xml` to\n  make the warning go away.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1426887243000.yml",
    "content": "id: comment-1918859404\ndate: 2015-03-20T21:34:03Z\nupdated: 2015-03-20T21:34:03Z\n_parent: /work/so-simple-jekyll-theme/\nname: faiz\nurl: ''\nmessage: \"How can I add categorization of blogs by types like: Arts, poems, tech\n  stuff, science, philosophy, etc?\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1426887793000.yml",
    "content": "replying_to: '15'\nid: comment-1918873513\ndate: 2015-03-20T21:43:13Z\nupdated: 2015-03-20T21:43:13Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You can assign tags to a post in the YAML Front Matter and then sort\n  on those. See the example posts on the demo site to see how I did it.\\r\\n\\r\\nIf you\n  want something more dynamic and automatic you'll need to build or install a Jekyll\n  plugin.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1429121005000.yml",
    "content": "id: comment-1969160248\ndate: 2015-04-15T18:03:25Z\nupdated: 2015-04-15T18:03:25Z\n_parent: /work/so-simple-jekyll-theme/\nname: MrX\nurl: ''\nmessage: \"I'm a Newbie. How can I use it?\"\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1429121818000.yml",
    "content": "replying_to: '16'\nid: comment-1969186238\ndate: 2015-04-15T18:16:58Z\nupdated: 2015-04-15T18:16:58Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Follow the [setup guide](https://mmistakes.github.io/so-simple-theme/theme-setup/).\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1437941442000.yml",
    "content": "id: comment-2158154453\ndate: 2015-07-26T20:10:42Z\nupdated: 2015-07-26T20:10:42Z\n_parent: /work/so-simple-jekyll-theme/\nname: Shobhit Garg\nurl: ''\nmessage: \"Hey!\\r\\n\\r\\nI searched all over the web and decided to go with this theme. It's\n  just awesome.\\r\\n\\r\\nI am planning to launch my blog using this theme.Each post of\n  my blog has different tags like java,programming,algorithm etc. So i want that those\n  should be displayed along with post header or something like that and on clicking\n  on one tag user can visit all the post related to that tag.Can you please guide\n  me how can i achieve this?\\r\\n\\r\\nThanks in advance!\"\navatar: https://disqus.com/api/users/avatars/shobhit4u.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1437963631000.yml",
    "content": "replying_to: '17'\nid: comment-2158574880\ndate: 2015-07-27T02:20:31Z\nupdated: 2015-07-27T02:20:31Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Take a look at the [sample posts](https://github.com/mmistakes/so-simple-theme/tree/master/docs/_posts) in the GitHub repo for the theme. You\n  set the tags for each post in their YAML Front Matter.\\r\\n\\r\\n\n  \\r\\n\\r\\nAnd then on the tags\n  page it groups them [like this](http://mmistakes.github.io/so-simple-theme/tags/). If you want a page for each tag with the related\n  posts listed you'll have to use a Jekyll plugin to do that.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1438174282000.yml",
    "content": "replying_to: '17'\nid: comment-2163091273\ndate: 2015-07-29T12:51:22Z\nupdated: 2015-07-29T12:51:22Z\n_parent: /work/so-simple-jekyll-theme/\nname: Shobhit Garg\nurl: ''\nmessage: \"Thanks Michael!\"\navatar: https://disqus.com/api/users/avatars/shobhit4u.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1438279663000.yml",
    "content": "id: comment-2165581515\ndate: 2015-07-30T18:07:43Z\nupdated: 2015-07-30T18:07:43Z\n_parent: /work/so-simple-jekyll-theme/\nname: Shobhit Garg\nurl: ''\nmessage: \"How can i add google analytics into my blog?\\r\\n\\r\\nI have the tracking ID. I can see there is an option `analytics` in `_config.yml`.\nShould i put my tracking id there?\"\navatar: https://disqus.com/api/users/avatars/shobhit4u.jpg\n"
  },
  {
    "path": "src/_data/comments/so-simple-jekyll-theme/comment-1438279817000.yml",
    "content": "replying_to: '18'\nid: comment-2165586484\ndate: 2015-07-30T18:10:17Z\nupdated: 2015-07-30T18:10:17Z\n_parent: /work/so-simple-jekyll-theme/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Read through the setup guide, it's all explained there.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/starting-young/comment-1394230607000.yml",
    "content": "id: comment-1275760654\ndate: 2014-03-07T22:16:47Z\nupdated: 2014-03-07T22:16:47Z\n_parent: /articles/starting-young/\nname: Wendy Rose\nurl: https://2littlerosebuds.com/\nmessage: \"Aww! Way to do this when I was in the shower, turd.\"\navatar: https://disqus.com/api/users/avatars/veganwendy.jpg\n"
  },
  {
    "path": "src/_data/comments/static-files/comment-1501076534924.yml",
    "content": "_id: 3ba2a870-7208-11e7-a45a-3114f0323905\n_parent: /til/static-files/\nmessage: \"This is great! Thanks for share.\\r\\nI assumed that the \\\"assets\\\" folder is into jekyll site.\\r\\nBut, what happend if you have a folder outside?\\r\\nI mean\\r\\n├── folder/\\r\\n├── docs/\\r\\n            ├── _config.yml\\r\\n\\r\\nAnd you want to retrieve that folder content?\"\nname: SidV\nemail: e1315801f35b6c3a3f24ae690546f64d\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-07-26T13:42:14.923Z'\n"
  },
  {
    "path": "src/_data/comments/static-files/comment-1501079498159.yml",
    "content": "_id: 21d543b0-720f-11e7-a45a-3114f0323905\n_parent: /til/static-files/\nmessage: \"Don't think that's possible. GitHub Pages is treating the `docs/` folder as its own contained Jekyll project and therefore can't look outside of it.\\r\\n\\r\\nOnly option I can think of is to get crafty with [Git submodules](https://help.github.com/articles/using-submodules-with-pages/) and pull in outside content.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '1'\nhidden: ''\ndate: '2017-07-26T14:31:38.158Z'\n"
  },
  {
    "path": "src/_data/comments/styling-language-specific-code-blocks/comment-1529428168932.yml",
    "content": "_id: 866a1630-73e3-11e8-b970-9b3e102e0cbc\n_parent: /til/styling-language-specific-code-blocks/\nname: Manuel Monterosso\nemail: 48c0388b19d5d81759a17612f840dbdd\nurl: 'https://kualiti.net'\nmessage: >-\n  Great job! Can you give me the color variables for this snippet? As I don't\n  seem to find them anywhere ^^\nreplying_to: ''\ndate: '2018-06-19T17:09:28.931Z'\n"
  },
  {
    "path": "src/_data/comments/styling-language-specific-code-blocks/comment-1529431155141.yml",
    "content": "_id: 7a4e8d70-73ea-11e8-a09e-3391f6efd755\n_parent: /til/styling-language-specific-code-blocks/\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nmessage: \"SCSS variables can be found in the source code for this site.\\r\\n\\r\\n[./src/assets/stylesheets/_variables.scss](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/assets/stylesheets/_variables.scss#L51-L95)\"\nreplying_to: '1'\ndate: '2018-06-19T17:59:15.138Z'\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1467572586000.yml",
    "content": "id: comment-2763632614\ndate: 2016-07-03T19:03:06Z\nupdated: 2016-07-03T19:03:06Z\n_parent: /mastering-paper/switching-tools/\nname: Mikef2007\nurl: ''\nmessage: \"How do I type on a picture I've imported?\"\navatar: https://disqus.com/api/users/avatars/Mikef2007.jpg\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1467589181000.yml",
    "content": "replying_to: '1'\nid: comment-2763958767\ndate: 2016-07-03T23:39:41Z\nupdated: 2016-07-03T23:39:41Z\n_parent: /mastering-paper/switching-tools/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You can't add text directly on top of images you import. You can only\n  [add text as note](https://support.fiftythree.com/hc/en-us/articles/201592322-Basic-Features#create-notes) below them.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1481814504362.yml",
    "content": "_id: 52c53840-c2d8-11e6-bf56-ddf23f626f89\n_parent: /mastering-paper/switching-tools/\nmessage: >-\n  Can I save my work as 300dpi so it is printable in Paper53? My iPad is old, I\n  can't get Photoshop, Procreate keeps popping off my screen. I'm trying to find\n  an app that will let me save as 300 dpi. HELP!\nemail: e3bd2a466add75b3bc893a9b41f1e14b\nname: Carroll Durodola\nurl: ''\nhidden: ''\ndate: '2016-12-15T15:08:24.335Z'\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1481941020093.yml",
    "content": "_id: e40bd8f0-c3fe-11e6-8d8b-df1271861d9a\n_parent: /mastering-paper/switching-tools/\nreplying_to: '2'\nmessage: \"When you export Paper ideas to your camera roll they're saved at the same resolution as your iPad's screen --- which varies on what model you have (Pro 12\\\", Air, Mini, etc.)\\r\\n\\r\\nThey also come out at 72 dpi I believe, so you'd need an app that can resample it to 300. On my Air 2 images are `2048 x 1536` which @ 300 dpi comes out to be 6.827 x 5.12 inches... more than enough to print a 4 x 6.\\r\\n\\r\\nYou can certainly go larger, but there will likely be some image quality loss. I had one of [my drawings blown up](https://mademistakes.com/paperfaces/luke-skywalker-cave-portrait/) and printed at 40\\\" wide and it looks fine. It really depends on the image though.\"\nemail: 1ce71bc10b86565464b612093d89707e\nname: Michael Rose\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-12-17T02:17:00.089Z'\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1506997770265.yml",
    "content": "_id: aedfcec0-a7e2-11e7-8704-5b582ac668d2\n_parent: /mastering-paper/switching-tools/\nmessage: >-\n  Is there a way to widen the width of the pencil or brush or? And do you have a\n  stylus you recommend?\nname: Cheryl\nemail: 2aaee6e84eeae17b949fc33976219d3c\nurl: 'http://www.cherylholz.com'\nreplying_to: ''\nhidden: ''\ndate: '2017-10-03T02:29:30.257Z'\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1507028659960.yml",
    "content": "_id: 9a9a3660-a82a-11e7-8704-5b582ac668d2\n_parent: /mastering-paper/switching-tools/\nmessage: \"Yes you can change the width of the tools by either using styli that are pressure sensitive like Apple Pencil, or [varying the speed](https://mademistakes.com/mastering-paper/introduction-tool-guide/) at width you draw/paint.\\r\\n\\r\\nHere are all the [styli I've used](https://mademistakes.com/faqs/stylus-recommendations/) and my thoughts on them. If you have an iPad Pro I'd recommend Apple Pencil.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '3'\nhidden: ''\ndate: '2017-10-03T11:04:19.958Z'\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1513644933497.yml",
    "content": "_id: 50ee9470-e457-11e7-8b3a-bb1b96b9aa20\n_parent: /mastering-paper/switching-tools/\nmessage: How do I import a picture from photo library and edit and email it..?\nname: Robin Baron\nemail: adf797a8ef1093fa0ee9ca2f380d3052\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-12-19T00:55:33.495Z'\ntimestamp: 1513644933\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1513799890769.yml",
    "content": "_id: 1a9c4560-e5c0-11e7-aeb5-89cc147db7e9\n_parent: /mastering-paper/switching-tools/\nmessage: \"There is a new tool to the far right of the color wheel (you may need to swipe the tools to reveal it) called **Canvas**. Tap that and you can import a photo onto the canvas or use one of the included templates.\\r\\n\\r\\nFor additional reference see [FiftyThree's support site](https://support.fiftythree.com/hc/en-us/articles/203385492-Canvas-Drawing-Tools#canvas-roll).\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '4'\nhidden: ''\ndate: '2017-12-20T19:58:10.768Z'\n"
  },
  {
    "path": "src/_data/comments/switching-tools/comment-1537523000100.yml",
    "content": "_id: c5bfa730-bd82-11e8-8d8b-834384c9d56e\n_parent: /mastering-paper/switching-tools/\nname: susan hogan\nemail: e87644eea15f0581edeb7e6cfdb2914a\nurl: ''\nmessage: Do you have a book or compilation of these tutorials that I can buy?\nreplying_to: ''\ndate: '2018-09-21T09:43:20.099Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1456173274000.yml",
    "content": "id: comment-2529382727\ndate: 2016-02-22T20:34:34Z\nupdated: 2016-02-22T20:34:34Z\n_parent: /articles/using-jekyll-2016/\nname: jan van iperen\nurl: http://ipears.com/\nmessage: \"Man, you are truly a treasure in the Jekyll world and more people should\n  follow in your footsteps... to learn and to further leverage the possibilities of\n  Jekyll. For me inspiration to redesign and recode my sites... probably with Skinny\n  Bones. Thanks for all your efforts and mostly for the detail and passion that is\n  always found in your code.\"\navatar: https://disqus.com/api/users/avatars/ipears.jpg\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1456173679000.yml",
    "content": "id: comment-2529395804\nreplying_to: '1'\ndate: 2016-02-22T20:41:19Z\nupdated: 2016-02-22T20:41:19Z\n_parent: /articles/using-jekyll-2016/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"Thanks sir! Just trying to return the sentiments I've picked up from\n  others in the Jekyll and the open source communities.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1456359857000.yml",
    "content": "id: comment-2533714378\ndate: 2016-02-25T00:24:17Z\nupdated: 2016-02-25T00:24:17Z\n_parent: /articles/using-jekyll-2016/\nname: Chrisanthropic\nurl: http://www.chrisanthropic.com/\nmessage: \"Thanks for the awesome write-up! I used your themes as reference a lot\n  when I was creating my own - yours were (and still are) some of the most complete\n  and best documented out there.\\r\\n\\r\\nRegarding images, I use a slightly customized\n  version of the jekyll-minimagick plugin to automatically generate multiple sizes\n  of my images (thumb & small) for my webcomic theme. It sounds like it would\n  do most of what you want.\"\navatar: https://disqus.com/api/users/avatars/Chrisanthropic.jpg\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1457539295000.yml",
    "content": "id: comment-2559978290\ndate: 2016-03-09T16:01:35Z\nupdated: 2016-03-09T16:01:35Z\n_parent: /articles/using-jekyll-2016/\nname: Paolo Perego\nurl: http://armoredcode.com/\nmessage: \"You just made me to understand that I had to learn a lot in order to\n  use Jekyll on all its power. Thanks\"\navatar: https://disqus.com/api/users/avatars/thesp0nge.jpg\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1457544717000.yml",
    "content": "id: comment-2560158057\nreplying_to: '3'\ndate: 2016-03-09T17:31:57Z\nupdated: 2016-03-09T17:31:57Z\n_parent: /articles/using-jekyll-2016/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I've found there isn't much to learn with Jekyll per say as there is\n  with keeping up with modern web development tooling and trends.\\r\\n\\r\\nSince Jekyll\n  does a good job of getting out of your way it leaves you with a blank canvas to\n  do whatever you want in terms of markup, styling, scripting, etc. That's were the\n  real learning takes place.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1459780880000.yml",
    "content": "id: comment-2605370340\ndate: 2016-04-04T14:41:20Z\nupdated: 2016-04-04T14:41:20Z\n_parent: /articles/using-jekyll-2016/\nname: Jens Stavnstrup\nurl: ''\nmessage: \"Really enjoy your comprehensive Jekyll posts. I am very much looking\n  forward to an updated styleguide using atomic design :).\"\navatar: https://disqus.com/api/users/avatars/jensstavnstrup.jpg\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1462321842000.yml",
    "content": "id: comment-2656798750\ndate: 2016-05-04T00:30:42Z\nupdated: 2016-05-04T00:30:42Z\n_parent: /articles/using-jekyll-2016/\nname: Ricardo N Feliciano\nurl: https://feliciano.tech/\nmessage: \"Lots of info in one post. Great job.\"\navatar: https://disqus.com/api/users/avatars/FelicianoTech.jpg\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1465717020000.yml",
    "content": "id: comment-2726029067\ndate: 2016-06-12T07:37:00Z\nupdated: 2016-06-12T07:37:00Z\n_parent: /articles/using-jekyll-2016/\nname: AzureYu\nurl:\nmessage: \"Learned a lot. Thanks~\"\navatar: https://disqus.com/api/users/avatars/Yogayu.jpg\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1470948072000.yml",
    "content": "id: comment-2832854279\ndate: 2016-08-11T20:41:12Z\nupdated: 2016-08-11T20:41:12Z\n_parent: /articles/using-jekyll-2016/\nname: Antonio Ulloa\nurl: # http://antonio.ulloa.mx/\nmessage: \"Great post thank you!\"\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1471971078169.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nmessage: 'This is such a great resource, thanks for the thorough post!'\nname: Anne T\nemail: d8dcd74f3145b59d2f9894e6e33f3cdf\nurl: 'https://savaslabs.com'\nhidden: ''\ndate: '2016-08-23T16:51:17.412Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1472328172720.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nmessage: >-\n  Long and good article. Would you write something like a guide (more concise)\n  how you setup jekyll and configure it the way you use it?\nname: Jason\nemail: 269828e5344e26547024218213c99c51\nurl: ''\nhidden: ''\ndate: '2016-08-27T20:02:52.038Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1474985907795.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nmessage: \"Very useful article. Been using Jekyll for a couple of months now. I'm already using a number of the suggestions here such as the `compress.html` layout. The liquid template profiling looks like it would be a great help.\\r\\n\\r\\nOn my own site I've implemented [client based search](https://s-knibbs.github.io/blog/2016/08/12/implementing-client-based-search-for-static-site/) functionality to avoid using a service such as Google Custom Search.\"\nname: Simon Knibbs\nemail: 127806b2a9b782e2a064a4de15e4b715\nurl: 'https://s-knibbs.github.io/'\nhidden: ''\ndate: '2016-09-27T14:18:27.036Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1477648425453.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nmessage: \"Hi Michael.\\r\\n\\r\\nNice  article. But I've come to expect that from you. I've visited your site a few times. You've got Jekyll-y-goodness. Thanks. But this time I have a complaint. Yes.  You know what's about. It is about your latest \\\"theme\\\". I use \\\"theme\\\" loosely. Actually, it's not bad overall. But there is one horrendous element. You know what it is, don't you? But I am still going to say it. **For the love all things warm and fuzzy, please, Please, PLEASE ditch the linear gradients in the side column!!!** There.  I said it. I feel better. Like after a big pooh. Oh, what's that? Don't want long, weird comments like this, eh? Fair enough. Then don't assault our eyes. Tit for tat really. I look forward to not seeing those gradients. Ever. Unless I need to torture someone. Then I would use them. But I'd only do that for a good reason. A really good reason actually. Like to get nuclear shut down codes. Or stop the release of human-destroying virus. Or on people who use gradients like this. Thanks again, Michael. [Feel free to delete. Just laugh ... sort of. But seriously, ditch those diagonal gradients.]\"\nname: Tim\nemail: 87e0bf84b76f1e38956a7254f7d27f97\nurl: ''\nhidden: ''\ndate: '2016-10-28T09:53:44.774Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1477653386098.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nreplying_to: '11'\nmessage: >-\n  @Tim - Bummer. Guess I'll have to put the brakes on `epileptic-seizure-mode` and not animate the lines. :wink:\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-10-28T11:16:25.448Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1477876188317.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nmessage: \"I really enjoyed reading your post, it has brought up issues that I should address earlier rather than later. I still have some time as I currently have only about 64 blog posts and takes about 2 seconds to generate. So, it is nowhere near the amount of posts (and build time) as yours.\\r\\n\\r\\nThe idea of the **You May Also Enjoy** module to provide readers with related content sounds great. And also featured posts. I'll be sure to add and try them out. Hopefully they won't slow the build times too much...\\r\\n\\r\\nThe point about having multiple `index.html` for different pages is spot-on, as I am someone who currently has that haha. It gets annoying pretty fast and will be taking your advice on using a `_pages/` directory to store those pages.\\r\\n\\r\\nI'm also looking into bumping my page speed from 67/100 to hopefully, 90s or high 90s such as yours.\\r\\n\\r\\nAlso didn't know about `_data/`, so similar to what you said, I was dumping most of my data into my config file... I suppose I haven't been utilizing YAML to its full extent. I have head, header, footer, foot HTML template files, but I feel your approach to using Liquid templates iterating through data objects would not only scale much nicer but feel more robust.\\r\\n\\r\\nOnce again, thank you for all the great tips and I look forward to reading more of your posts!\"\nname: Derek Liang\nemail: e7164709c692c2bcb2754d8c17cf7843\nurl: 'http://www.derekliang.com'\nhidden: ''\ndate: '2016-10-31T01:09:47.696Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1477882463696.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nreplying_to: '12'\nmessage: \"@Derek - The biggest impact on optimizing page speed for me was serving images responsibly and responsively where I could. That and making sure CSS and JS weren't blocking the rendering of each page, which meant inlining the critical bits into the  `<head>` element and using loadCSS to async the rest.\\r\\n\\r\\n2 seconds isn't bad at all for a build time. If you do see things slowing down here's a couple of bottlenecks I've discovered with large Jekyll sites:\\r\\n\\r\\n1. `for` loops. Try to limit them as they can really slow things down.\\r\\n2. Images and other large assets can become an IO issue since Jekyll copies all of them to the `_site` folder on each build. I've started using Gulp to do the copying and caching for me to avoid moving 1GB of images each build, which helped speed up things considerably.\\r\\n3. Using related posts with `lsi` enabled, while useful in displaying relevant content to improve user engagement, has a high cost on build times.\\r\\n\\r\\nI did some [rough build tests](https://github.com/mmistakes/made-mistakes-jekyll/issues/49) to get an idea of what was slowing things down for me. They're not all that scientific (ran each 3 times and averaged), but might give you some ideas if you're curious. The operating system and build of your computer also factor in. Found that macOS with an SSD performed slightly faster than a Windows PC with SSD.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-10-31T02:54:23.027Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1478819325223.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nmessage: 'wow, thank you. learned a few new tricks'\nname: sherwin\nemail: 1a96cca177e6475025e05183cd60bc45\nhidden: ''\ndate: '2016-11-10T23:08:44.535Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1478882631813.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nmessage: >-\n  Holy hell I'm trying to read this article but the sidebar on the right is\n  melting my eyes/brain.  I appreciate the article but ow.  Ow. Ow.  Ow.\nname: Weston Wedding\nemail: 6629ad919c2e57d0a4eeba06885fdc0f\nhidden: ''\ndate: '2016-11-11T16:43:51.123Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1479107988971.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nreplying_to: '11'\nmessage: \"@Michael - \\\"`eliptical-seizure-mode`\\\" - yes. Please don't!\\r\\n\\r\\n...and yet the seizure-indicuing diagonal lines are still there ...\\r\\n\\r\\n...you're just enjoying this now!\\r\\n[twitch twitch]\"\nname: Tim\nemail: 87e0bf84b76f1e38956a7254f7d27f97\nhidden: ''\ndate: '2016-11-14T07:19:48.255Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1479124935027.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nreplying_to: '11'\nmessage: '''Tis the season for candy canes.'\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2016-11-14T12:02:14.351Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1479614551877.yml",
    "content": "_parent: /articles/using-jekyll-2016/\nreplying_to: '11'\n_id: 28eddb50-aed6-11e6-a21c-d160c97c0fbf\nmessage: \"@Michael - THANK YOU for getting rid of those seizure-inducing diagonal lines.\\r\\nIt's like an early Christmas present.\\r\\n[And thanks for all your cool help in the jekyll community too.]\"\nname: Tim\nemail: 87e0bf84b76f1e38956a7254f7d27f97\nhidden: ''\ndate: '2016-11-20T04:02:31.869Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1480254831825.yml",
    "content": "_parent: /articles/using-jekyll-2016/\n_id: ed7bfc90-b4a8-11e6-b9c5-4f639f9a8f91\nmessage: \"Many many thanks\\r\\n\\r\\nThis article is really a \\\"goldmine\\\", I learn a ton of new things I now have to try ;-) \\r\\n\\r\\nKindest regards, From France, \\r\\nRudy\"\nname: Rudy D.\nemail: 3c3a306ca39ef598678403d4168273ef\nhidden: ''\ndate: '2016-11-27T13:53:51.816Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1482736520075.yml",
    "content": "_id: 0f01bd20-cb3b-11e6-802d-8bd3c870d542\n_parent: /articles/using-jekyll-2016/\nmessage: 'Thank you for this article, I''m waiting for the 2017 version ;)'\nemail: 81afaf4fdf3d384e6b1c209b84b6de9e\nname: r. ricco\nurl: ''\nhidden: ''\ndate: '2016-12-26T07:15:20.074Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1483032133577.yml",
    "content": "_id: 5666dfd0-cdeb-11e6-9ccb-5be4dff27bba\n_parent: /articles/using-jekyll-2016/\nreplying_to: '16'\nmessage: >-\n  Stay tuned :smile:, the 2017 version is going to go a little something like\n  Gulp + Jekyll + Travis CI = testing and auto deploy nirvana.\nemail: 1ce71bc10b86565464b612093d89707e\nname: Michael Rose\nurl: 'https://mademistakes.com'\nhidden: ''\ndate: '2016-12-29T17:22:13.577Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1487186769933.yml",
    "content": "_id: 9a88fab0-f3b4-11e6-9423-0b1977e996ac\n_parent: /articles/using-jekyll-2016/\nmessage: \"hey michael,\\r\\n\\r\\nis your \\\"Overview\\\"-menu based on javascript? \\r\\nOr maybe you have a(n) reference/article about it?\\r\\n\\r\\nps: just started, but is going to be filled with static data soon: www.bastogrande.de\"\nname: basti\nemail: 3fa4557fab828d9b65aa6a2327a822cb\nhidden: ''\ndate: '2017-02-15T19:26:09.900Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1487198510540.yml",
    "content": "_id: f0844940-f3cf-11e6-a7b5-a7b34de01859\n_parent: /articles/using-jekyll-2016/\nreplying_to: '17'\nmessage: \"It's pure CSS using the \\\"[checkbox hack](https://css-tricks.com/the-checkbox-hack/).\\\"\\r\\n\\r\\nYou can find the [source here](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/assets/stylesheets/_toc.scss).\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-02-15T22:41:50.529Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1488193553159.yml",
    "content": "_id: b4351080-fcdc-11e6-8443-11b8fd05dc21\n_parent: /articles/using-jekyll-2016/\nmessage: Thanks for great article. It helps a lot.\nname: David Johnston\nemail: fa49ac109bd4d9cd542cdfb4769b4f60\nhidden: ''\ndate: '2017-02-27T11:05:53.155Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1488693925938.yml",
    "content": "_id: b9ab13c0-0169-11e7-8955-d9833ab44557\n_parent: /articles/using-jekyll-2016/\nmessage: \"The problem as I see it is that when Jekyll started - you could simply install it on any OS and create some markdown and have your website.\\r\\n\\r\\n99.999% of what you've described on this page goes deeeeep into internals and configurations and stuff which are utterly undocumented and not for anyone who hasn't spent the past decade doing complex web development.\\r\\n\\r\\nJekyll really has shot itself in the foot with this stuff.\"\nname: Cody\nemail: c510febb9bed68b5cc4a09f076701e0f\nhidden: ''\ndate: '2017-03-05T06:05:25.933Z'\ntimestamp: 1488693925\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1488728466677.yml",
    "content": "_id: 257ccc10-01ba-11e7-8955-d9833ab44557\n_parent: /articles/using-jekyll-2016/\nreplying_to: '19'\nmessage: \"I agree a good chunk of this is really taking a deep dive into web development territory (asset management, critical path CSS, etc.), but you can't blame Jekyll for that. It makes absolutely no claims to support or do any of that out of the box. If anything it's a testament to its flexibility that it can be used in whatever way you want.\\r\\n\\r\\nIn the end Jekyll still takes your Markdown files and spits out `.html` files, nothing has changed there. About the only thing not really documented is the whole `_pages` thing. But the [liquid profiler](http://jekyllrb.com/docs/configuration/), [collections](http://jekyllrb.com/docs/collections/), [`_data` files](http://jekyllrb.com/docs/datafiles/), etc. all are if you take the time to dig into the documentation. I don't think it's fair to expect Jekyll to prescribe every way you can use these to build a site or app. \\r\\n\\r\\nThe way I'm using these features isn't necessarily how you or anyone else might want to. It's completely optional, which is one of the reasons I keep coming back to Jekyll to solve problems. It's not just a blog generator...\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nhidden: ''\ndate: '2017-03-05T15:41:06.676Z'\ntimestamp: 1488728466\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1489380756760.yml",
    "content": "_id: e0994250-07a8-11e7-9207-01a5b35c40b5\n_parent: /articles/using-jekyll-2016/\nreplying_to: '2'\nmessage: 'So, is this site run on Jekyll too?'\nname: ortonomy\nemail: 1034da1eeae914900d9bd3d4ff79a247\nurl: ''\nhidden: ''\ndate: '2017-03-13T04:52:36.756Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1490718393006.yml",
    "content": "_id: 4deb1a50-13d3-11e7-a79e-7d9f47323e85\n_parent: /articles/using-jekyll-2016/\nmessage: >-\n  It's 2017 now and I've been using Jekyll heavily for quite some time and using\n  gulp (I even did some builds with webpack) but I'm really excited to see your\n  deployment write-up and Travis CI.  Recently deployed with [this](https://jekyllrb.com/docs/deployment-methods/#step-2-set-up-certificate-based-ssh-access-server-side)\n  method and it worked but it basically caused a -rm -rf to my entire server\n  because I fired my script at $HOME and that was a very bad day, so make sure\n  you are specific when guiding people in these steps hah.\nname: JamesCW\nemail: 671033f17f6f041a753e04579c39da89\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-03-28T16:26:33.002Z'\ntimestamp: 1490718393\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1490725506574.yml",
    "content": "_id: de00fc80-13e3-11e7-a79e-7d9f47323e85\n_parent: /articles/using-jekyll-2016/\nmessage: \"Until I get the time to write things up officially take a look at my [Gulp tasks](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/gulp/tasks). They do all of the heavy lifting.\\r\\n\\r\\nI basically use Travis CI to fire up Gulp to build the site, once that finishes it starts a [deploy Gulp task](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/gulp/tasks/uploading.js) which uses [gulp-rsync](https://github.com/jerrysu/gulp-rsync) to transfer everything.\\r\\n\\r\\nThere's a whole mess of options which you can set. You have to specifically use the `--delete` flag if you want to delete extraneous files from destination dirs. Which is nice since it gets around the issue you encountered above. It also has `--dry-run` which is good for testing.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '20'\nhidden: ''\ndate: '2017-03-28T18:25:06.574Z'\ntimestamp: 1490725506\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1499455795259.yml",
    "content": "_id: a776cd00-634a-11e7-a4ce-e58b60706e25\n_parent: /articles/using-jekyll-2016/\nmessage: Thanks so much for posting this! I am starting jekyll and this is so useful\nname: Katherine\nemail: fedcaa357fc398f933b21e1f93c214ea\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-07-07T19:29:55.257Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1506546037079.yml",
    "content": "_id: e8e7ffe0-a3c6-11e7-adb3-e700074bdbd8\n_parent: /articles/using-jekyll-2016/\nmessage: \"Your documentation of Minimal Mistakes is awesome - thank you! Ditto for all your blog posts here.\\r\\n\\r\\nQuestion - I'm looking into how to similarly install a comment counter at the top of posts. Do you have any blog posts or issues/PRs documenting more detail about how you've done that?\"\nname: D\nemail: 1a8191359600fec7fc58f6d28828d1bf\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-09-27T21:00:37.076Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2016/comment-1506553327824.yml",
    "content": "_id: e2511430-a3d7-11e7-adb3-e700074bdbd8\n_parent: /articles/using-jekyll-2016/\nmessage: \"No posts about how I'm doing it, but it's pretty easy to do if you're using Staticman to power your site's comments.\\r\\n\\r\\nBecause all my comments are stored in `.yml` files in the `_data` folder you can use the Liquid [`size` array filter](https://help.shopify.com/themes/liquid/filters/array-filters#size) to determine how many comments are in a particular post.\\r\\n\\r\\nIf you examine the [source of my site](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_includes/page-intro.html#L43-L45) you'll see this line which does just this:\\r\\n\\r\\n```liquid\\r\\n{% raw %}{{ site.data.comments[page.slug] | size }} Comment{% if site.data.comments[page.slug].size > 1 %}s{% endif %}{% endraw %}\\r\\n```\\r\\n\\r\\nOn [post listings](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_includes/entry.html#L39-L41) that loop over `site.posts` I modify it slightly to pull in `post.slug` instead of `page.slug` so it can grab the correct set of comments to count.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '22'\nhidden: ''\ndate: '2017-09-27T23:02:07.823Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1507012075364.yml",
    "content": "_id: fd204c10-a803-11e7-8704-5b582ac668d2\n_parent: /articles/using-jekyll-2017/\nmessage: 'It would be great if you created a Jekyll starter kit and open sourced it :)'\nname: Chris Howell\nemail: a5a8f22041d1996d0a684fe02151753d\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-10-03T06:27:55.362Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1507729840090.yml",
    "content": "_id: 2a83d720-ae8b-11e7-b706-e1215ec2d68d\n_parent: /articles/using-jekyll-2017/\nmessage: >-\n  Wow, cool that you took inspiration from my generator! Sadly it's fallen a bit\n  on the wayside on my way to updating it to Webpack and whatnot. It's on my\n  todo list, but it's been a while and the JS community moves so quickly that I\n  have no idea where to start.\nname: Sondre Nilsen\nemail: afa3a1cd3b5ee66ff2772ed473644ec2\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-10-11T13:50:40.088Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1509502007119.yml",
    "content": "_id: 505ca9d0-bea9-11e7-9c26-335bfbd926db\n_parent: /articles/using-jekyll-2017/\nmessage: >-\n  A lot of the thought process you have here are things I'm incorporating into\n  my personal site's rebuild. Thanks for the detail!\nname: Jacky\nemail: 4abe121cada34b52a2d7f2935ae1a3a6\nurl: 'https://jacky.wtf'\nreplying_to: ''\nhidden: ''\ndate: '2017-11-01T02:06:47.112Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1511543323906.yml",
    "content": "_id: 1ffde210-d13a-11e7-997a-9951f42f680c\n_parent: /articles/using-jekyll-2017/\nmessage: Great write-up! Thanks for all this insights.\nname: Arthur Freitas\nemail: 28236114af9c8a4d15c3d878e0de5f82\nurl: 'https://arthr.me/'\nreplying_to: ''\nhidden: ''\ndate: '2017-11-24T17:08:43.905Z'\nlayout: verslag\nexcerpt_separator: <!--more-->\ndraft: true\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1511553630734.yml",
    "content": "_id: 1eff9800-d152-11e7-8079-e9a63ed03f59\n_parent: /articles/using-jekyll-2017/\nmessage: How do you tresspass the CORS message error in your comments?\nname: Esporo\nemail: 5aaa0188add2271ef84a3cc0ed32a83c\nurl: ''\nreplying_to: ''\nhidden: ''\ndate: '2017-11-24T20:00:30.734Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1524912555802.yml",
    "content": "_id: cb0123f0-4ad1-11e8-9d89-87f59e4b29ef\n_parent: /articles/using-jekyll-2017/\nmessage: Great article\nname: Jon\nemail: add550ca15e07b02aa54939b02b79ace\nurl: ''\nreplying_to: ''\ndate: '2018-04-28T10:49:15.801Z'\npageless: true\ntemplateKey: comments\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1528407001776.yml",
    "content": "_id: ef472d80-6a99-11e8-9030-fbc557955408\n_parent: /articles/using-jekyll-2017/\nmessage: >-\n  I would like to use jekyll-paginate-v2, but still can't use that plugin on\n  gh-pages. :(\nname: bekti\nemail: aab48e6b304c0af442701e5ba34198c0\nurl: 'https://bekti.net'\nreplying_to: ''\ndate: '2018-06-07T21:30:01.774Z'\ntimestamp: 1528407001\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1528472466107.yml",
    "content": "_id: 5b148b50-6b32-11e8-b74f-8d18c6d689d3\n_parent: /articles/using-jekyll-2017/\nmessage: \"Why not [use Netlify instead](https://www.netlify.com/blog/2017/05/11/migrating-your-jekyll-site-to-netlify/)? They offer everything hosting with GitHub Pages does (free hosting, etc.) and more like being able to use whatever Jekyll plugins you want.\\r\\n\\r\\nYou can still continue to keep your repo on GitHub. All that's really needed is to add a Netlify config file and setup an account and in most cases you're good to go.\"\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nreplying_to: '7'\ndate: '2018-06-08T15:41:06.106Z'\ntimestamp: 1528472466\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1529069230477.yml",
    "content": "_id: ce773530-709f-11e8-b0fb-f39dc3e2d59d\n_parent: /articles/using-jekyll-2017/\nname: Alastair Cox\nemail: 4ee7c1a08019673657dd5be6d0bd1b7c\nurl: ''\nmessage: >-\n  Cool article. Finally moving on to building bigger sites with Jekyll so always\n  good to read the lessons of others who got there first.\nreplying_to: ''\ndate: '2018-06-15T13:27:10.477Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1533307031563.yml",
    "content": "_id: b4c26720-972a-11e8-8b4d-27ecd4f7397d\n_parent: /articles/using-jekyll-2017/\nname: Mike Jordan\nemail: cf0d7e5f61f5c9e76818d89be4a0e57f\nurl: ''\nmessage: This makes me want to use Jekyll. Thanks mate.\nreplying_to: ''\ndate: '2018-08-03T14:37:11.563Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1535983368087.yml",
    "content": "_id: 099acf70-af82-11e8-8da0-ff3fea61d47c\n_parent: /articles/using-jekyll-2017/\nname: Beau\nemail: dadf8ed7d259f6e076539cd338dbab0e\nurl: 'http://beauhilton.com/'\nmessage: >-\n  Drew Silcock wrote [a post on how to integrate custom plugins with\n  gh-pages](https://drewsilcock.co.uk/custom-jekyll-plugins). He uses branching\n  and a nice little script to automate things. Might be worth a look.\nreplying_to: '7'\ndate: '2018-09-03T14:02:48.086Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1538453831567.yml",
    "content": "_id: 088e4ec0-c5fa-11e8-a3e5-1590186c2f0d\n_parent: /articles/using-jekyll-2017/\nname: Kulbhushan Chand\nemail: 1718d1928bbcd0938ba7a621e68e5d39\nurl: 'https://kulbhushan-chand.github.io'\nmessage: >-\n  Very informative article. Is it possible to follow your path but, use only npm\n  packages instead of gulp?\nreplying_to: ''\ndate: '2018-10-02T04:17:11.566Z'\n"
  },
  {
    "path": "src/_data/comments/using-jekyll-2017/comment-1538482151295.yml",
    "content": "_id: f86ccc50-c63b-11e8-a3e5-1590186c2f0d\n_parent: /articles/using-jekyll-2017/\nname: Michael Rose\nemail: 1ce71bc10b86565464b612093d89707e\nurl: 'https://mademistakes.com'\nmessage: >-\n  Sure it's possible, it's all just JavaScript. So if you're comfortable writing\n  it, it could be done.\nreplying_to: '10'\ndate: '2018-10-02T12:09:11.295Z'\n"
  },
  {
    "path": "src/_data/comments/watercolor-brush-update/comment-1410929331000.yml",
    "content": "id: comment-1592631835\ndate: 2014-09-17T04:48:51Z\nupdated: 2014-09-17T04:48:51Z\n_parent: /mastering-paper/watercolor-brush-update/\nname: Cici\nurl: ''\nmessage: \"Great post, Ty\"\navatar: https://disqus.com/api/users/avatars/disqus_v8vpl17TAn.jpg\n"
  },
  {
    "path": "src/_data/comments/watercolor-brush-update/comment-1411401026000.yml",
    "content": "replying_to: '1'\nid: comment-1600514089\ndate: 2014-09-22T15:50:26Z\nupdated: 2014-09-22T15:50:26Z\n_parent: /mastering-paper/watercolor-brush-update/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"You're welcome Cici.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/website-tools/comment-1456305172000.yml",
    "content": "id: 2534032537\ndate: '2016-02-25T04:12:52'\nupdated: ''\n_parent: /faqs/website-tools/\nname: Anton\nurl: http://likewhoa.ru\nmessage: \"Thank you for your articles! I'm really curious: why don't you use GitHub pages as hosting spot?\"\navatar: https://disqus.com/api/users/avatars/antonwhoa.jpg\n"
  },
  {
    "path": "src/_data/comments/website-tools/comment-1456306928000.yml",
    "content": "replying_to: '1'\nid: 2534060727\ndate: '2016-02-25T04:42:08'\nupdated: ''\n_parent: /faqs/website-tools/\nname: Michael Rose\nurl: https://mademistakes.com/\nmessage: \"I like having the extra control over the server. There are some things you just can't do when you host with GH Pages.\"\nemail: 1ce71bc10b86565464b612093d89707e\n"
  },
  {
    "path": "src/_data/comments/website-tools/comment-1456338618000.yml",
    "content": "replying_to: '1'\nid: comment-2534548940\ndate: '2016-02-25T13:30:18'\nupdated: ''\n_parent: /faqs/website-tools/\nname: Anton\nurl: http://likewhoa.ru\nmessage: \"I see. But nothing wrong with it? Kind a SEO or indexing issues? Since I don't need any special control, is it okay to host a website on gh pages? Really appreciate your advice.\"\navatar: https://disqus.com/api/users/avatars/antonwhoa.jpg\n"
  },
  {
    "path": "src/_data/comments/website-tools/comment-1477781723006.yml",
    "content": "_parent: /faqs/website-tools/\nmessage: >-\n  Anton, you can't use most Jekyll plugins when you use GH Pages. However, if\n  you're willing to rig your repository to use [Travis CI](https://travis-ci.org/)\n  to build on push, you can configure Travis to deploy to free static hosts like\n  [Surge](https://surge.sh) or Amazon S3.\nname: Matthew Graybosch\nemail: 120f08e04890c583cbc543ed3ae0e4d8\nurl: 'https://matthewgraybosch.com'\nhidden: ''\ndate: '2016-10-29T22:55:22.370Z'\n"
  },
  {
    "path": "src/_data/slugs.yml",
    "content": "# slugs\n\narticles:\n  name: \"Blog articles\"\n\nnotes:\n  name: \"Notes\"\n\nmastering-paper:\n  name: \"Mastering Paper for iOS\"\n\npaperfaces:\n  name: \"PaperFaces portraits\"\n\nprocreate-paintings:\n  name: \"Procreate paintings\"\n\ntiny-paintings:\n  name: \"Tiny paintings\"\n\nwork:\n  name: \"Work\"\n\nfaqs:\n  name: \"Frequently asked questions\"\n\nabout:\n  name: \"About\"\n\ncontact:\n  name: \"Contact\"\n\nsupport:\n  name: \"Support\"\n\n404:\n  name: \"Not found\"\n\nsitemap:\n  name: \"Sitemap\"\n\nstyle-guide:\n  name: \"Style guide\"\n\nterms:\n  name: \"Terms &amp; Policies\"\n\ntag:\n  name: \"Tags\"\n"
  },
  {
    "path": "src/_data/taxonomy.yml",
    "content": "paper-for-ios:\n  title: \"Paper for iOS\"\n  description: \"A collection of art created on iPad with the iOS app **Paper by WeTransfer**. Tutorials and other learnings related to my [**Mastering Paper**](/mastering-paper/) series are also included.\"\n\npaper-by-53:\n  title: \"Paper by FiftyThree\"\n  description: \"A collection of art created on iPad with the iOS app **Paper by WeTransfer**. Tutorials and other learnings related to my [**Mastering Paper**](/mastering-paper/') series are also included.\"\n\nsktchy:\n  title: \"Sktchy\"\n  description: \"Portraits painted and drawn in a variety of media inspired by photographs shared on [**Sktchy**](https://get.sktchy.com/).\"\n\njekyll:\n  title: \"Jekyll\"\n  description: \"An archive of posts related to [**Jekyll**](https://jekyllrb.com) --- a Ruby Gem that transforms plain text into static websites and blogs.\"\n\ntil:\n  title: \"Today I learned\"\n  description: \"Learnings captured for educational purposes and posterity.\"\n"
  },
  {
    "path": "src/_drafts/background-color.md",
    "content": "---\nlayout: page\ntitle: \"Mastering Paper for iOS: Swapping Background Colors\"\nlast_modified_at: \ncategories: mastering-paper\nexcerpt: \"\"\ntags: [Paper for iOS, tutorial]\n---\n\n## Intro\n\n## Methods of filling the background\n\n### Drag color swatch onto the canvas (quick method)\n\n### Fill the background manually\n\n## Advantages of background quick fill\n\n* It's super quick.\n* It's non-destructive.\n* You can erase a drawing and not worry about doing a background match.\n\n## Background fill gotcha\n\n* Some of the tools like the watercolor brush and marker behave differently on a dark background. Traditionally they \"multiply\" color when applied on top. With a background fill they become semi-opaque. Whites and yellows will now show.\n"
  },
  {
    "path": "src/_drafts/kitchen-sink.md",
    "content": "---\nlayout: page\ntitle: \"Kitchen Sink Post\"\ncategories: articles\nexcerpt: \"Below is just about everything you'll need to style in the theme.\"\nlast_modified_at: \ntags: []\ncomments: true\nads: true\n---\n\nBelow is just about everything you'll need to style in the theme. Check [the source code](https://github.com/mmistakes/made-mistakes-jekyll) to see the many embedded elements within paragraphs.\n\n# Heading 1: Lorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.\n\n## Heading 2: Lorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.\n\n### Heading 3: Lorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.\n\n#### Heading 4: Lorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.\n\n##### Heading 5: Lorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.\n\n###### Heading 6: Lorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.\n\n### Body text\n\nLorem ipsum dolor sit amet, test link adipiscing elit. **This is strong**. Nullam dignissim convallis est. Quisque aliquam.\n\n*This is emphasized*. Donec faucibus. Nunc iaculis suscipit dui. 53 = 125. Water is H<sub>2</sub>O. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. The New York Times <cite>(That’s a citation)</cite>. <u>Underline</u>. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.\n\nHTML and CSS are our tools. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.\n\n*[CSS]: Cascading Stylesheets\n\n### Blockquotes\n\n> Lorem ipsum dolor sit amet, test link adipiscing elit. Nullam dignissim convallis est. Quisque aliquam.\n\n> <cite>First Lastname, *The Greatest Article*</cite>\n\n## List Types\n\n### Ordered Lists\n\n1. Item one\n   1. sub item one\n   2. sub item two\n   3. sub item three\n2. Item two\n\n### Unordered Lists\n\n* Item one\n* Item two\n* Item three\n\n## Tables\n\n| Header1 | Header2 | Header3 |\n|:--------|:-------:|--------:|\n| cell1   | cell2   | cell3   |\n| cell4   | cell5   | cell6   |\n|----\n| cell1   | cell2   | cell3   |\n| cell4   | cell5   | cell6   |\n\n## Code Snippets\n\nSyntax highlighting via Pygments\n\n```css\n#container {\n  float: left;  \n  margin: 0 -240px 0 0;  \n  width: 100%;\n}\n```\n\n## Images\n\n<figure>\n  <img src=\"http://placehold.it/900x400.gif\" alt=\"\">\n  <figcaption><strong>Example:</strong> One image.</figcaption>\n</figure>\n\n<figure class=\"half\">\n  <img src=\"http://placehold.it/900x400.gif\" alt=\"\">\n  <img src=\"http://placehold.it/900x400.gif\" alt=\"\">\n  <figcaption><strong>Example:</strong> Two images.</figcaption>\n</figure>\n\n<figure class=\"third\">\n  <img src=\"http://placehold.it/900x400.gif\" alt=\"\">\n  <img src=\"http://placehold.it/900x400.gif\" alt=\"\">\n  <img src=\"http://placehold.it/900x400.gif\" alt=\"\">\n  <figcaption><strong>Example:</strong> Three images.</figcaption>\n</figure>\n\n## Buttons\n\nMake any link standout more when applying the `.btn` class.\n\n```html\n<a href=\"#\" class=\"btn\">Default Button</a>\n```\n\n<a href=\"#\" class=\"btn\">.btn</a>\n<a href=\"#\" class=\"btn btn--inverse\">.btn--inverse</a>\n<a href=\"#\" class=\"btn btn--info\">.btn--info</a>\n<a href=\"#\" class=\"btn btn--warning\">.btn--warning</a>\n<a href=\"#\" class=\"btn btn--danger\">.btn--danger</a>\n<a href=\"#\" class=\"btn btn--success\">.btn--success</a>\n\n## Notices\n\nSet a block of text off from the rest.\n\n{% notice %}\n#### Default Notice\n[Maecenas ornare tortor](). Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.\n{% endnotice %}\n\n{% notice info %}\n#### Info Notice\n`.notice.info` [Maecenas ornare tortor](). Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.\n{% endnotice %}\n\n{% notice warning %}\n#### Warning Notice\n`.notice.warning` Maecenas ornare tortor. Donec sed [tellus eget]() sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.\n{% endnotice %}\n\n{% notice danger %}\n#### Danger Notice\n`.notice.danger` Maecenas ornare tortor.[ Donec sed tellus]() eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at.\n{% endnotice %}\n\n{% notice success %}\n#### Success Notice\n`.notice.success` Maecenas ornare tortor. Donec sed tellus eget [sapien fringilla]() nonummy. Mauris a ante. Suspendisse quam sem, consequat at.\n{% endnotice %}\n\n## Fieldsets and Form Elements\n\n<fieldset>\n  <form>\n    <h2>Form Element</h2>\n    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui.</p>\n    <label for=\"text_field\">Text Field:</label>\n    <input type=\"text\" id=\"text_field\" />\n    <label for=\"text_area\">Text Area:</label>\n    <textarea id=\"text_area\"></textarea>\n    <p>\n      <label for=\"select_element\">Select Element:</label>\n      <select name=\"select_element\">\n        <optgroup label=\"Option Group 1\">\n          <option value=\"1\">Option 1</option>\n          <option value=\"2\">Option 2</option>\n          <option value=\"3\">Option 3</option>\n        </optgroup>\n        <optgroup label=\"Option Group 2\">\n          <option value=\"1\">Option 1</option>\n          <option value=\"2\">Option 2</option>\n          <option value=\"3\">Option 3</option>\n        </optgroup>\n      </select>\n    </p>\n    <p>\n      <label for=\"radio_buttons\">Radio Buttons:</label>\n      <label><input type=\"radio\" class=\"radio\" name=\"radio_button\" value=\"radio_1\" />Radio 1</label>\n      <label><input type=\"radio\" class=\"radio\" name=\"radio_button\" value=\"radio_2\" />Radio 2</label>\n      <label><input type=\"radio\" class=\"radio\" name=\"radio_button\" value=\"radio_3\" />Radio 3</label>\n    </p>\n    <p>\n      <label for=\"checkboxes\">Checkboxes:</label>\n      <label><input type=\"checkbox\" class=\"checkbox\" name=\"checkboxes\" value=\"check_1\" />Checkbox 1</label>\n      <label><input type=\"checkbox\" class=\"checkbox\" name=\"checkboxes\" value=\"check_2\" />Checkbox 2</label>\n      <label><input type=\"checkbox\" class=\"checkbox\" name=\"checkboxes\" value=\"check_3\" />Checkbox 3</label>\n    </p>\n    <p>\n      <label for=\"password\">Password:</label>\n      <input type=\"password\" class=\"password\" name=\"password\" />\n    </p>\n    <p>\n      <label for=\"file\">File Input:</label>\n      <input type=\"file\" class=\"file\" name=\"file\" />\n    </p>\n    <p>\n      <input class=\"btn\" type=\"submit\" value=\"Submit\" />\n    </p>\n  </form>\n</fieldset>\n"
  },
  {
    "path": "src/_drafts/testing-gatsby-js.md",
    "content": "---\ntitle: \"Testing Gatsby.js\"\nexcerpt:\nimage:\n  cover: false\n  path: &image\n  feature: *image\ncategories: [articles]\ntags: [Jekyll, Wordpress, web development, GitHub, Netlify, open source]\ncomments: true\nlast_modified_at:\n---\n\nI find myself at a crossroads. Eight years ago I migrated way from a [**Wordpress**](https://wordpress.org/) (PHP + MySQL database) backend to a statically generated [**Jekyll**](https://jekyllrb.com/) site. Now I find myself considering migrating back to Wordpress, though not in the way you might expect. Wait what?\n\nOne of the main motivators for moving away from a database was the appeal of a single Git repository of flat Markdown files. That coupled with the simplicity of [**Liquid's** templating language](https://shopify.github.io/liquid/) meant I'd have a deeper understanding of how to build pages --- versus struggling with \"[The Loop(https://codex.wordpress.org/The_Loop)]\" and other bloat I didn't need at the time.\n\nTo do this it meant giving up on the benefits of having a CMS back your site. Markdown files are great for text heavy posts and pages, but when you want to drop in galleries or several images it becomes a chore. And don't get me started on responsive images...\n\n*[CMS]: Content management system\n\n## Enter Gatsby.js\n\nIf you follow the static-site generator scene at all, it's hard not to take notice of **Gatsby**. Since releasing v1.0, this project has been on fire --- quickly amassing a huge amount of contributors and stargazers.\n\nAs someone who struggles with JavaScript, Gatsby wasn't a tool I considered at all. I know React components are a big deal right now, but that world is something I've tried to avoid as HTML and CSS is my jam. That all changed after reading how Gatsby's architecture builds [performant websites by default](https://www.gatsbyjs.com/how-it-works/performance/) and [queries data from anywhere](https://www.gatsbyjs.com/how-it-works/data-from-anywhere/) with GraphQL.\n\n### Gatsby first impressions\n\nGetting started with Gatsby was painless compared to the hell that `gem install jekyll` can sometimes be. And with a variety of [starters](https://www.gatsbyjs.org/docs/gatsby-starters/) to get you ummm \"started\", I was able to quickly test out Gatsby's workflow.\n\nBeing able to store post assets alongside (or relative to) source `.md` files is great. Coming from Jekyll-land where you need to write paths relative to `_site/`, it's nice being able to preview Markdown locally and on services like GitHub.\n\n![VS Code Markdown preview screenshot](/assets/images/vs-code-markdown-preview.jpg)\n\nAlso related to images is Gatsby's ability to size, optimize, and write HTML to display them responsively. By installing the [gatsby-remark-images](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-remark-images) package all images in your Markdown files are processed automatically and can even be lazy loaded using the \"blur up\" technique popularized by **Medium**.\n\nThis is something I've looked for in Jekyll plugins, but none work as seamless as Gatsby's solution. Most require you to add custom Liquid tags in your content, which sort of defeats the purpose. And even if you can get around that, the image processing and resize module[^sharp] Gatsby uses beats the pants off of anything available in Ruby in terms of build times.\n\n[^sharp]: Sharp is a high performance Node.js image processing and fast resize module for JPEG, PNG, WebP and TIFF images. Uses the libvips library. <http://sharp.pixelplumbing.com/>\n\n### Non-JS developers beware\n\nAs stated earlier, JavaScript is not my forte. I've never built a React component, written JSX, worked with CSS-in-JS, or any of the other things modern JavaScript frameworks tooling expect you to know. Coming from an experience using Jekyll with strong conventions on how to setup a site, there was a bit of culture shock with Gatsby.\n\nWith Jekyll there were usually prescribed and vetted ways of doing something, like setting permalinks. With Gatsby, there's a million different ways to do that because well it's JavaScript. And everyone has they preferred way of doing it.\n\nGreat to have all that flexibility, but for newbies it's a bit daunting to pickup. Especially when you deviate (or outgrow) the starters Gatsby and the community provide. Something I quickly found out when trying to migrate my 1,000+ page Jekyll site to Gatsby...\n\n## Migration\n\nSo about that migration. Before looking at a headless-CMS to back a Gatsby powered site I figured migrating a Jekyll one made of flat Markdown files would be more sane.\n\n### Build speed\n\n- Building thousands of posts\n- Resizing and optimizing thousands of images\n\n### Markdown support\n\nHow well does Markdown (specifically the Kramdown variant) convert via [remark](https://github.com/remarkjs/remark).\n\n- [Footnotes](https://kramdown.gettalong.org/converter/html.html#footnotes) ([gatsby-remark-numbered-footnotes](https://github.com/jlengstorf/gatsby-remark-numbered-footnotes))\n- Reference links in footnotes\n- [Auto-table of contents](https://kramdown.gettalong.org/converter/html.html#toc), gatsby-remark via `tableOfContents` in graphQL\n- [Abbreviations](https://kramdown.gettalong.org/syntax.html#abbreviations) ([gatsby-remark-abbr](https://github.com/Calyhre/gatsby-remark-abbr))\n- HTML, eg. `figure` and `figcaption` elements ([remark-captions](https://github.com/zestedesavoir/zmarkdown/tree/master/packages/remark-captions)?)\n- [Apply inline classes/ids](https://kramdown.gettalong.org/syntax.html#inline-attribute-lists)\n\n### Other\n\n- Match permalink structure\n- Pagination (posts and taxonomy archives) ([gatsby-paginate](https://github.com/pixelstew/gatsby-paginate))\n- Archive pages for categories/tags\n- SEO/OpenGraph tags\n- Sitemap ([gastby-plugin-sitemap](https://www.npmjs.com/package/gatsby-plugin-sitemap))\n- RSS/Atom feeds ([gatsby-plugin-feed](https://www.npmjs.com/package/gatsby-plugin-feed))\n- Static based comments - pull in YAML data files from [Staticman](http://staticman.net/)\n- BigFoot.js or equivalent for cleaner footnote presentation\n- Custom Jekyll tags (e.g. `{% raw %}{% figure %}{% endraw %}`, `{% raw %}{% notice %}{% endraw %}`, etc.) [remark-shortcodes](https://github.com/djm/remark-shortcodes)?\n- Image gallery components added in Markdown files, leveraging [gatsby-image](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image)?\n"
  },
  {
    "path": "src/_faqs/drawing-experience.md",
    "content": "---\ntitle: \"How long have you been drawing for?\"\ntype: other\ndate: 2015-03-12\nlast_modified_at: 2018-11-07T10:07:51-05:00\norder: 2\n---\n\nThat answer depends. Drawing with traditional tools and materials --- on and off for the last 20 years. Drawing with digital tools on iPad, the last 3 years.\n\n20 years seems like a long time to be drawing, but in my case it really isn't. First, there are some crazy gaps in time between draws... second, I've never really be all that serious about my craft. I got my first taste of drawing back in high school when I choose Studio in Art as an elective versus something in music.\n\nAfter four years of high school art I kept at it when dual majoring in both Graphic Design and Illustration at the **Rochester Institute of Technology** --- along with a minor in Fine Art. For several hours a week I had the privilege of drawing and painting live models on large pads of paper using charcoal, Conté crayons, inks, and watercolors.\n\nAfter earning my bachelor's degree, drawing took a back seat as I started a career in print and web design. Finding ways to incorporate technology into my life has been a passion of mine ever since playing with my first [Apple IIe](http://en.wikipedia.org/wiki/Apple_IIe). Helps explain why I was attracted to digital design which relies heavily on technology and computers compared to the fine arts.\n\n{% figure caption:\"Drawing on iPad with Paper for iOS.\" %}\n![drawing with Pencil stylus on iPad](/assets/images/ipad-drawing-paper-by-53.jpg)\n{% endfigure %}\n\nIt wasn't until I purchased my first iPad did I become interested in drawing again --- after a 10 year hiatus! For me, the convenience of drawing digitally, on a tablet I can take anywhere, is extremely appealing. The luxury of being able to disappear into a studio and work by myself is not one I can afford these days, especially with two little ones running around the house.\n\nWorking digitally I can now sit in the living room with my family, sketch on iPad, and help keep an eye on [the twins]({{ site.url }}/tag/twins/). It's not quite the same experience as working with real pencils, paints, and inks, but [Paper for iOS](http://www.fiftythree.com/paper) helps lessen that gap.\n"
  },
  {
    "path": "src/_faqs/export-paper-art.md",
    "content": "---\ntitle: \"How do you export high resolution Paper drawings to the Camera Roll?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2014-12-08T12:25:58-05:00\norder: 7\n---\n\nIn Paper for iOS you can only export as large as your iPad's native resolution. If you care about getting more pixels out of your Paper art then an iPad Air is the way to go.\n\nTo get the best quality image out of Paper I export to the iPad's camera roll and then transfer it with either iCloud's Photostream or Dropbox. For an untainted image without the eggshell background tapping the Camera Roll icon brings up an option toggle the background off or on. When toggled off you will end up with a PNG file with a transparent background (if you didn't fill with another color).\n\nThese uncompressed PNG files are the way to go if you plan on further manipulating them in Adobe Photoshop or one of the other applications in the Creative Suite.\n"
  },
  {
    "path": "src/_faqs/glitching-images.md",
    "content": "---\ntitle: \"How do you glitch images?\"\ntype: other\ndate: 2016-08-26\nlast_modified_at: 2018-01-19T09:24:59-05:00\norder: 3\n---\n\nTo create profile images that look like they've been run through a television set with poor reception, I use [**DECIM8**](https://www.rgb.nu/decim8). It's available as both an iOS and Android app.\n\n![glitched image examples](/assets/images/glitched-examples.jpg)\n\nThere are also free *glitch generators* available online that you run in-browser. Simply upload the image you want to glitch and play around with the various settings to achieve the desired result.\n\n- [ImageGlitcher](http://www.airtightinteractive.com/demos/js/imageglitcher/)\n- [Glitch Images](https://snorpey.github.io/jpg-glitch/)\n- [GLITCHATRON](http://www.errozero.co.uk/glitchatron/)\n"
  },
  {
    "path": "src/_faqs/learn-to-draw.md",
    "content": "---\ntitle: \"How did you learn to draw on an iPad?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2015-11-30T12:35:17-05:00\norder: 4\n---\n\nThe answer that no one likes to hear is \"*practice, practice, practice.*\" I wish there was some magical shortcut for learning how to draw, but there isn't.\n\nI learn something new every time I drag my stylus or finger across the iPad's screen. The best way to improve your craft is by putting in the time through observation and experimentation.\n\nDual majoring in graphic design and illustration at the [**Rochester Institute of Technology**](http://www.rit.edu/) with a minor in fine art, certainly helped as I took numerous drawing and painting classes. I have found memories of lugging huge 18 × 24\\\" pads of newsprint around campus to figure drawing classes where I learned the fundamentals of capturing 3-dimensional forms from hours of sketching live models.\n\nAfter graduating college I stopped practicing and found my drawing skills got really rust from laying dormant for 13 years. To get my skills back in shape I started a [365 project]({% post_url /articles/2014-08-29-paperfaces-retrospective %}) a few years ago after buying an iPad and discovering Paper for iOS.\n\nDrawing everyday certainly helped me advance my skills, but I still have a lot to learn.\n"
  },
  {
    "path": "src/_faqs/mastering-paper-book.md",
    "content": "---\ntitle: \"Have you ever thought about writing a Mastering Paper book?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2018-11-07T10:01:10-05:00\norder: 8\n---\n\nWriting a book devoted to Paper for iOS would be awesome. Once I finish the next couple of tutorials I want to look into creating an eBook version or possibly a printed version.\n\nI would love to print Moleskine books of the guides using Paper's built-in book feature, but I don't think that will be cost effective. At $50+ a pop that doesn't exactly scream *affordable*.\n"
  },
  {
    "path": "src/_faqs/paint-smooth.md",
    "content": "---\ntitle: \"How do you paint so smoothly with the brush tool?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2018-11-07T10:01:44-05:00\norder: 5\n---\n\nA smooth gradient can be achieved layering many washes of watercolor on top of each other. Speed and pressure play an important role in how clean of a tone you end up with. My [Paper Basics guide]({% post_url /mastering-paper/2014-02-09-basics %}) explains all of the nuances of the watercolor brush and several techniques for using it.\n\nHere's a quick video showing the basics:\n\n{% youtube AjJVrFFaCck %}\n"
  },
  {
    "path": "src/_faqs/paper-videos.md",
    "content": "---\ntitle: \"How do you make time lapse videos of your iPad drawings?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2018-11-07T10:12:13-05:00\norder: 9\n---\n\nMost of my Paper for iOS time lapse videos were made using [**Reflector**](http://www.airsquirrels.com/reflector/) to record the iPad's screen. With some edits done in Adobe AfterEffects to speed things up, include music, and add overlays.\n\n{% notice %}\n#### iOS screen recording\n\nApple has built this feature directly into iOS allowing you to [capture the screen](https://support.apple.com/en-us/HT207935) directly on device.\n{% endnotice %}\n\nAs long as you have an iPad 2 or newer you can use Reflector. Basically you turn on AirPlay mirroring on the iPad and it lets you beam it over to a Mac or PC running Reflector.\n\n{% youtube videoseries?list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao&amp; %}\n\nMy earlier time lapse videos were sets of screenshots[^screenshot] that I converted into Quicktime movies using iPhoto's slide-show feature. They're not as dramatic looking because you don't see the actual strokes happening, but still neat in a low tech kind of way.\n\n[^screenshot]: Press and hold the iPad's power and home buttons at the same time. You will see a flash and hear the camera's shutter close if done correctly.\n\nI've also experimented with recording the actual drawing process with my iPhone and speeding that up. Removing glare from the iPad's screen was a real challenge for me and I had mixed results with the [final videos](https://www.youtube.com/watch?v=JqVzqVG0e5g&index=8&list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao). For those who have more controlled studio lighting and patience, the results can be quite impressive.\n"
  },
  {
    "path": "src/_faqs/straight-lines.md",
    "content": "---\ntitle: \"How do you draw such straight lines?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2015-11-30T12:12:49-05:00\norder: 6\n---\n\nTo draw straight lines on the iPad I [use whatever straight edge]({% post_url /mastering-paper/2014-07-06-grid-method %}) I have laying around: ruler, book, piece of cardboard, notepad, etc. I have a few Paper by FiftyThree journal pages of \"frames\" that I duplicate[^duplicate-page] anytime I need them. Saves me the step of having to redraw the same thing over and over again.\n\n{% notice %}\n#### Think Kit update\n\nWith the addition of the [Think Kit tools](https://www.fiftythree.com/think) in Paper drawing straight lines and shapes is even easier (no rulers needed). Simply select the Diagram pen and watch as your scribbles autocorrect them self.\n{% endnotice %}\n\n{% figure caption:\"Surprise surprise, I use a ruler to draw straight lines.\" %}\n![drawing a line with Pencil and a T-square](/assets/images/paper-53-grid-t-square-lg.jpg)\n{% endfigure %}\n\n[^duplicate-page]: To copy a page pinch the screen to zoom out and then press and hold on the circle plus button until a duplicate button appears. The tap that.\n"
  },
  {
    "path": "src/_faqs/stylus-recommendations.md",
    "content": "---\ntitle: \"Which stylus do you recommend for iPad drawing?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2018-03-22T11:00:10-04:00\norder: 3\n---\n\nLong story short, if you have an iPad Pro do yourself a favor and get an [**Apple Pencil**][apple-pencil]. If you have an older (or non-Pro) model below are all the \"dumb\" styli I've had experience with.\n\n| Stylus | Quick Impressions\n|---\n| [Apple Pencil][apple-pencil] | Best stylus I've used hands down. Paired with an iPad Pro it's the closest thing to drawing on paper I've experienced. |\n| [Pencil by FiftyThree][pencil-stylus] | Super reliable, well designed, and long battery life. Tips have a tendency to tare quickly, but they're replaceable so its not the end of the world.\n| [Ten One Design Pogo Connect][pogo-stylus] | Connectivity issues and hardware flaws were maddening to deal with. If you ignore both of those problems apps having pressure sensitive support performed well.\n| [LunaTik Alloy Touch Pen][lunatik-stylus] | My trusted sidekick for a long long time. Tip (not replaceable) took some serious abuse and kept on licking. Has a refillable roller ball pen if you need a traditional writing instrument.\n| [Just-Mobile AluPen][alupen-stylus] | Lasted me a few months before wearing out. Nice solid construction. Tips aren't replaceable.\n| [ZEN 3 in 1][zen-stylus] | Precision disc tip dead on arrival so I couldn't test that. Rubber nib seems well made and slightly smaller than others giving a bit more precision to your draws.\n| [Chalkee Series Kids Stylus][chalkee] | Good for kids with small hands. Tip isn't replaceable and wears out quickly.\n| [Universal Touch Screen Pen][cheap-stylus] | Cheap, small, light, and pretty crappy. Comes in a 3 pack that are good as backup styli.\n\nThe first iPad stylus I purchased was a [Just-Mobile AluPen][alupen-stylus] and used it for quite some time before the rubber tip wore out. Following it I ended up with a [LunaTik Alloy Touch Pen][lunatik-stylus] after winning one in an [art competition](https://web.archive.org/web/20120822201917/http://lunatiklife.com/features/post/lunatikonpaper-winners).\n\nI really like the Touch Pen because it's built to last. The tip isn't a squishy rubber nib like many others and is super durable. I've drawn close to 400 portraits with it and it works just as flawless as the day I got it. I'd still be using it if I hadn't been lured over to the dark-side of Bluetooth styli.\n\nSpeaking of Bluetooth styli, prior to Apple Pencil, [FiftyThree's Pencil][pencil-stylus] was my go to when using [**Paper**](https://fiftythree.com/paper). Before that, I was all about the [Pogo Connect Smart Pen][pogo-stylus] even though it was a piece of crap.\n\n[apple-pencil]: https://www.apple.com/apple-pencil/\n[alupen-stylus]: http://amzn.to/2GictfT\n[lunatik-stylus]: http://amzn.to/2ugpp0U\n[pogo-stylus]: {% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}\n[pencil-stylus]: {% post_url /mastering-paper/2014-11-28-pencil-53-review %}\n[zen-stylus]: https://www.kickstarter.com/projects/zenwriting/zen-next-generation-of-modern-writing-instrument\n[chalkee]: http://amzn.to/2ILeVJZ\n[cheap-stylus]: http://amzn.to/2IFHOY9\n"
  },
  {
    "path": "src/_faqs/website-tools.md",
    "content": "---\ntitle: \"What tools do you use to build your website?\"\ntype: other\ndate: 2016-08-26\nlast_modified_at: 2018-11-07T10:06:58-05:00\ncomments: true\ncomments_locked: true\norder: 1\ntoc: true\n---\n\nA variety of tools and software are used to build Made Mistakes --- the biggies being an 21.5-inch Apple iMac, [Jekyll](http://jekyllrb.com), [Visual Studio Code](https://code.visualstudio.com/), Adobe's Creative Suite, and [SourceTree](https://www.sourcetreeapp.com/).\n\nI've been on a [static site generator]({{ site.url }}{% post_url /articles/2012-03-19-going-static %}) kick the last couple of years and use Jekyll to publish this page and everything else found on the site. The basic idea is I write a bunch of text in Markdown and Jekyll spits out a set of files[^files] that I upload to a webserver.\n\n## As far as Jekyll plugins, I use the following:\n\n- [**jekyll-sitemap**][sitemap]: silently generates a [sitemaps.org](http://www.sitemaps.org/) compliant sitemap.\n- [**jemoji**][jemoji]: adds GitHub-flavored emoji to Jekyll with the use of Liquid tags.\n- [**jekyll-seo-tag**][seo]: adds metadata tags for search engines and social networks to better index and display site content.\n- [**jekyll-paginate-v2**][jekyll-paginate-v2]: pagination replacement for the old [official Jekyll paginate](https://github.com/jekyll/jekyll-paginate) plugin.\n- [**jekyll-typogrify**][jekyll-typogrify]: improves typography using [typogruby][typogruby] and [titlecase][titlecase].\n- [**jekyll-figure**][jekyll-figure]: generates `<figure>` elements.\n- [**jekyll-toc**][jekyll-toc]: generates a table of contents.\n\nIf you're really interested in the specifics of how the site is built I've made its [source available on GitHub](https://github.com/mmistakes/made-mistakes-jekyll) for anyone to fork and download. And because I'm such a cool dude I've also open sourced a couple of [Jekyll themes]({{ site.url }}{% link _work/jekyll-themes.md %}) for you to use and abuse --- you're welcome!\n\n## Scripts and jQuery plugins\n\n- [**BigFoot.js**][bigfoot]: jQuery plugin for displaying footnotes inline.\n- [**Lazysizes**][lazysizes]: high performance and SEO friendly lazy loader for images (responsive and normal), iframes and more.\n- [**Lity**][lity]: lightweight, accessible, and responsive lightbox plugin.\n- [**Smooth Scroll**][smoothscroll]: automatically make same-page links scroll smoothly.\n- [**comment-reply.js**][comment-reply] modified from [**Wordpress.org**][wordpress].\n\n## Hosting and other stuff\n\n- Site hosting and deployment via [**Netlify**][netlify].\n- Domain name registered with [**Hover**][hover].\n- Icons from [**SimpleIcon**][simpleicon] and [**Noun Project**][nounproject].\n\n[^files]: HTML, CSS, and JavaScript files along with images and other assets needed to render a web page.\n[sitemap]: https://github.com/jekyll/jekyll-sitemap\n[netlify]: https://www.netlify.com/\n[cloudflare-ssl]: https://www.cloudflare.com/ssl/\n[hover]: https://hover.com/E4nZJYVH\n[simpleicon]: http://www.flaticon.com\n[nounproject]: https://thenounproject.com\n[twitter-emoji]: https://github.com/twitter/twemoji\n[jemoji]: https://github.com/jekyll/jemoji\n[seo]: https://github.com/jekyll/jekyll-seo-tag\n[wordpress]: https://wordpress.org/\n[bigfoot]: http://www.bigfootjs.com/\n[lazysizes]: https://github.com/aFarkas/lazysizes\n[lity]: http://sorgalla.com/lity/\n[smoothscroll]: https://github.com/cferdinandi/smooth-scroll\n[comment-reply]: https://core.svn.wordpress.org/trunk/wp-includes/js/comment-reply.js\n[jekyll-paginate-v2]: https://github.com/sverrirs/jekyll-paginate-v2\n[jekyll-typogrify]: https://github.com/myles/jekyll-typogrify\n[jekyll-figure]: https://github.com/paulrobertlloyd/jekyll-figure\n[jekyll-toc]: https://github.com/toshimaru/jekyll-toc\n[typogruby]: http://avdgaag.github.io/typogruby/\n[titlecase]: https://github.com/samsouder/titlecase\n"
  },
  {
    "path": "src/_faqs/what-tablet.md",
    "content": "---\ntitle: \"What tablet do you draw and paint on?\"\ntype: paper\ndate: 2016-08-26\nlast_modified_at: 2019-02-25T20:56:14-05:00\norder: 2\n---\n\nIf it wasn't painfully obvious, I draw, paint, and create on Apple's iPad. My current iPad is a 12.9\" Pro (256GB) with the Space Gray finish. Before I took the plunge and upgraded to the larger screen I had an Air 2.\n\nI use Apple Pencil exclusively and it's hands down the best stylus I've used on any iPad to date. Unlike many \"pressure sensitive\" styli before it, Apple Pencil works 100% of the time.\n\nIt doesn't disconnect, lag, or stutter while drawing or painting.\n\nAs far as protection --- I use a cheap [smart cover case](http://amzn.to/2pzUCpY), glow in the dark silicone [Apple Pencil grip](http://amzn.to/2G9nT5x), and I don't use a screen protector.\n"
  },
  {
    "path": "src/_includes/affiliate-disclosure.html",
    "content": "<small>Post contains affiliate and/or referral links. For more details read my <a href=\"/terms/#disclosure-policy\">disclosure policy</a>.</small>\n"
  },
  {
    "path": "src/_includes/algolia-search-scripts.html",
    "content": "<script src=\"https://cdn.jsdelivr.net/npm/instantsearch.js@2.3.3/dist/instantsearch.min.js\"></script>\n\n<script>\n  \"use strict\";\n\n  // Instanciating InstantSearch.js with Algolia credentials\n  var search = instantsearch({\n    appId: \"{{ site.algolia.application_id }}\",\n    apiKey: \"{{ site.algolia.search_only_api_key }}\",\n    indexName: \"{{ site.algolia.index_name }}\",\n    searchParameters: {\n      restrictSearchableAttributes: [\"title\", \"content\"]\n    },\n    searchFunction: function searchFunction(helper) {\n      var searchResults = document.querySelector(\".search-hits\");\n      if (helper.state.query === \"\") {\n        searchResults.style.display = \"none\";\n        return;\n      }\n      helper.search();\n      searchResults.style.display = \"block\";\n    }\n  });\n\n  var hitTemplate = function hitTemplate(hit) {\n    var url = hit.url;\n    var title = hit._highlightResult.title.value;\n    var content = hit._highlightResult.html.value;\n\n    return (\n      '<article class=\"entry\"><h3 class=\"entry__title\"><a href=\"{{ site.baseurl }}' +\n      url +\n      '\">' +\n      title +\n      '</a></h3><div class=\"entry__excerpt\">' +\n      content +\n      \"</div></article>\"\n    );\n  };\n\n  // Adding searchbar and results widgets\n  search.addWidget(\n    instantsearch.widgets.searchBox({\n      container: \".search-searchbar\",\n      poweredBy: true,\n      placeholder: \"Search...\",\n      reset: true\n    })\n  );\n  search.addWidget(\n    instantsearch.widgets.hits({\n      container: \".search-hits\",\n      templates: {\n        empty: \"<p>No results</p>\",\n        item: hitTemplate\n      }\n    })\n  );\n\n  // Starting the search\n  search.start();\n</script>\n"
  },
  {
    "path": "src/_includes/archive.html",
    "content": "---\nlayout: default\n---\n\n{% include page-intro.html %}\n\n<main id=\"main\" class=\"page-content\" aria-label=\"Content\">\n  <div class=\"index inner\">\n    <div>{{ content }}</div>\n\n    <div>\n      <header class=\"section-title\">\n        <h2>\n          {% if page.alt_title %}\n            {{ page.alt_title | markdownify | remove: '<p>' | remove: '</p>' }}\n          {% elsif page.autopages %}\n            {{ page.autopages.display_name }}\n          {% else %}\n            {{ page.title | markdownify | remove: '<p>' | remove: '</p>' }}\n          {% endif %}\n        </h2>\n      </header>\n      <div class=\"entries\">\n        {% include posts-paginated.html %}\n      </div>\n    </div>\n\n    {% include_cached footer.html %}\n  </div>\n</main>\n"
  },
  {
    "path": "src/_includes/author.liquid",
    "content": "{% assign author = page.author | default: page.authors[0] | default: site.author %}\n{% if author %}\n  {% if author.name %}\n    {% assign author_name = author.name %}\n  {% else %}\n    {% if site.data.authors and site.data.authors[author] %}\n      {% assign author_name = site.data.authors[author].name %}\n    {% else %}\n      {% assign author_name = author %}\n    {% endif %}\n  {% endif %}\n\n  {% if author.picture %}\n    {% assign author_picture = author.picture %}\n  {% else %}\n    {% if site.data.authors and site.data.authors[author] %}\n      {% assign author_picture = site.data.authors[author].picture %}\n    {% endif %}\n    {% unless author_picture contains '://' %}{% assign author_picture = author_picture | relative_url %}{% endunless %}\n  {% endif %}\n\n  {% if author.twitter %}\n    {% assign author_twitter = author.twitter %}\n  {% else %}\n    {% if site.data.authors and site.data.authors[author] %}\n      {% assign author_twitter = site.data.authors[author].twitter %}\n    {% else %}\n      {% assign author_twitter = site.twitter_username %}\n    {% endif %}\n  {% endif %}\n{% endif %}\n"
  },
  {
    "path": "src/_includes/boilerplate/paperfaces-2.md",
    "content": "#### Tools used\n\n- [Pogo Connect Bluetooth Smart Pen](https://www.amazon.com/gp/product/B009K448L4/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B009K448L4&linkCode=as2&tag=mademist-20)\n- [Paper for iOS](https://paper.bywetransfer.com/)\n"
  },
  {
    "path": "src/_includes/boilerplate/paperfaces-3.md",
    "content": "#### Tools used\n\n- [Pencil by FiftyThree](https://www.amazon.com/FiftyThree-Digital-Stylus-Pencil-iPhone/dp/B01JJBUYR4/ref=as_li_ss_tl?keywords=pencil+53&qid=1550586265&s=gateway&sr=8-3&linkCode=ll1&tag=mademist-20&linkId=0134793cb840affff60f2e45a7f64678&language=en_US)\n- [Paper for iOS](https://paper.bywetransfer.com/)\n"
  },
  {
    "path": "src/_includes/boilerplate/paperfaces-4.md",
    "content": "#### Tools used\n\n- [Pogo Connect Bluetooth Smart Pen](https://www.amazon.com/gp/product/B009K448L4/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B009K448L4&linkCode=as2&tag=mademist-20)\n- [Pencil by FiftyThree](https://www.amazon.com/FiftyThree-Digital-Stylus-Pencil-iPhone/dp/B01JJBUYR4/ref=as_li_ss_tl?keywords=pencil+53&qid=1550586265&s=gateway&sr=8-3&linkCode=ll1&tag=mademist-20&linkId=0134793cb840affff60f2e45a7f64678&language=en_US)\n- [Paper for iOS](https://paper.bywetransfer.com/)\n"
  },
  {
    "path": "src/_includes/boilerplate/paperfaces-5.md",
    "content": "#### Tools used\n\n- [Pencil by FiftyThree](https://www.amazon.com/FiftyThree-Digital-Stylus-Pencil-iPhone/dp/B01JJBUYR4/ref=as_li_ss_tl?keywords=pencil+53&qid=1550586265&s=gateway&sr=8-3&linkCode=ll1&tag=mademist-20&linkId=0134793cb840affff60f2e45a7f64678&language=en_US)\n- [Paper for iOS](https://paper.bywetransfer.com/)\n- [Lapse It](http://www.lapseit.com/)\n"
  },
  {
    "path": "src/_includes/boilerplate/paperfaces.md",
    "content": "#### Tools used\n\n- [LunaTik Alloy Touch Pen](https://www.amazon.com/gp/product/B00821TR7G/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=B00821TR7G)\n- [Paper for iOS](https://paper.bywetransfer.com/)\n"
  },
  {
    "path": "src/_includes/boilerplate/procreate-2.md",
    "content": "#### Tools used\n\n- [Adobe Ink stylus](https://www.amazon.com/Adobe-Creative-Connected-Precision-Stylus/dp/B00LNECVN6/ref=as_li_ss_tl?ie=UTF8&qid=1461688574&sr=8-1&keywords=adobe+ink&linkCode=ll1&tag=mademist-20&linkId=85c30649adf50e2ff0b9c753f6dfe2c9)\n- [iPad Air 2](https://en.wikipedia.org/wiki/IPad_Air_2)\n- [Procreate](https://procreate.art/)\n"
  },
  {
    "path": "src/_includes/boilerplate/procreate-3.md",
    "content": "#### Tools used\n\n- [Apple Pencil](https://www.apple.com/apple-pencil/)\n- [iPad Pro 12.9\" (2nd generation)](https://www.apple.com/ipad-pro/)\n- [Procreate](https://procreate.art/)\n"
  },
  {
    "path": "src/_includes/boilerplate/procreate.md",
    "content": "#### Tools used\n\n- [Pencil by FiftyThree](https://www.amazon.com/FiftyThree-Digital-Stylus-Pencil-iPhone/dp/B01JJBUYR4/ref=as_li_ss_tl?keywords=pencil+53&qid=1550586265&s=gateway&sr=8-3&linkCode=ll1&tag=mademist-20&linkId=0134793cb840affff60f2e45a7f64678&language=en_US)\n- [Universal Touch Screen Pen](https://www.amazon.com/gp/product/B00575TN42/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00575TN42&linkCode=as2&tag=mademist-20)\n- [iPad Air 2](https://en.wikipedia.org/wiki/IPad_Air_2)\n- [Procreate](https://procreate.art/)\n"
  },
  {
    "path": "src/_includes/boilerplate/watercolor.md",
    "content": "#### Tools used\n\n- [Holbein Artists' Water Color](http://www.amazon.com/gp/product/B000WD5WSK/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B000WD5WSK&linkCode=as2&tag=mademist-20&linkId=LBR2YQTAQWX3VYFM)\n- [Strathmore Ready Cut Watercolor Sheets, 8 × 10 Inches, 140-Pound Hot Press](http://www.amazon.com/gp/product/B004WFUH2U/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B004WFUH2U&linkCode=as2&tag=mademist-20&linkId=PMABIEAILYZ4RNSO)\n- Arttec 165 Red Sable Brush, Size 00\n"
  },
  {
    "path": "src/_includes/breadcrumbs.html",
    "content": "{% if page.breadcrumbs %}\n  <nav class=\"breadcrumbs\" itemscope itemtype=\"http://schema.org/BreadcrumbList\" aria-label=\"Breadcrumbs\">\n    <span class=\"breadcrumb sr-only\" itemprop=\"itemListElement\" itemscope itemtype=\"http://schema.org/ListItem\">\n      <a href=\"{{ '/' | relative_url }}\" itemprop=\"item\">\n        <span itemprop=\"name\">Home</span>\n        <meta itemprop=\"position\" content=\"1\" />\n      </a>\n    </span>\n    {% for crumb in page.breadcrumbs %}\n      <span class=\"breadcrumb\" itemprop=\"itemListElement\" itemscope itemtype=\"http://schema.org/ListItem\">\n        <a href=\"{{ crumb.url | relative_url }}\" itemprop=\"item\">\n          <span itemprop=\"name\">{{ crumb.label }}</span>\n          <meta itemprop=\"position\" content=\"{{ forloop.index | plus: 1 }}\" />\n        </a>\n      </span>\n      {% if forloop.last == true %}\n        <span class=\"breadcrumb sr-only\" itemprop=\"itemListElement\" itemscope itemtype=\"http://schema.org/ListItem\">\n          <a href=\"{{ page.url | relative_url }}\" itemprop=\"item\" aria-current=\"page\">\n            <span itemprop=\"name\">{{ page.title | strip_html }}</span>\n            <meta itemprop=\"position\" content=\"{{ forloop.length | plus: 2 }}\" />\n          </a>\n        </span>\n      {% endif %}\n    {% endfor %}\n  </nav>\n{% endif %}\n"
  },
  {
    "path": "src/_includes/comment-form.html",
    "content": "{% unless page.comments_locked == true %}\n  <!-- Start comment form -->\n  <div id=\"respond\" class=\"comment__form\">\n    <h2 class=\"title\">Leave a comment <small><a rel=\"nofollow\" id=\"cancel-comment-reply-link\" href=\"{{ page.url | relative_url }}#respond\" style=\"display:none;\">Cancel reply</a></small></h2>\n    <form id=\"comment-form\" class=\"js-form\" method=\"post\" action=\"https://api.staticman.net/v3/entry/github/{{ site.repository }}/{{ site.staticman.branch }}/comments\">\n      <div class=\"form__group\">\n        <label for=\"comment-form-name\">Name\n          <input type=\"text\" id=\"comment-form-name\" name=\"fields[name]\" required spellcheck=\"false\" placeholder=\"Your name\">\n        </label>\n        <label for=\"comment-form-email\">E-mail\n          <input type=\"email\" id=\"comment-form-email\" name=\"fields[email]\" required spellcheck=\"false\" placeholder=\"email@domain.com\">\n        </label>\n        <label for=\"comment-form-url\">Website (optional)\n          <input type=\"url\" id=\"comment-form-url\" name=\"fields[url]\" placeholder=\"https://domain.com\">\n        </label>\n      </div>\n      <div class=\"form__group\">\n        <label for=\"comment-form-message\">Comment\n          <textarea rows=\"6\" id=\"comment-form-message\" name=\"fields[message]\" required spellcheck=\"true\" placeholder=\"Your message\"></textarea>\n        </label>\n      </div>\n      <input type=\"hidden\" name=\"options[origin]\" value=\"{{ page.url | relative_url }}\">\n      <input type=\"hidden\" name=\"options[parent]\" value=\"{{ page.url | relative_url }}\">\n      <input type=\"hidden\" id=\"comment-replying-to\" name=\"fields[replying_to]\" value=\"\">\n      <input type=\"hidden\" id=\"comment-post-id\" name=\"options[slug]\" value=\"{{ page.slug }}\">\n      <input type=\"hidden\" name=\"options[reCaptcha][siteKey]\" value=\"{{ site.reCaptcha.siteKey }}\">\n      <input type=\"hidden\" name=\"options[reCaptcha][secret]\" value=\"{{ site.reCaptcha.secret }}\">\n      <!-- Start comment form alert messaging -->\n      <div class=\"hidden js-notice notice\">\n        <p class=\"js-notice-text\"></p>\n      </div>\n      <!-- End comment form alert messaging -->\n      <div class=\"g-recaptcha form__group\" data-sitekey=\"{{ site.reCaptcha.siteKey }}\"></div>\n      <button type=\"submit\" id=\"comment-form-submit\">Send comment</button>\n    </form>\n  </div>\n  <!-- End comment form -->\n  <script async src=\"https://www.google.com/recaptcha/api.js\"></script>\n{% else %}\n  <div class=\"notice\">\n    <h4>Comments are closed</h4>\n    <p>If you have a question concerning the content of this page, please feel free to <a href=\"/contact/\">contact me</a>.</p>\n  </div>\n{% endunless %}\n"
  },
  {
    "path": "src/_includes/comment.html",
    "content": "<div id=\"comment{% unless include.r %}{{ index | prepend: '-' }}{% else %}{{ include.index | prepend: '-' }}{% endunless %}\" class=\"js-comment comment {% unless include.replying_to == 0 %}child{% endunless %}\">\n  <div class=\"comment__avatar\">\n    {% if include.avatar %}\n      <noscript><img src=\"{{ include.avatar }}\" alt=\"\"></noscript>\n      <img src=\"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-src=\"{{ include.avatar }}\" alt=\"\" class=\"lazyload blur-up\">\n    {% elsif include.email %}\n      <noscript><img src=\"https://www.gravatar.com/avatar/{{ include.email }}?d=mm&s=60\" alt=\"\"></noscript>\n      <img src=\"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-srcset=\"https://www.gravatar.com/avatar/{{ include.email }}?d=mm&s=60 1x, https://www.gravatar.com/avatar/{{ include.email }}?d=mm&s=120 2x\" alt=\"\" class=\"lazyload blur-up\">\n    {% else %}\n      <noscript><img src=\"/assets/images/avatar-60.png\" alt=\"\"></noscript>\n      <img src=\"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-srcset=\"https://www.gravatar.com/avatar/{{ include.email }}?d=mm&s=60 1x, /assets/images/avatar-120.png 2x\" alt=\"\" class=\"lazyload blur-up\">\n    {% endif %}\n  </div>\n  <div class=\"comment__main\">\n    <div class=\"comment__meta\">\n      {% unless include.url == blank %}\n        <a rel=\"external nofollow\" href=\"{{ include.url }}\"><strong class=\"h-card\">{{ include.name | strip_html }}</strong></a>\n      {% else %}\n        <strong class=\"h-card\">{{ include.name | strip_html }}</strong>\n      {% endunless %}\n      {% if include.date %}\n        on\n        {% if include.index %}<a href=\"#comment{% if r %}{{ index | prepend: '-' }}{% else %}{{ include.index | prepend: '-' }}{% endif %}\" title=\"Permalink to this comment\">{% endif %}\n          <time datetime=\"{{ include.date | date_to_xmlschema }}\">{{ include.date | date_to_long_string: 'ordinal', 'US' }}</time>\n        {% if include.index %}</a>{% endif %}\n      {% endif %}\n    </div>\n    <div class=\"comment__message\">\n      {{ include.message | markdownify }}\n    </div>\n    {% unless include.replying_to != 0 or page.comments_locked == true %}\n      <div class=\"comment__reply\">\n        <a rel=\"nofollow\" href=\"#comment-{{ include.index }}\" onclick=\"return addComment.moveForm('comment-{{ include.index }}', '{{ include.index }}', 'respond', '{{ page.slug }}')\"><svg class=\"icon icon--reply\" width=\"16px\" height=\"16px\"><use xlink:href=\"{{ 'icons.svg#icon-reply' | prepend: 'assets/icons/' | relative_url }}\"></use></svg> Reply to {{ include.name }}</a>\n      </div>\n    {% endunless %}\n  </div>\n</div>\n\n{% capture i %}{{ include.index }}{% endcapture %}\n{% assign replies = site.data.comments[page.slug] | sort | where_exp: 'comment', 'comment[1].replying_to == i' %}\n{% for reply in replies %}\n  {% assign index       = forloop.index | prepend: '-' | prepend: include.index %}\n  {% assign replying_to = reply[1].replying_to | to_integer %}\n  {% assign avatar      = reply[1].avatar %}\n  {% assign email       = reply[1].email %}\n  {% assign name        = reply[1].name %}\n  {% assign url         = reply[1].url %}\n  {% assign date        = reply[1].date %}\n  {% assign message     = reply[1].message %}\n  {% include comment.html index=index replying_to=replying_to avatar=avatar email=email name=name url=url date=date message=message %}\n{% endfor %}\n"
  },
  {
    "path": "src/_includes/comments.html",
    "content": "{% if site.repository and site.staticman.branch %}\n  {% if site.data.comments[page.slug] %}\n    <section id=\"comments\" class=\"page__comments js-comments\">\n      <h2 class=\"title\">\n        {% if site.data.comments[page.slug].size <= 1 %}\n          {{ site.data.comments[page.slug] | size | append: ' comment' }}\n        {% elsif site.data.comments[page.slug].size > 1 %}\n          {{ site.data.comments[page.slug] | size | append: ' comments' }}\n        {% endif %}\n      </h2>\n      {% assign comments = site.data.comments[page.slug] | sort | where_exp: 'comment', 'comment[1].replying_to == blank' %}\n      {% for comment in comments %}\n        {% assign index       = forloop.index %}\n        {% assign replying_to = comment[1].replying_to | to_integer %}\n        {% assign avatar      = comment[1].avatar %}\n        {% assign email       = comment[1].email %}\n        {% assign name        = comment[1].name %}\n        {% assign url         = comment[1].url %}\n        {% assign date        = comment[1].date %}\n        {% assign message     = comment[1].message %}\n        {% include comment.html index=index replying_to=replying_to avatar=avatar email=email name=name url=url date=date message=message %}\n      {% endfor %}\n    </section>\n  {% endif %}\n\n  {% include comment-form.html %}\n{% endif %}\n"
  },
  {
    "path": "src/_includes/component-color.html",
    "content": "<article class=\"component\">\n  <header class=\"component__header\">\n    <h3 id=\"guide-{{ entry.title | slugify }}\">{{ entry.title }}</h3>\n    {% if entry.usage %}<p><strong>Usage:</strong> {{ entry.usage }}</p>{% endif %}\n    {% if entry.scss %}<p class=\"entry--last\"><strong>SCSS partial:</strong> <a href=\"https://github.com{{ site.repository | prepend: '/' | append: '/blob/master/' }}{{ entry.scss }}\">{{ entry.scss }}</a></p>{% endif %}\n  </header>\n\n  <div class=\"component__content--color\">\n    <div class=\"component__rendered--color\">\n      {{ entry.content }}\n    </div>\n  </div>\n\n</article>\n"
  },
  {
    "path": "src/_includes/component.html",
    "content": "<article class=\"component\">\n  <header class=\"component__header\">\n    <h3 id=\"guide-{{ entry.title | slugify }}\">{{ entry.title }}</h3>\n      {% if entry.usage %}<p><strong>Usage:</strong> {{ entry.usage }}</p>{% endif %}\n      {% if entry.module %}<p><strong>Include partial:</strong> <a href=\"https://github.com{{ site.repository | prepend: '/' | append: '/blob/master/' }}{{ entry.module }}\">{{ entry.module }}</a></p>{% endif %}\n      {% if entry.scss %}<p class=\"entry--last\"><strong>SCSS partial:</strong> <a href=\"https://github.com{{ site.repository | prepend: '/' | append: '/blob/master/' }}{{ entry.scss }}\">{{ entry.scss }}</a></p>{% endif %}\n  </header>\n\n  <div class=\"component__content\">\n    <div class=\"component__rendered\">\n      {{ entry.content }}\n    </div>\n    <div class=\"component__code\">\n\n{% highlight html %}\n{{ entry.content }}\n{% endhighlight %}\n\n    </div>\n  </div>\n</article>\n"
  },
  {
    "path": "src/_includes/critical-archive.css",
    "content": "@charset \"UTF-8\";button,html{font-family:Spectral,Georgia,serif}.menu__overlay a,.site__name a,a{text-decoration:none}h1,h2,p,ul{margin-top:0}html{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}*,::after,::before{-webkit-box-sizing:inherit;box-sizing:inherit}body{line-height:1.55}article,header,main,nav{display:block}h1,h2,p{margin-bottom:1.45rem}a{background-color:transparent;-webkit-text-decoration-skip:objects;color:#1e79ae}ul{list-style-type:square}img{max-width:100%;width:auto\\9;height:auto;border-style:none;vertical-align:middle;-ms-interpolation-mode:bicubic}.entry,.page__content p{max-width:35em}button{margin:0;font-size:100%;line-height:1.15;overflow:visible;text-transform:none}.entry__meta,.site__name{text-transform:uppercase}button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}[type=button]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}html{font-size:112.5%}@media (min-width:75em){html{font-size:126.5625%}}body{margin:0;padding:0;min-height:100%;color:#111;font-family:Spectral,Georgia,serif;-webkit-font-kerning:normal;font-kerning:normal;word-wrap:break-word}.site__header,h1,h2{margin-bottom:1.45rem}h1{line-height:2.9rem;margin-top:4.35rem}h2{line-height:2.175rem;margin-top:2.9rem;font-size:1.265625em}h1,h2{font-family:Helvetica,Arial,sans-serif;text-rendering:optimizeLegibility}@media (min-width:48em){h2{font-size:1.423828125em}ul{padding-left:0;list-style-position:outside}}:focus{outline:0}img[data-sizes=auto]{display:block;width:100%}.site__header{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-top:1.45rem;margin-left:5%;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;z-index:150}.page__title .heading,.site__name{font-family:Alegreya,serif;font-weight:700}@media (min-width:62em){h2{font-size:1.6018066406em}.site__header{margin-left:10%}}.site__name{display:inline-block;margin:0;height:25px;color:#000;font-size:1em;line-height:1.45rem}.site__name a{color:inherit}@media (min-width:48em){.site__header{position:absolute}.site__footer .icon__label{display:none}.page__title{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;align-self:end;-ms-grid-column:2;-ms-grid-column-span:4;grid-column:2/span 4;-ms-grid-row:2;-ms-grid-row-span:1;grid-row:2/3;margin-top:0;z-index:10}}@media (min-width:62em){.page__title{-ms-grid-column:2;-ms-grid-column-span:3;grid-column:2/span 3}}.page__title .heading{position:relative;margin-top:4.35rem;margin-bottom:.725rem;-ms-flex-item-align:start;align-self:flex-start;width:100%;color:#fff;font-size:1.44em;-webkit-font-variant-ligatures:common-ligatures;font-variant-ligatures:common-ligatures;-webkit-font-feature-settings:\"kern\" on,\"liga\" on,\"clig\" on,\"calt\" on;font-feature-settings:\"kern\" on,\"liga\" on,\"clig\" on,\"calt\" on;line-height:1.25;z-index:99}.entry__meta,.page__meta{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace}@media (min-width:48em){.page__title .heading{padding-right:5%;font-size:1.728em}.page__meta{-ms-grid-column:3;-ms-grid-column-span:2;grid-column:3/span 2;-ms-grid-row:3;-ms-grid-row-span:1;grid-row:3/span 1;-ms-grid-row-align:start;align-self:start}.page__meta:not(:empty){margin-top:1.45rem;margin-bottom:1.45rem}}@media (min-width:62em){.page__title .heading{font-size:2.0736em}.page__meta{-ms-grid-column:3;-ms-grid-column-span:1;grid-column:3/4}}.page__title .heading span{padding:0 .5em;line-height:1.5;-webkit-box-decoration-break:clone;box-decoration-break:clone;background-color:#000}.page__meta{font-size:.6944444444em}@media (min-width:48em){.page__content{-ms-grid-column:3;-ms-grid-column-span:4;grid-column:3/7;-ms-grid-row:4;-ms-grid-row-span:1;grid-row:4/span 1;align-self:flex-start;margin-top:2.9rem}.archive{display:-ms-grid;display:grid;-ms-grid-columns:2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;grid-template-columns:2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;-ms-grid-rows:80px auto auto;grid-template-rows:80px auto auto;-webkit-box-align:end;-ms-flex-align:end;align-items:end}.archive .page__content{-ms-grid-column:3;-ms-grid-column-span:6;grid-column:3/9}.entry__title{font-size:1.44em}}.page__content>p:first-child{margin-top:1.45rem}@media (max-width:47.99875em){.archive{margin-left:5vw;margin-right:5vw}}@media (min-width:75em){.archive{-ms-grid-columns:5% 5% 20% 10% 10% 10% 10% 20% 5% 5%;grid-template-columns:5% 5% 20% 10% 10% 10% 10% 20% 5% 5%}}.archive .entry__title{margin-bottom:0}.archive .heading{margin-top:4.35rem}.entry{position:relative;margin-bottom:3em}.entry__title{margin-bottom:0;font-weight:700;line-height:1.25}.entry__title a::before{content:'';position:absolute;top:0;right:0;bottom:0;left:0}.entry__meta{margin-bottom:.725rem;font-size:.6944444444em}.entry__meta :not(:first-child)::before{content:' · '}.entry__image{margin-bottom:1em}.menu{margin-bottom:4.35rem;padding-left:0;list-style:none}.menu__toggle{display:inline-block;-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1;margin-right:1em}.menu__toggle .toggle{position:relative;z-index:50}.menu__toggle .toggle-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.menu__overlay{position:absolute;left:0;top:0;width:100%;padding-left:5%;padding-right:5%;background:#000;color:#fff;z-index:100;visibility:hidden;-webkit-transform:translateY(-100%);transform:translateY(-100%);-webkit-overflow-scrolling:touch}.menu__overlay a{color:#fff}.menu__overlay-inner{height:100%;overflow-x:hidden;padding-top:80px}@media (min-width:62em){.archive .page__content{-ms-grid-column:3;-ms-grid-column-span:6;grid-column:3/9}.menu__overlay-inner{padding-left:3rem;padding-right:3rem}}.menu-item{font-family:Helvetica,Arial,sans-serif;font-size:1.44em;font-weight:700;line-height:2.175rem;opacity:0;-webkit-transform:translateX(-1rem);transform:translateX(-1rem)}@media (min-width:48em){.menu-item{font-size:2.0736em;line-height:2.9rem}}.menu-item a{color:#b0b2b5;position:relative}.menu-item a::before{background-color:#fff;content:\"\";display:block;height:1px;left:-3rem;position:absolute;top:50%;width:0}.navicon,.navicon-button{position:relative}.navicon-button{display:inline-block;padding:0;min-height:25px;outline:0;border:0;background-color:transparent;line-height:1.25em}.navicon,.navicon::after,.navicon::before{width:1.75em;height:.25em;background:#111}.navicon::after,.navicon::before{content:'';position:absolute;left:0;display:block}.navicon::before{top:.5em}.navicon::after{top:-.5em}.skip-links{position:absolute;width:100%}.sr-shortcut,.visually-hidden{position:absolute!important;overflow:hidden}.skip-links ul{padding-left:0;list-style:none}.search-searchbar{margin-top:1.45rem;margin-bottom:1.45rem}.sr-shortcut{width:1px;height:1px;clip:rect(0,0,0,0);border:0}.lazyload{opacity:0}.visually-hidden{clip:rect(1px,1px,1px,1px);height:1px!important;width:1px!important;border:0!important}"
  },
  {
    "path": "src/_includes/critical-home.css",
    "content": "@charset \"UTF-8\";button,html{font-family:Spectral,Georgia,serif}.btn,.menu__overlay a,.site__name a,a{text-decoration:none}h1,h2,p,ul{margin-top:0}.section__work .section__title{text-shadow:1px 1px 1px rgba(55,18,50,.75)}html{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}*,::after,::before{-webkit-box-sizing:inherit;box-sizing:inherit}body{line-height:1.55}article,header,main,nav,section{display:block}h1,h2,p{margin-bottom:1.45rem}a{background-color:transparent;-webkit-text-decoration-skip:objects;color:#1e79ae}ul{list-style-type:square}button{margin:0;font-size:100%;line-height:1.15;overflow:visible;text-transform:none}button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}[type=button]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}.btn,.menu-item,.site__name{font-weight:700}html{font-size:112.5%}@media (min-width:75em){html{font-size:126.5625%}}body{margin:0;padding:0;min-height:100%;color:#111;font-family:Spectral,Georgia,serif;-webkit-font-kerning:normal;font-kerning:normal;word-wrap:break-word}.site__header,h1,h2{margin-bottom:1.45rem}h1{line-height:2.9rem;margin-top:4.35rem}h2{line-height:2.175rem;margin-top:2.9rem;font-size:1.265625em}h1,h2{font-family:Helvetica,Arial,sans-serif;text-rendering:optimizeLegibility}:focus{outline:0}.site__header{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-top:1.45rem;margin-left:5%;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;z-index:150}@media (min-width:48em){h2{font-size:1.423828125em}ul{padding-left:0;list-style-position:outside}.site__header{position:absolute}}@media (min-width:62em){h2{font-size:1.6018066406em}.site__header{margin-left:10%}}.site__name{display:inline-block;margin:0;height:25px;color:#000;font-family:Alegreya,serif;font-size:1em;line-height:1.45rem;text-transform:uppercase}.site__name a{color:inherit}.btn,.menu__overlay a{color:#fff}@media (min-width:48em){.site__footer .icon__label{display:none}.page__content{-ms-grid-column:3;-ms-grid-column-span:4;grid-column:3/7;-ms-grid-row:4;-ms-grid-row-span:1;grid-row:4/span 1;align-self:flex-start;margin-top:2.9rem}}.btn,.menu__toggle{display:inline-block}.page__content p{max-width:35em}.layout__home .site__header{position:relative}.home .page__content{margin-top:0}.btn{background-color:#111;border-radius:4px;border:0;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:.8333333333em;line-height:1.5;padding:.5em 1em;text-align:center}.menu{margin-bottom:4.35rem;padding-left:0;list-style:none}.menu__toggle{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1;margin-right:1em}.menu__toggle .toggle{position:relative;z-index:50}.menu__toggle .toggle-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.menu__overlay{position:absolute;left:0;top:0;width:100%;padding-left:5%;padding-right:5%;background:#000;color:#fff;z-index:100;visibility:hidden;-webkit-transform:translateY(-100%);transform:translateY(-100%);-webkit-overflow-scrolling:touch}.menu__overlay-inner{height:100%;overflow-x:hidden;padding-top:80px}@media (min-width:62em){.menu__overlay-inner{padding-left:3rem;padding-right:3rem}}.menu-item{font-family:Helvetica,Arial,sans-serif;font-size:1.44em;line-height:2.175rem;opacity:0;-webkit-transform:translateX(-1rem);transform:translateX(-1rem)}@media (min-width:48em){.home .page__content{-ms-grid-column:1;-ms-grid-column-span:10;grid-column:1/span 10}.menu-item{font-size:2.0736em;line-height:2.9rem}}.menu-item a{color:#b0b2b5;position:relative}.menu-item a::before{background-color:#fff;content:\"\";display:block;height:1px;left:-3rem;position:absolute;top:50%;width:0}.navicon,.navicon-button{position:relative}.navicon-button{display:inline-block;padding:0;min-height:25px;outline:0;border:0;background-color:transparent;line-height:1.25em}.navicon,.navicon::after,.navicon::before{width:1.75em;height:.25em;background:#111}.navicon::after,.navicon::before{content:'';position:absolute;left:0;display:block}.navicon::before{top:.5em}.navicon::after{top:-.5em}.skip-links{position:absolute;width:100%}.skip-links ul{padding-left:0;list-style:none}.search-searchbar{margin-top:1.45rem;margin-bottom:1.45rem}.sections{margin-bottom:2rem}.section{background-color:#ebeced}.section .inner{max-width:80%;padding:10% 0 10% 5%}.section .btn{background-color:#111;color:#fff!important}.section__text>:last-child{margin-bottom:0}.section__text a:not(.btn){border-bottom:1px dotted currentColor;color:currentColor;text-decoration:none}.section__title .heading{margin-top:0;margin-bottom:1.45rem;color:#fff;font-family:Alegreya,serif;font-weight:700;font-size:1.728em;-webkit-font-variant-ligatures:common-ligatures;font-variant-ligatures:common-ligatures;-webkit-font-feature-settings:\"kern\" on,\"liga\" on,\"clig\" on,\"calt\" on;font-feature-settings:\"kern\" on,\"liga\" on,\"clig\" on,\"calt\" on;line-height:1.25}@media (min-width:48em){.section .inner{max-width:60%;padding:5% 0 5% 5%}.section__title .heading{padding-right:5%}}@media (min-width:62em){.section .inner{max-width:50%;padding-left:10%}.section__title .heading{font-size:2.0736em}.section__more{font-size:1.2em}}.section__title .heading span{padding:0 .5em;line-height:1.5;-webkit-box-decoration-break:clone;box-decoration-break:clone;background-color:#000}.section__actions{padding-left:0;list-style:none}.section__actions li{display:inline-block}.section__inverse{background-color:#1d1f23;color:#fff;position:relative}.section__inverse .inner{position:relative;z-index:1}.section__inverse .section__image{background-position:center;background-repeat:no-repeat;background-size:cover;height:100%;position:absolute;width:100%}.section__inverse .section__image::before{background:-webkit-gradient(linear,left top,right top,from(#1d1f23),color-stop(19%,rgba(29,31,35,.838)),color-stop(34%,rgba(29,31,35,.741)),color-stop(47%,rgba(29,31,35,.682)),color-stop(56.5%,rgba(29,31,35,.578)),color-stop(65%,rgba(29,31,35,.494)),color-stop(73%,rgba(29,31,35,.326)),color-stop(80.2%,rgba(29,31,35,.175)),color-stop(86.1%,rgba(29,31,35,.042)),color-stop(91%,rgba(29,31,35,.021)),color-stop(95.2%,rgba(29,31,35,.008)),color-stop(98.2%,rgba(29,31,35,.002)),to(rgba(29,31,35,0)));background:linear-gradient(to right,#1d1f23 0,rgba(29,31,35,.838) 19%,rgba(29,31,35,.741) 34%,rgba(29,31,35,.682) 47%,rgba(29,31,35,.578) 56.5%,rgba(29,31,35,.494) 65%,rgba(29,31,35,.326) 73%,rgba(29,31,35,.175) 80.2%,rgba(29,31,35,.042) 86.1%,rgba(29,31,35,.021) 91%,rgba(29,31,35,.008) 95.2%,rgba(29,31,35,.002) 98.2%,rgba(29,31,35,0) 100%);content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}.sr-shortcut,.visually-hidden{position:absolute!important;overflow:hidden}.section__inverse .section__more,.section__inverse .section__title{text-shadow:1px 1px 1px rgba(29,31,35,.75)}.section__inverse .btn{background-color:#fff;color:#1d1f23!important}.section__about{background-color:#15100e}.section__about .section__image::before{background:-webkit-gradient(linear,left top,right top,from(#15100e),color-stop(19%,rgba(21,16,14,.838)),color-stop(34%,rgba(21,16,14,.741)),color-stop(47%,rgba(21,16,14,.682)),color-stop(56.5%,rgba(21,16,14,.578)),color-stop(65%,rgba(21,16,14,.494)),color-stop(73%,rgba(21,16,14,.326)),color-stop(80.2%,rgba(21,16,14,.175)),color-stop(86.1%,rgba(21,16,14,.042)),color-stop(91%,rgba(21,16,14,.021)),color-stop(95.2%,rgba(21,16,14,.008)),color-stop(98.2%,rgba(21,16,14,.002)),to(rgba(21,16,14,0)));background:linear-gradient(to right,#15100e 0,rgba(21,16,14,.838) 19%,rgba(21,16,14,.741) 34%,rgba(21,16,14,.682) 47%,rgba(21,16,14,.578) 56.5%,rgba(21,16,14,.494) 65%,rgba(21,16,14,.326) 73%,rgba(21,16,14,.175) 80.2%,rgba(21,16,14,.042) 86.1%,rgba(21,16,14,.021) 91%,rgba(21,16,14,.008) 95.2%,rgba(21,16,14,.002) 98.2%,rgba(21,16,14,0) 100%)}.section__about .section__more,.section__about .section__title{text-shadow:1px 1px 1px rgba(21,16,14,.75)}.section__about .btn{color:#15100e!important}.section__work{background-color:#371232}.section__work .section__image::before{background:-webkit-gradient(linear,left top,right top,from(#371232),color-stop(19%,rgba(55,18,50,.838)),color-stop(34%,rgba(55,18,50,.741)),color-stop(47%,rgba(55,18,50,.682)),color-stop(56.5%,rgba(55,18,50,.578)),color-stop(65%,rgba(55,18,50,.494)),color-stop(73%,rgba(55,18,50,.326)),color-stop(80.2%,rgba(55,18,50,.175)),color-stop(86.1%,rgba(55,18,50,.042)),color-stop(91%,rgba(55,18,50,.021)),color-stop(95.2%,rgba(55,18,50,.008)),color-stop(98.2%,rgba(55,18,50,.002)),to(rgba(55,18,50,0)));background:linear-gradient(to right,#371232 0,rgba(55,18,50,.838) 19%,rgba(55,18,50,.741) 34%,rgba(55,18,50,.682) 47%,rgba(55,18,50,.578) 56.5%,rgba(55,18,50,.494) 65%,rgba(55,18,50,.326) 73%,rgba(55,18,50,.175) 80.2%,rgba(55,18,50,.042) 86.1%,rgba(55,18,50,.021) 91%,rgba(55,18,50,.008) 95.2%,rgba(55,18,50,.002) 98.2%,rgba(55,18,50,0) 100%)}.section__work .section__more,.section__work .section__title{text-shadow:1px 1px 1px rgba(55,18,50,.75)}.section__work .btn{color:#371232!important}.sr-shortcut{width:1px;height:1px;clip:rect(0,0,0,0);border:0}.lazyload{opacity:0}.visually-hidden{clip:rect(1px,1px,1px,1px);height:1px!important;width:1px!important;border:0!important}"
  },
  {
    "path": "src/_includes/critical-post.css",
    "content": "@charset \"UTF-8\";.page__aside>*,h3{margin-top:1.45rem}h1,h2,h3{text-rendering:optimizeLegibility}img,p img{max-width:100%}.menu__overlay a,.site__name a,a{text-decoration:none}header,nav{display:block}h3{line-height:1.8125rem;margin-bottom:1.45rem;font-size:1.125em}h1,h3{font-family:Helvetica,Arial,sans-serif}@media (max-width:47.99875em){.page__aside ul{padding-left:.75em}.page__toc{display:none}}.page__aside li{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:.8333333333em;line-height:1.45rem}.page__aside .title{margin-top:0;margin-right:.5rem;margin-bottom:0;padding:0;font-size:1em}.page__content>h2,.site__header,h1,h2,p{margin-bottom:1.45rem}h2{line-height:2.175rem;margin-top:2.9rem;font-size:1.265625em}h1,h2{font-family:Helvetica,Arial,sans-serif}button,html{font-family:Spectral,Georgia,serif}.page__content>h2{margin-top:2.9rem;letter-spacing:-.02em}.site__header,sup{position:relative}h1,p,ul{margin-top:0}@media (min-width:48em){h2{font-size:1.423828125em}ul{padding-left:0;list-style-position:outside}}html{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}*,::after,::before{-webkit-box-sizing:inherit;box-sizing:inherit}body{line-height:1.55}article,header,main,nav{display:block}a{background-color:transparent;-webkit-text-decoration-skip:objects;color:#1e79ae}strong{font-weight:inherit;font-weight:bolder}sup{font-size:75%;line-height:0;vertical-align:baseline;top:-.5em}ul{list-style-type:square}img{width:auto\\9;height:auto;border-style:none;vertical-align:middle;-ms-interpolation-mode:bicubic}button{margin:0;font-size:100%;line-height:1.15;overflow:visible;text-transform:none}button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}[type=button]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}html{font-size:112.5%}@media (min-width:75em){html{font-size:126.5625%}}body{margin:0;padding:0;min-height:100%;color:#111;font-family:Spectral,Georgia,serif;-webkit-font-kerning:normal;font-kerning:normal;word-wrap:break-word}h1{line-height:2.9rem;margin-top:4.35rem;font-family:Helvetica,Arial,sans-serif}:focus{outline:0}img[data-sizes=auto]{display:block;width:100%}.site__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-top:1.45rem;margin-left:5%;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;z-index:150}.page__title .heading,.site__name{font-family:Alegreya,serif;font-weight:700}@media (min-width:62em){.site__header{margin-left:10%}}.site__name{display:inline-block;margin:0;height:25px;color:#000;font-size:1em;line-height:1.45rem;text-transform:uppercase}.image__outer-wrapper,.image__wrapper{height:100%;width:100%}.site__name a{color:inherit}@media (min-width:48em){.site__header{position:absolute}.site__footer .icon__label{display:none}}.image__wrapper{position:relative;background-color:#eaeaea}.image__aspect-ratio{display:none}@media (min-width:48em){.image__wrapper img{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center center;object-position:center center}.image__aspect-ratio{display:block;content:'';width:100%;padding-top:75%}.page__title{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;align-self:end;-ms-grid-column:2;-ms-grid-column-span:4;grid-column:2/span 4;-ms-grid-row:2;-ms-grid-row-span:1;grid-row:2/3;margin-top:0;z-index:10}}@media (min-width:62em){.page__title{-ms-grid-column:2;-ms-grid-column-span:3;grid-column:2/span 3}}.page__title .heading{position:relative;margin-top:4.35rem;margin-bottom:.725rem;-ms-flex-item-align:start;align-self:flex-start;width:100%;color:#fff;font-size:1.44em;-webkit-font-variant-ligatures:common-ligatures;font-variant-ligatures:common-ligatures;-webkit-font-feature-settings:\"kern\" on,\"liga\" on,\"clig\" on,\"calt\" on;font-feature-settings:\"kern\" on,\"liga\" on,\"clig\" on,\"calt\" on;line-height:1.25;z-index:99}@media (min-width:48em){.page__title .heading{padding-right:5%;font-size:1.728em}.page__meta{-ms-grid-column:3;-ms-grid-column-span:2;grid-column:3/span 2;-ms-grid-row:3;-ms-grid-row-span:1;grid-row:3/span 1;-ms-grid-row-align:start;align-self:start}.page__meta:not(:empty){margin-top:1.45rem;margin-bottom:1.45rem}.page__meta span{display:block}}@media (min-width:62em){.page__title .heading{font-size:2.0736em}.page__meta{-ms-grid-column:3;-ms-grid-column-span:1;grid-column:3/4}}.page__title .heading span{padding:0 .5em;line-height:1.5;-webkit-box-decoration-break:clone;box-decoration-break:clone;background-color:#000}.page__meta{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:.6944444444em}.page__cover{margin-top:.725rem}@media (min-width:48em){.page__cover{-ms-grid-column:5;-ms-grid-column-span:6;grid-column:5/11;-ms-grid-row:1;-ms-grid-row-span:3;grid-row:1/4;margin-top:0;-o-object-fit:cover;object-fit:cover;-o-object-position:center center;object-position:center center;width:100%;height:100%}}@media (min-width:62em){.page__cover{-ms-grid-column:4;-ms-grid-column-span:7;grid-column:4/11}}@media (min-width:48em){.page__content{-ms-grid-column:3;-ms-grid-column-span:4;grid-column:3/7;-ms-grid-row:4;-ms-grid-row-span:1;grid-row:4/span 1;align-self:flex-start;margin-top:2.9rem}.post{display:-ms-grid;display:grid;-ms-grid-columns:2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;grid-template-columns:2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;-ms-grid-rows:80px auto auto;grid-template-rows:80px auto auto;-webkit-box-align:end;-ms-flex-align:end;align-items:end}}.page__content p{max-width:35em}.page__content>p:first-child{margin-top:1.45rem}@media (max-width:47.99875em){.page__meta .page__read-time::before{content:' · '}.page__cover{margin-left:-5vw;margin-right:-5vw}.post{margin-left:5vw;margin-right:5vw}}@media (min-width:75em){.post{-ms-grid-columns:5% 5% 20% 10% 10% 10% 10% 20% 5% 5%;grid-template-columns:5% 5% 20% 10% 10% 10% 10% 20% 5% 5%}}.gallery-2-col>*{display:block;margin-bottom:.5em}@media (min-width:48em){.gallery-2-col>*{margin-right:.5em;width:calc(50% - (.5 * .5em));height:100%}.gallery-2-col>:nth-of-type(2n){margin-right:0}.gallery-2-col>:nth-of-type(2n-1):nth-last-of-type(2){margin-bottom:0}.gallery-2-col>:after{content:'';display:block;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}}.emoji{height:1em;margin:0;max-height:20px;max-width:20px;width:1em}.menu{margin-bottom:4.35rem;padding-left:0;list-style:none}.menu__toggle{display:inline-block;-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1;margin-right:1em}.menu__toggle .toggle{position:relative;z-index:50}.menu__toggle .toggle-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.menu__overlay{position:absolute;left:0;top:0;width:100%;padding-left:5%;padding-right:5%;background:#000;color:#fff;z-index:100;visibility:hidden;-webkit-transform:translateY(-100%);transform:translateY(-100%);-webkit-overflow-scrolling:touch}.menu__overlay a{color:#fff}.menu__overlay-inner{height:100%;overflow-x:hidden;padding-top:80px}@media (min-width:62em){.menu__overlay-inner{padding-left:3rem;padding-right:3rem}}.menu-item{font-family:Helvetica,Arial,sans-serif;font-size:1.44em;font-weight:700;line-height:2.175rem;opacity:0;-webkit-transform:translateX(-1rem);transform:translateX(-1rem)}@media (min-width:48em){.menu-item{font-size:2.0736em;line-height:2.9rem}.breadcrumbs{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.menu-item a{color:#b0b2b5;position:relative}.menu-item a::before{background-color:#fff;content:\"\";display:block;height:1px;left:-3rem;position:absolute;top:50%;width:0}.navicon,.navicon-button{position:relative}.navicon-button{display:inline-block;padding:0;min-height:25px;outline:0;border:0;background-color:transparent;line-height:1.25em}.navicon,.navicon::after,.navicon::before{width:1.75em;height:.25em;background:#111}.navicon::after,.navicon::before{content:'';position:absolute;left:0;display:block}.navicon::before{top:.5em}.navicon::after{top:-.5em}.skip-links{position:absolute;width:100%}.skip-links ul{padding-left:0;list-style:none}.breadcrumbs{display:-webkit-box;display:-ms-flexbox;display:flex}@media (min-width:48em){.breadcrumbs .breadcrumb{border-left:2px solid #000}.breadcrumbs .breadcrumb:not(:first-child){margin-left:2em}}.breadcrumbs .breadcrumb:first-child{border-left:2px solid #000}@media (max-width:47.99875em){.breadcrumbs .breadcrumb:not(:first-child){padding-left:.25em;border-left-width:0}}.breadcrumbs .breadcrumb a{position:relative;display:block}.breadcrumbs .breadcrumb a:after,.breadcrumbs .breadcrumb a:before{position:absolute;display:block;content:''}.breadcrumbs .breadcrumb a:before{top:50%;width:1rem;height:2px;background-color:#000}.breadcrumbs .breadcrumb a:after{left:-2px;bottom:0;width:calc(1rem + 2px);height:calc(50% - 2px);background-color:#fff}.sr-shortcut,.visually-hidden{position:absolute!important;overflow:hidden}.breadcrumbs .breadcrumb span{padding-left:1.25rem}span+.breadcrumbs{margin-top:1.0875rem}.search-searchbar{margin-top:1.45rem;margin-bottom:1.45rem}.sr-shortcut{width:1px;height:1px;clip:rect(0,0,0,0);border:0}.lazyload{opacity:0}.visually-hidden{clip:rect(1px,1px,1px,1px);height:1px!important;width:1px!important;border:0!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}"
  },
  {
    "path": "src/_includes/entry.html",
    "content": "{% if post.id %}\n  {% assign title = post.title | markdownify | strip_html %}\n{% else %}\n  {% assign title = post.title %}\n{% endif %}\n\n<article class=\"entry {{ include.class }}\">\n  <h2 class=\"entry__title\"><a href=\"{{ post.url | relative_url }}\" rel=\"bookmark\">{{ title | widont }}</a></h2>\n  {% assign feature_image = post.image.feature %}\n  <div class=\"entry__meta\">\n    {% if post.date and layout != 'archive_work' %}\n      <time class=\"entry__date\" datetime=\"{{ post.date | date_to_xmlschema }}\">{{ post.date | date_to_long_string: 'ordinal', 'US' }}</time>\n    {% endif %}\n    {% if post.read_time %}\n      {% capture read_time %}{% include read-time.html %}{% endcapture %}{{ read_time | strip }}\n    {% endif %}\n    {% if post.work and layout == 'archive_work' %}\n      <span class=\"page__work\">{{ post.work | markdownify | remove: '<p>' | remove: '</p>' }}</span>\n    {% endif %}\n  </div>\n  {% if feature_image %}\n    <div class=\"entry__image\">\n      {% assign f = feature_image | split: '.' %}\n      <noscript><img src=\"{{ f[0] | relative_url }}-320.{{ f[1] }}\" class=\"entry-image\" alt=\"\"></noscript>\n      <img data-sizes=\"auto\"\n        src=\"{{ f[0] | relative_url }}-lq.{{ f[1] }}\"\n        data-srcset=\"{{ f[0] | relative_url }}-lq.{{ f[1] }} 20w,\n                     {{ f[0] | relative_url }}-320.{{ f[1] }} 320w,\n                     {{ f[0] | relative_url }}-768.{{ f[1] }} 768w,\n                     {{ f[0] | relative_url }}-1024.{{ f[1] }} 1024w\"\n        alt=\"\"\n        class=\"lazyload entry-image fade-in\">\n    </div>\n  {% endif %}\n\n  {% if post.excerpt %}\n    <div class=\"entry__excerpt\">{{ post.excerpt | markdownify }}</div>\n  {% endif %}\n</article>\n"
  },
  {
    "path": "src/_includes/favicons.html",
    "content": "{% assign favicon_version = site.favicon_version | default: '9BPnoQEY43' | prepend: '?v=' %}\n\n<link rel=\"apple-touch-icon\" sizes=\"180x180\" href=\"{{ 'apple-touch-icon.png' | prepend: '/assets/images/' | relative_url | append: favicon_version }}\">\n<link rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"{{ 'favicon-32x32.png' | prepend: '/assets/images/' | relative_url | append: favicon_version }}\">\n<link rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"{{ 'favicon-16x16.png' | prepend: '/assets/images/' | relative_url | append: favicon_version }}\">\n<link rel=\"manifest\" href=\"{{ 'site.webmanifest' | relative_url | append: favicon_version }}\">\n<link rel=\"mask-icon\" href=\"{{ 'safari-pinned-tab.svg' | prepend: '/assets/images/' | relative_url | append: favicon_version }}\" color=\"#000000\">\n<link rel=\"shortcut icon\" href=\"{{ 'favicon.ico' | prepend: '/assets/images/' | relative_url | append: favicon_version }}\">\n<meta name=\"apple-mobile-web-app-title\" content=\"{{ site.title }}\">\n<meta name=\"application-name\" content=\"{{ site.title }}\">\n<meta name=\"msapplication-config\" content=\"{{ 'browserconfig.xml' | relative_url | append: favicon_version }}\">\n<meta name=\"msapplication-TileColor\" content=\"#000000\">\n<meta name=\"theme-color\" content=\"#000000\">\n"
  },
  {
    "path": "src/_includes/footer.html",
    "content": "<footer id=\"footer\" class=\"site__footer\">\n  <ul class=\"menu\">\n    <li><a href=\"{{ '/support/' | relative_url }}\">Support me</a></li>\n    <li><a href=\"{{ '/faqs/' | relative_url }}\">FAQs</a></li>\n    <li><a href=\"{{ '/terms/' | relative_url }}\">Terms &amp; policies</a></li>\n    <li><a href=\"{{ '/sitemap/' | relative_url }}\">Sitemap</a></li>\n    {% if site.author.twitter %}\n      <li><a href=\"{{ site.author.twitter }}\" rel=\"me\">\n        <svg class=\"icon\" width=\"16px\" height=\"16px\">\n          <use xlink:href=\"{{ 'icons.svg#icon-twitter' | prepend: 'assets/icons/' | relative_url }}\"></use>\n        </svg>\n        <span class=\"icon__label\">Twitter</span>\n      </a></li>\n    {% endif %}\n    {% if site.author.github %}\n      <li><a href=\"{{ site.author.github }}\" rel=\"me\">\n        <svg class=\"icon\" width=\"16px\" height=\"16px\">\n          <use xlink:href=\"{{ 'icons.svg#icon-github' | prepend: 'assets/icons/' | relative_url }}\"></use>\n        </svg>\n        <span class=\"icon__label\">GitHub</span>\n      </a></li>\n    {% endif %}\n    {% if site.author.instagram %}\n      <li><a href=\"{{ site.author.instagram }}\" rel=\"me\">\n        <svg class=\"icon\" width=\"16px\" height=\"16px\">\n          <use xlink:href=\"{{ 'icons.svg#icon-instagram' | prepend: 'assets/icons/' | relative_url }}\"></use>\n        </svg>\n        <span class=\"icon__label\">Instagram</span>\n      </a></li>\n    {% endif %}\n    {% if site.feed.path %}\n      <li><a href=\"{{ site.feed.path }}\" title=\"Atom Feed\">\n        <svg class=\"icon\" width=\"16px\" height=\"16px\">\n          <use xlink:href=\"{{ 'icons.svg#icon-rss' | prepend: 'assets/icons/' | relative_url }}\"></use>\n        </svg>\n        <span class=\"icon__label\">Feed</span>\n      </a></li>\n    {% endif %}\n  </ul>\n  <div class=\"copyright\">\n    {% if site.copyright %}\n      {{ site.copyright | markdownify }}\n    {% else %}\n      <p>&copy; 2004&ndash;{{ site.time | date: '%Y' }} Michael Rose.</p>\n    {% endif %}\n  </div>\n</footer>\n"
  },
  {
    "path": "src/_includes/gallery.html",
    "content": "{% assign gallery = post.gallery | default: page.gallery %}\n{% if gallery %}\n  <div class=\"gallery-3-col\">\n    {% for img in gallery %}\n      {% if img.url contains '://' %}\n        {% assign url = img.url %}\n      {% else %}\n        {% assign url = img.url | relative_url %}\n      {% endif %}\n      {% assign image_lq_path = img.image_lq_path | default: 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' %}\n\n      {% if img.url %}\n        <a {% if img.class %}class=\"{{ img.class }}\"{% endif %} href=\"{{ url }}\" {% if img.title %}title=\"{{ img.title }}\"{% endif %}>\n          {% lazyload data-src=\"{{ img.image_path }}\" src=\"{{ image_lq_path }}\" alt=\"{{ img.alt }}\" %}\n        </a>\n      {% else %}\n        {% lazyload data-src=\"{{ img.image_path }}\" src=\"{{ image_lq_path }}\" alt=\"{{ img.alt }}\" %}\n      {% endif %}\n    {% endfor %}\n  </div>\n{% endif %}\n"
  },
  {
    "path": "src/_includes/google-analytics.html",
    "content": "<script>\n  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){\n  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),\n  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)\n  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');\n\n  ga('create', '{{ site.google_analytics }}', 'auto');\n  ga('send', 'pageview');\n</script>\n"
  },
  {
    "path": "src/_includes/head-seo.html",
    "content": "{% seo %}"
  },
  {
    "path": "src/_includes/head.html",
    "content": "<head>\n  <meta charset=\"utf-8\">\n  <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n  {% unless jekyll.environment == 'production' %}\n    <meta name=\"robots\" content=\"NOINDEX, NOFOLLOW\">\n  {% endunless %}\n\n  {% if site.plugins contains 'jekyll-seo-tag' %}\n    {% comment %}\n      Add metadata for search engines and social networks if jekyll-seo-tag plugin is enabled\n    {% endcomment %}\n    {% include head-seo.html %}\n  {% else %}\n    <title>{% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %}</title>\n    <meta name=\"description\" content=\"{{ page.excerpt | default: site.description | strip_html | normalize_whitespace | truncate: 160 | escape }}\">\n    <link rel=\"canonical\" href=\"{{ page.url | replace:'index.html', '' | relative_url }}\">\n  {% endif %}\n\n  {% assign style_css = site.data.css-manifest['main.css'] | default: 'main.css' | prepend: 'assets/stylesheets/' | relative_url %}\n  <meta name=\"fullcss\" content=\"{{ style_css }}\">\n\n  <!-- site verifications -->\n  {% if site.bing_site_verification %}\n    <meta name=\"msvalidate.01\" content=\"{{ site.bing_site_verification }}\">\n  {% endif %}\n  {% if site.alexa_site_verification %}\n    <meta name=\"alexaVerifyID\" content=\"{{ site.alexa_site_verification }}\">\n  {% endif %}\n  {% if site.yandex_site_verification %}\n    <meta name=\"yandex-verification\" content=\"{{ site.yandex_site_verification }}\">\n  {% endif %}\n  <!-- / site verifications -->\n\n  <!-- htmlmin:ignore -->\n  <!--#if expr=\"$HTTP_COOKIE=/fullcss\\=true/\" -->\n    <link rel=\"stylesheet\" href=\"{{ style_css }}\">\n    <link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css?family=Alegreya:700%7CSpectral:400,400i,700,700i&display=optional\">\n  <!--#else-->\n    {% if page.layout == 'home' %}\n      <style>{% include_cached critical-home.css %}</style>\n    {% elsif page.layout == 'archive' or page.layout == 'archive_work' or page.layout == 'autopage_tags' %}\n      <style>{% include_cached critical-archive.css %}</style>\n    {% elsif page.layout == 'post' or page.layout == 'page' %}\n      <style>{% include_cached critical-post.css %}</style>\n    {% endif %}\n  <!--#endif-->\n  <!-- htmlmin:ignore -->\n  <script>\n    /* Cut the mustard */\n    if ( 'querySelector' in document && 'addEventListener' in window ) {\n      document.documentElement.className = document.documentElement.className.replace(/\\bno-js\\b/g, '') + 'js';\n    }\n\n    /*! EnhanceJS: a progressive enhancement boilerplate. Copyright 2014 @scottjehl, Filament Group, Inc. Licensed MIT */\n    (function( window, undefined ) {\n\n      // Enable JS strict mode\n      \"use strict\";\n\n      var setTimeout = window.setTimeout;\n\n      var enhance = {};\n\n      // Define some variables to be used throughout this file\n      var doc = window.document,\n        docElem = doc.documentElement,\n        head = doc.head || doc.getElementsByTagName( \"head\" )[ 0 ],\n        // this references a meta tag's name whose content attribute should define the path to the full CSS file for the site\n        fullCSSKey = \"fullcss\",\n        htmlClasses = [ \"enhanced\" ];\n\n      /* Some commonly used functions - delete anything you don't need! */\n\n      // loadCSS: load a CSS file asynchronously. Included from https://github.com/filamentgroup/loadCSS/\n      function loadCSS( href, before, media ){\n        // Arguments explained:\n        // `href` is the URL for your CSS file.\n        // `before` optionally defines the element we'll use as a reference for injecting our <link>\n        // By default, `before` uses the first <script> element in the page.\n        // However, since the order in which stylesheets are referenced matters, you might need a more specific location in your document.\n        // If so, pass a different reference element to the `before` argument and it'll insert before that instead\n        // note: `insertBefore` is used instead of `appendChild`, for safety re: http://www.paulirish.com/2011/surefire-dom-element-insertion/\n        var ss = window.document.createElement( \"link\" );\n        var ref = before || window.document.getElementsByTagName( \"script\" )[ 0 ];\n        var sheets = window.document.styleSheets;\n        ss.rel = \"stylesheet\";\n        ss.href = href;\n        // temporarily, set media to something non-matching to ensure it'll fetch without blocking render\n        ss.media = \"only x\";\n        // inject link\n        ref.parentNode.insertBefore( ss, ref );\n        // This function sets the link's media back to `all` so that the stylesheet applies once it loads\n        // It is designed to poll until document.styleSheets includes the new sheet.\n        function toggleMedia(){\n          var defined;\n          for( var i = 0; i < sheets.length; i++ ){\n            if( sheets[ i ].href && sheets[ i ].href.indexOf( href ) > -1 ){\n              defined = true;\n            }\n          }\n          if( defined ){\n            ss.media = media || \"all\";\n          }\n          else {\n            setTimeout( toggleMedia );\n          }\n        }\n\n        toggleMedia();\n        return ss;\n      }\n\n      // expose it\n      enhance.loadCSS = loadCSS;\n\n      // getMeta function: get a meta tag by name\n      // NOTE: meta tag must be in the HTML source before this script is included in order to guarantee it'll be found\n      function getMeta( metaname ){\n        var metas = window.document.getElementsByTagName( \"meta\" );\n        var meta;\n        for( var i = 0; i < metas.length; i ++ ){\n          if( metas[ i ].name && metas[ i ].name === metaname ){\n            meta = metas[ i ];\n            break;\n          }\n        }\n        return meta;\n      }\n\n      // expose it\n      enhance.getMeta = getMeta;\n\n      // cookie function from https://github.com/filamentgroup/cookie/\n      function cookie( name, value, days ){\n        var expires;\n        // if value is undefined, get the cookie value\n        if( value === undefined ){\n          var cookiestring = \"; \" + window.document.cookie;\n          var cookies = cookiestring.split( \"; \" + name + \"=\" );\n          if ( cookies.length == 2 ){\n            return cookies.pop().split( \";\" ).shift();\n          }\n          return null;\n        }\n        else {\n          // if value is a false boolean, we'll treat that as a delete\n          if( value === false ){\n            days = -1;\n          }\n          if ( days ) {\n            var date = new Date();\n            date.setTime( date.getTime() + ( days * 24 * 60 * 60 * 1000 ) );\n            expires = \"; expires=\"+date.toGMTString();\n          }\n          else {\n            expires = \"\";\n          }\n          window.document.cookie = name + \"=\" + value + expires + \"; path=/\";\n        }\n      }\n\n      // expose it\n      enhance.cookie = cookie;\n\n      /* Enhancements for all browsers - qualified or not */\n\n      /* Load non-critical CSS async on first visit:\n        On first visit to the site, the critical CSS for each template should be inlined in the head, while the full CSS for the site should be requested async and cached for later use.\n        A meta tag with a name matching the fullCSSKey should have a content attribute referencing the path to the full CSS file for the site.\n        If no cookie is set to specify that the full CSS has already been fetched, load it asynchronously and set the cookie.\n        Once the cookie is set, the full CSS is assumed to be in cache, and the server-side templates should reference the full CSS directly from the head of the page with a link element, in place of inline critical styles.\n        */\n      var fullCSS = getMeta( fullCSSKey );\n      if( fullCSS && !cookie( fullCSSKey ) ){\n        loadCSS( fullCSS.content );\n        // set cookie to mark this file fetched\n        cookie( fullCSSKey, \"true\", 7 );\n        // asynchronously load fonts\n        (function(d) {\n          var wf = d.createElement('script'), s = d.scripts[0];\n          wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js';\n          s.parentNode.insertBefore(wf, s);\n        })(document);\n      }\n\n      /* Enhancements for qualified browsers - \"Cutting the Mustard\"\n        Add your qualifications for major browser experience divisions here.\n        For example, you might choose to only enhance browsers that support document.querySelector (IE8+, etc).\n        Use case will vary.\n        */\n      if( !( \"querySelector\" in doc ) ){\n        // basic browsers: last stop here!\n        return;\n      }\n\n      // From here on we're dealing with qualified browsers.\n\n      // Add scoping classes to HTML element: useful for upgrading the presentation of elements that will be enhanced with JS behavior\n      docElem.className += \" \" + htmlClasses.join(\" \");\n\n      // expose the 'enhance' object globally. Use it to expose anything in here that's useful to other parts of your application.\n      window.enhance = enhance;\n\n    }( this ));\n  </script>\n  <noscript><link rel=\"stylesheet\" href=\"{{ style_css }}\"></noscript>\n\n  {% include_cached favicons.html %}\n\n  {% if site.pingback_url %}\n    <link rel=\"pingback\" href=\"{{ site.pingback_url }}\">\n  {% endif %}\n\n  {% if site.webmention_url %}\n    <link rel=\"webmention\" href=\"{{ site.webmention_url }}\">\n  {% endif %}\n\n  {% if site.micropub_url %}\n    <link rel=\"micropub\" href=\"{{ site.micropub_url }}\">\n  {% endif %}\n\n  {% if site.token_endpoint_url %}\n    <link rel=\"token_endpoint\" href=\"{{ site.token_endpoint_url }}\">\n  {% endif %}\n\n  {% if site.authorization_endpoint_url %}\n    <link rel=\"authorization_endpoint\" href=\"{{ site.authorization_endpoint_url }}\">\n  {% endif %}\n\n  {% if site.microblog_url %}\n    <link rel=\"me\" href=\"{{ site.microblog_url }}\">\n  {% endif %}\n\n  {% if site.plugins contains 'jekyll-sitemap' %}\n    <link rel=\"sitemap\" type=\"application/xml\" title=\"Sitemap\" href=\"{{ 'sitemap.xml' | relative_url }}\">\n  {% endif %}\n\n  <link rel=\"alternate\" title=\"{{ site.title }} feed\" type=\"application/atom+xml\" href=\"{{ 'atom.xml' | absolute_url }}\">\n  <link rel=\"alternate\" title=\"{{ site.title }} feed\" type=\"application/json\" href=\"{{ 'feed.json' | absolute_url }}\">\n  <link rel=\"alternate\" title=\"{{ site.title }} - Articles feed\" type=\"application/atom+xml\" href=\"{{ 'articles.xml' | absolute_url }}\">\n  <link rel=\"alternate\" title=\"{{ site.title }} - Notes feed\" type=\"application/atom+xml\"  href=\"{{ 'notes.xml' | absolute_url }}\">\n  <link rel=\"alternate\" title=\"{{ site.title }} - Mastering Paper feed\" type=\"application/atom+xml\" href=\"{{ 'mastering-paper.xml' | absolute_url }}\">\n  <link rel=\"alternate\" title=\"{{ site.title }} - PaperFaces feed\" type=\"application/atom+xml\"  href=\"{{ 'paperfaces.xml' | absolute_url }}\">\n  <link rel=\"alternate\" title=\"{{ site.title }} - Procreate Paintings feed\" type=\"application/atom+xml\"  href=\"{{ 'procreate-paintings.xml' | absolute_url }}\">\n</head>\n"
  },
  {
    "path": "src/_includes/image__caption.html",
    "content": "<div class=\"image__caption\">\n  {{ page.image.caption | markdownify | remove: '<p>' | remove: '</p>' }}\n</div>\n"
  },
  {
    "path": "src/_includes/masthead.html",
    "content": "<header class=\"site__header\">\n  {% if page.url == '/' %}\n    <h1 class=\"site__name\">\n      <a href=\"{{ '/' | relative_url }}\">{{ site.title | escape }}</a>\n    </h1>\n  {% else %}\n    <div class=\"site__name\">\n      <a href=\"{{ '/' | relative_url }}\">{{ site.title | escape }}</a>\n    </div>\n  {% endif %}\n\n  <div class=\"menu__toggle\">\n    <button class=\"toggle navicon-button x\" type=\"button\">\n      <span class=\"toggle-inner\">\n        <span class=\"toggle-label visually-hidden\">menu</span>\n        <span class=\"navicon\"></span>\n      </span>\n    </button>\n  </div>\n</header>\n"
  },
  {
    "path": "src/_includes/navigation.html",
    "content": "<nav class=\"site-nav\" itemscope itemtype=\"http://schema.org/SiteNavigationElement\" aria-label=\"Main navigation\">\n  <ul id=\"menu-main-navigation\" class=\"menu\">\n    <li class=\"menu-item\">\n      <a href=\"{{ '/articles/' | relative_url }}\" itemprop=\"url\">\n        <span itemprop=\"name\">Articles</span>\n      </a>\n    </li>\n    <li class=\"menu-item\">\n      <a href=\"{{ '/notes/' | relative_url }}\" itemprop=\"url\">\n        <span itemprop=\"name\">Notes</span>\n      </a>\n    </li>\n    <li class=\"menu-item\">\n      <a href=\"{{ '/mastering-paper/' | relative_url }}\" itemprop=\"url\">\n        <span itemprop=\"name\">Mastering Paper</span>\n      </a>\n    </li>\n    <li class=\"menu-item\">\n      <a href=\"{{ '/work/' | relative_url }}\" itemprop=\"url\">\n        <span itemprop=\"name\">Works</span>\n      </a>\n    </li>\n    <li class=\"menu-item\">\n      <a href=\"{{ '/support/' | relative_url }}\" itemprop=\"url\">\n        <span itemprop=\"name\">Support me</span>\n      </a>\n    </li>\n    <li class=\"menu-item\">\n      <a href=\"{{ '/about/' | relative_url }}\" itemprop=\"url\">\n        <span itemprop=\"name\">About</span>\n      </a>\n    </li>\n    <li class=\"menu-item\">\n      <a href=\"{{ '/contact/' | relative_url }}\" itemprop=\"url\">\n        <span itemprop=\"name\">Contact</span>\n      </a>\n    </li>\n  </ul>\n</nav>\n"
  },
  {
    "path": "src/_includes/page-intro.html",
    "content": "{% if page.layout == 'autopage_tags' %}\n  {% assign taxonomy = page.autopages.display_name | downcase | slugify %}\n  {% assign tag = site.data.taxonomy[taxonomy] %}\n{% endif %}\n\n<div class=\"page__title\">\n  <h1 class=\"heading\"><span>{{ page.alt_title | default: page.autopage.display_name | default: page.title | default: site.title | markdownify | strip_html | widont }}</span></h1>\n</div>\n\n<div class=\"page__meta\">\n  {% if page.layout == 'post' %}\n    {% unless page.work %}\n      <span class=\"page__date\">\n        <time datetime=\"{{ page.date | date_to_xmlschema }}\">{{ page.date | date_to_long_string: 'ordinal', 'US' }}</time>\n      </span>\n    {% endunless %}\n    {% if page.read_time %}\n      <span class=\"page__read-time\">{% capture read_time %}{% include read-time.html %}{% endcapture %}{{ read_time | strip }}</span>\n    {% endif %}\n    {% if page.byline %}\n      {% include author.liquid %}\n      <span class=\"page__author\">\n        <span class=\"name\">{{ author.name }}</span>\n      </span>\n    {% endif %}\n  {% endif %}\n  {% include breadcrumbs.html %}\n</div>\n\n{% include page__cover.html %}\n"
  },
  {
    "path": "src/_includes/page__cover.html",
    "content": "{% assign feature_image = page.image.feature | default: page.image.path %}\n{% if feature_image %}\n  <div class=\"page__cover\">\n    <div class=\"image__outer-wrapper\">\n      <div class=\"image__wrapper\">\n        <div class=\"image__aspect-ratio\"\n          style=\"padding-top: calc(({{ page.image.height | default: 3 }} / {{ page.image.width | default: 4 }}) * 100%)\">\n        </div>\n        {% assign f = feature_image | split: '.' %}\n        <noscript><img src=\"{{ f[0] | relative_url }}-320.{{ f[1] }}\" alt=\"\"></noscript>\n        <img data-sizes=\"auto\"\n          src=\"{{ f[0] | relative_url }}-lq.{{ f[1] }}\"\n          data-srcset=\"{{ f[0] | relative_url }}-lq.{{ f[1] }} 20w,\n                       {{ f[0] | relative_url }}-320.{{ f[1] }} 320w,\n                       {{ f[0] | relative_url }}-768.{{ f[1] }} 768w,\n                       {{ f[0] | relative_url }}-1024.{{ f[1] }} 1024w,\n                       {{ f[0] | relative_url }}.{{ f[1] }} 1920w\"\n          alt=\"\"\n          class=\"lazyload fade-in\">\n        {% if page.image.caption %}{% include image__caption.html %}{% endif %}\n      </div>\n    </div>\n  </div>\n{% endif %}\n"
  },
  {
    "path": "src/_includes/page__pagination.html",
    "content": "<nav class=\"page__pagination\">\n  <h3>More:</h3>\n  <ul>\n    {% if page.previous %}\n      <li>\n        <a href=\"{{ page.previous.url | relative_url }}\" rel=\"prev\">\n          {{ page.previous.title | markdownify | remove: '<p>' | remove: '</p>' }}\n        </a>\n      </li>\n    {% endif %}\n    {% if page.next %}\n      <li>\n        <a href=\"{{ page.next.url | relative_url }}\" rel=\"next\">\n          {{ page.next.title | markdownify | remove: '<p>' | remove: '</p>' }}\n        </a>\n      </li>\n    {% endif %}\n  </ul>\n</nav>\n"
  },
  {
    "path": "src/_includes/page__related.html",
    "content": "<nav class=\"page__related\">\n  <h3 class=\"title\">Related:</h3>\n  <ul>\n  {% for related_post in site.related_posts limit: 3 %}\n    <li><a href=\"{{ related_post.url }}\">{{ related_post.title | markdownify | remove: '<p>' | remove: '</p>' }}</a></li>\n  {% endfor %}\n  </ul>\n</nav>\n"
  },
  {
    "path": "src/_includes/pager-category.html",
    "content": "<nav class=\"pager\">\n  <ul>\n    {% if page.previous_in_category %}\n      <li>\n        <a href=\"{{ page.previous_in_category.url | relative_url }}\" class=\"previous\">\n          <span class=\"pager-label\">Previous</span>\n          <span class=\"pager-title\">\n            <svg class=\"icon icon--arrow-left\" width=\"16px\" height=\"16px\"><use xlink:href=\"{{ 'icons.svg#icon-arrow-right' | prepend: 'assets/icons/' | relative_url }}\"></use></svg> {{ page.previous_in_category.title | markdownify | remove: '<p>' | remove: '</p>' }}\n          </span>\n        </a>\n      </li>\n    {% endif %}\n    {% if page.next_in_category %}\n      <li>\n        <a href=\"{{ page.next_in_category.url | relative_url }}\" class=\"next\">\n          <span class=\"pager-label\">Next</span>\n          <span class=\"pager-title\">\n            {{ page.next_in_category.title | markdownify | remove: '<p>' | remove: '</p>' }} <svg class=\"icon icon--arrow-right\" width=\"16px\" height=\"16px\"><use xlink:href=\"{{ 'icons.svg#icon-arrow-right' | prepend: 'assets/icons/' | relative_url }}\"></use></svg>\n          </span>\n        </a>\n      </li>\n    {% endif %}\n  </ul>\n</nav>\n"
  },
  {
    "path": "src/_includes/popular-topics.html",
    "content": "{% comment %}Build a tag index filtered by current category{% endcomment %}\n{% assign filterCategory = page.pagination.category | default: page.category %}\n{% assign sortedTags = site.tags | sort_natural %}\n\n<div class=\"popular entries__columns\">\n  <h4 class=\"title\">Browse by topic</h4>\n  <nav>\n    <ul>\n      {% assign tagLimiter = 0 %}\n      {% for tag in sortedTags %}\n        {% comment %}create an empty array{% endcomment %}\n        {% assign postsInCategory = \"\" | split: \"/\" %}\n        {% comment %}loop over site.tags{% endcomment %}\n        {% for post in tag[1] %}\n          {% if post.categories contains filterCategory %}\n            {% comment %}if a post is in the filter category add it to postsInCategory array{% endcomment %}\n            {% assign postsInCategory = postsInCategory | push: post %}\n          {% endif %}\n        {% endfor %}\n\n        {% comment %}poor man's tag limit on those that are frequently used{% endcomment %}\n        {% if postsInCategory.size >= 5 and tagLimiter < 9 %}\n          {% assign tagLimiter = tagLimiter | plus: 1 %}\n          <li><a href=\"/tag/{{ tag[0] | replace:' ','-' | downcase }}/\"><strong>{{ tag[0] | replace:' ','&nbsp;' }}</strong> <span class=\"count\">{{ tag[1] | size }}</span></a></li>\n        {% endif %}\n      {% endfor %}\n    </ul>\n  </nav>\n</div>\n"
  },
  {
    "path": "src/_includes/post-list.html",
    "content": "<li><a href=\"{{ post.url | relative_url }}\">{{ post.title | markdownify | remove: '<p>' | remove: '</p>' }}</a></li>\n"
  },
  {
    "path": "src/_includes/posts-all.html",
    "content": "{% for post in site.posts %}\n  {% include entry.html %}\n{% endfor %}\n"
  },
  {
    "path": "src/_includes/posts-paginated.html",
    "content": "{% if paginator.posts or page.autogen %}\n  {% for post in paginator.posts %}\n    {% include entry.html %}\n  {% endfor %}\n\n  <nav class=\"pagination\">\n    <ul>\n      {% if paginator.previous_page %}\n        <li>\n          <a href=\"{{ paginator.previous_page_path | relative_url }}\" class=\"newer-posts\">← newer posts</a>\n        </li>\n      {% endif %}\n      {% if page.autogen %}\n        <li>page {{ page.pagination_info.curr_page }} of {{ page.pagination_info.total_pages }}</li>\n      {% else %}\n        <li>page {{ paginator.page }} of {{ paginator.total_pages }}</li>\n      {% endif %}\n      {% if paginator.next_page %}\n        <li>\n          <a href=\"{{ paginator.next_page_path | relative_url }}\" class=\"older-posts\">older posts →</a>\n        </li>\n      {% endif %}\n    </ul>\n  </nav>\n{% endif %}\n"
  },
  {
    "path": "src/_includes/read-time.html",
    "content": "{% assign words_per_minute = site.words_per_minute | default: 200 %}\n\n{% if post.read_time %}\n  {% assign words = post.content | strip_html | number_of_words %}\n{% elsif page.read_time %}\n  {% assign words = page.content | strip_html | number_of_words %}\n{% endif %}\n\n{% if words < words_per_minute %}\n  <span class=\"entry__read-time\">~1&nbsp;min&nbsp;read</span>\n{% else %}\n  <span class=\"entry__read-time\">{{ words | divided_by:words_per_minute }}&nbsp;min&nbsp;read</span>\n{% endif %}\n"
  },
  {
    "path": "src/_includes/scripts.html",
    "content": "{% if jekyll.environment == 'production' and site.google_analytics %}\n  {% include_cached google-analytics.html %}\n{% endif %}\n\n{% assign index_js = site.data.js-manifest['index.js'] | default: 'index.js' | prepend: 'assets/javascripts/' | relative_url %}\n\n<script async src=\"{{ index_js }}\"></script>\n{% include_cached algolia-search-scripts.html %}\n"
  },
  {
    "path": "src/_includes/search-form.html",
    "content": "<div tabindex=\"-1\" class=\"search-searchbar\"></div>\n<div class=\"search-hits\"></div>\n"
  },
  {
    "path": "src/_includes/section.html",
    "content": "{% for section in page.section %}\n  {% assign section_bg_image = section.image %}\n  {% if section_bg_image %}\n    {% assign f = section_bg_image | split: '.' %}\n    {% capture data_bgset %}{{ site.url }}{{ f[0] }}-320.{{ f[1] }} 320w, {{ site.url }}{{ f[0] }}-768.{{ f[1] }} 768w, {{ site.url }}{{ f[0] }}-1024.{{ f[1] }} 1024w, {{ site.url }}{{ f[0] }}.{{ f[1] }} 1920w{% endcapture %}\n  {% endif %}\n\n  <div class=\"section section__{{ forloop.index }} {{ section.class }}\">\n    <div class=\"section__image lazyload fade-in\" {% if section_bg_image %}data-bgset=\"{{ data_bgset }}\" data-sizes=\"auto\"{% endif %}></div>\n    <div class=\"inner\">\n      <div class=\"section__text\">\n        <div class=\"section__title\">\n          <h2 class=\"heading\"><span>{{ section.title | markdownify | remove: '<p>' | remove: '</p>' }}</span></h2>\n        </div>\n        {% if section.introduction %}\n          <div class=\"section__more\">\n            {{ section.introduction | markdownify }}\n          </div>\n        {% endif %}\n\n        {% if section.actions %}\n          <ul class=\"section__actions\">\n            {% for action in section.actions %}\n              <li><a href=\"{{ action.url }}\" class=\"btn\">{{ action.label }}</a></li>\n            {% endfor %}\n          </ul>\n        {% endif %}\n      </div>\n    </div>\n  </div>\n{% endfor %}\n"
  },
  {
    "path": "src/_includes/skip-links.html",
    "content": "<nav class=\"skip-links\">\n  <ul>\n    <li><a href=\"#nav-primary\" class=\"sr-shortcut\">Skip to primary navigation</a></li>\n    <li><a href=\"#content\" class=\"sr-shortcut\">Skip to content</a></li>\n    <li><a href=\"#footer\" class=\"sr-shortcut\">Skip to footer</a></li>\n  </ul>\n</nav>\n"
  },
  {
    "path": "src/_includes/support.html",
    "content": "<div class=\"notice\">\n  <h4>Enjoyed this content?</h4>\n  <p>Help keep it free by <a href=\"/support/#send-a-donation\" onclick=\"ga('send', 'event', 'link', 'click', 'Send Donation');\">sending a donation</a> or purchasing something from <a href=\"http://a.co/19EcT9c\" onclick=\"ga('send', 'event', 'link', 'click', 'Amazon Wish List');\">my Amazon Wish List</a>. You can also <a href=\"/support/#subscribe-to-the-feeds\">subscribe to various site feeds</a> to get notified of new posts or <a href=\"/support/#follow-me-on-social-media\">follow me on social media</a>.</p>\n</div>\n"
  },
  {
    "path": "src/_layouts/archive.html",
    "content": "---\nlayout: default\n---\n\n{% include page-intro.html %}\n\n<article id=\"content\" class=\"page__content\">\n  {% if page.introduction %}\n    {{ page.introduction | markdownify }}\n  {% elsif page.layout == 'autopage_tags' %}\n    {% if tag.description %}\n      {{ tag.description | markdownify }}\n    {% else %}\n      <p>An archive of posts tagged <em>{{ page.autopages.display_name }}</em>.</p>\n    {% endif %}\n  {% endif %}\n\n  {{ content }}\n\n  {% include posts-paginated.html %}\n\n  {% if page.support == true %}\n    {% include_cached support.html %}\n  {% endif %}\n</article>\n"
  },
  {
    "path": "src/_layouts/archive_work.html",
    "content": "---\nlayout: default\n---\n\n{% assign layout = page.layout %}\n{% assign sorted_entries = site.work | sort: 'order' %}\n{% include page-intro.html %}\n\n<article id=\"content\" class=\"page__content\">\n  {% if page.introduction %}\n    {{ page.introduction | markdownify }}\n  {% elsif page.layout == 'autopage_tags' %}\n    {% if tag.description %}\n      {{ tag.description | markdownify }}\n    {% else %}\n      <p>An archive of posts tagged <em>{{ page.autopages.display_name }}</em>.</p>\n    {% endif %}\n  {% endif %}\n\n  {{ content }}\n\n  <div class=\"gallery\">\n    {% for post in sorted_entries %}\n      {% include entry.html class=\"gallery-item\" %}\n    {% endfor %}\n  </div>\n</article>\n"
  },
  {
    "path": "src/_layouts/atom_feed.html",
    "content": "---\nlayout: null\n---\n\n<?xml version=\"1.0\" encoding=\"utf-8\"?>\n{% if page.xsl %}\n  <?xml-stylesheet type=\"text/xml\" href=\"{{ '/feed.xslt.xml' | absolute_url }}\"?>\n{% endif %}\n<feed xmlns=\"http://www.w3.org/2005/Atom\" {% if site.lang %}xml:lang=\"{{ site.lang }}\"{% endif %}>\n  <generator uri=\"https://jekyllrb.com/\" version=\"{{ jekyll.version }}\">Jekyll</generator>\n  <link href=\"{{ page.url | absolute_url }}\" rel=\"self\" type=\"application/atom+xml\" />\n  <link href=\"{{ '/' | absolute_url }}\" rel=\"alternate\" type=\"text/html\" {% if site.lang %}hreflang=\"{{ site.lang }}\" {% endif %}/>\n  <updated>{{ site.time | date_to_xmlschema }}</updated>\n  <id>{{ '/' | absolute_url | xml_escape }}</id>\n\n  {% if site.title %}\n    <title type=\"html\">{{ site.title | smartify | xml_escape }}</title>\n  {% elsif site.name %}\n    <title type=\"html\">{{ site.name | smartify | xml_escape }}</title>\n  {% endif %}\n\n  {% if site.description %}\n    <subtitle>{{ site.description | xml_escape }}</subtitle>\n  {% endif %}\n\n  {% if site.author %}\n    <author>\n        <name>{{ site.author.name | default: site.author | xml_escape }}</name>\n      {% if site.author.email %}\n        <email>{{ site.author.email | xml_escape }}</email>\n      {% endif %}\n      {% if site.author.uri %}\n        <uri>{{ site.author.uri | xml_escape }}</uri>\n      {% endif %}\n    </author>\n  {% endif %}\n\n  {% comment %}for category specific feeds{% endcomment %}\n  {% assign category_limit = page.category_limit %}\n\n  {% unless page.category_limit %}\n    {% assign posts = site.posts | where_exp: \"post\", \"post.draft != true\" %}\n  {% else %}\n    {% assign posts = site.categories[category_limit] | where_exp: \"post\", \"post.draft != true\" %}\n  {% endunless %}\n\n  {% assign limit = page.limit | default: 10 %}\n  {% for post in posts limit: limit %}\n    <entry{% if post.lang %}{{\" \"}}xml:lang=\"{{ post.lang }}\"{% endif %}>\n      <title type=\"html\">{{ post.title | smartify | strip_html | normalize_whitespace | xml_escape }}</title>\n      <link href=\"{{ post.url | absolute_url }}\" rel=\"alternate\" type=\"text/html\" title=\"{{ post.title | xml_escape }}\" />\n      <published>{{ post.date | date_to_xmlschema }}</published>\n      <updated>{{ post.last_modified_at | default: post.date | date_to_xmlschema }}</updated>\n      <id>{{ post.id | absolute_url | xml_escape }}</id>\n      <content type=\"html\" xml:base=\"{{ post.url | absolute_url | xml_escape }}\">\n        {% assign post_image = post.image.feature | default: post.image.path %}\n        {% if post_image %}\n          {% unless post_image contains \"://\" %}\n            {% assign post_image = post_image | relative_url | xml_escape %}\n          {% endunless %}\n          {% capture post_image_html %}<img src=\"{{ post_image }}\" alt=\"\">{% endcapture %}\n          {{ post_image_html | markdownify | xml_escape }}\n        {% endif %}\n\n        {% if post.gallery %}\n          {% capture post_gallery %}{% include gallery.html %}{% endcapture %}\n          {{ post_gallery | strip | xml_escape }}\n        {% endif %}\n\n        {{ post.content | strip | xml_escape }}\n\n        {% capture post_footer %}<a href=\"{{ post.url | absolute_url }}\" rel=\"nofollow\">{{ post.title }}</a> was originally published on {{ site.title }}.{% endcapture %}\n        {{ post_footer | markdownify | xml_escape }}\n      </content>\n\n      {% assign post_author = post.author | default: post.authors[0] | default: site.author %}\n      {% assign post_author = site.data.authors[post_author] | default: post_author %}\n      {% assign post_author_email = post_author.email | default: nil %}\n      {% assign post_author_uri = post_author.uri | default: nil %}\n      {% assign post_author_name = post_author.name | default: post_author %}\n\n      <author>\n          <name>{{ post_author_name | default: \"\" | xml_escape }}</name>\n        {% if post_author_email %}\n          <email>{{ post_author_email | xml_escape }}</email>\n        {% endif %}\n        {% if post_author_uri %}\n          <uri>{{ post_author_uri | xml_escape }}</uri>\n        {% endif %}\n      </author>\n\n      {% if post.category %}\n        <category term=\"{{ post.category | xml_escape }}\" />\n      {% endif %}\n\n      {% for tag in post.tags %}\n        <category term=\"{{ tag | xml_escape }}\" />\n      {% endfor %}\n\n      {% if post.excerpt and post.excerpt != empty %}\n        <summary type=\"html\">{{ post.excerpt | strip_html | normalize_whitespace | xml_escape }}</summary>\n      {% endif %}\n\n      {% if post_image %}\n        {% unless post_image contains \"://\" %}\n          {% assign post_image = post_image | absolute_url | xml_escape  %}\n        {% endunless %}\n        <media:thumbnail xmlns:media=\"http://search.yahoo.com/mrss/\" url=\"{{ post_image }}\" />\n      {% endif %}\n    </entry>\n  {% endfor %}\n</feed>\n"
  },
  {
    "path": "src/_layouts/autopage_tags.html",
    "content": "---\nlayout: default\n---\n\n{% include page-intro.html %}\n\n<article id=\"content\" class=\"page__content\">\n  {% if page.introduction %}\n    {{ page.introduction | markdownify }}\n  {% elsif page.layout == 'autopage_tags' %}\n    {% if tag.description %}\n      {{ tag.description | markdownify }}\n    {% else %}\n      <p>An archive of posts tagged <em>{{ page.autopages.display_name }}</em>.</p>\n    {% endif %}\n  {% endif %}\n\n  {{ content }}\n\n  {% include posts-paginated.html %}\n</article>\n"
  },
  {
    "path": "src/_layouts/default.html",
    "content": "<!DOCTYPE html>\n<!-- htmlmin:ignore -->\n<!--\n    Copyright 2004-2019 Michael Rose - mademistakes.com | @mmistakes\n    https://github.com/mmistakes/made-mistakes-jekyll/blob/master/LICENSE\n-->\n<!-- htmlmin:ignore -->\n<html lang=\"{{ page.lang | default: site.lang | default: 'en-US' }}\" class=\"no-js\">\n  {% include head.html %}\n\n  <body class=\"layout__{{ page.layout | default: layout.layout }}{% if page.classes or layout.classes %}{{ page.classes | default: layout.classes | join: ' ' | prepend: ' ' }}{% endif %} {{ page.title | slugify }}\">\n    {% include_cached skip-links.html %}\n    <div id=\"nav-primary\" class=\"menu__overlay\">\n      <div class=\"menu__overlay-inner\">\n        {% include_cached search-form.html %}\n        {% include_cached navigation.html %}\n      </div>\n    </div>\n\n    {% include masthead.html %}\n    <main class=\"{{ page.layout | default: layout.layout }}\">\n      {{ content }}\n    </main>\n    {% include_cached footer.html %}\n    {% include scripts.html %}\n  </body>\n</html>\n"
  },
  {
    "path": "src/_layouts/home.html",
    "content": "---\nlayout: default\n---\n\n<article id=\"content\" class=\"page__content\">\n  {% if page.section %}\n    <section class=\"sections\">\n      {% include section.html %}\n    </section>\n  {% endif %}\n\n  {{ content }}\n</article>\n"
  },
  {
    "path": "src/_layouts/json_feed.html",
    "content": "---\nlayout: null\n---\n\n{% assign limit = page.limit | default: 10 %}\n\n{\n  \"version\": \"https://jsonfeed.org/version/1\",\n  {% if page.title %}\n    \"title\": {{ page.title | smartify | jsonify }},\n  {% elsif site.title %}\n    \"title\": {{ site.title | smartify | jsonify }},\n  {% endif %}\n  \"home_page_url\": \"{{ '/' | absolute_url }}\",\n  \"feed_url\": \"{{ page.url | absolute_url }}\",\n  {% if page.excerpt %}\n    \"description\": {{ page.excerpt | strip_html | normalize_whitespace | jsonify }},\n  {% elsif site.description %}\n    \"description\": {{ site.description | strip_html | normalize_whitespace | jsonify }},\n  {% endif %}\n  \"icon\": \"{{ 'apple-touch-icon.png' | prepend: '/assets/images/' | absolute_url }}\",\n  \"favicon\": \"{{ 'apple-touch-icon.png' | prepend: '/assets/images/' | absolute_url }}\",\n  {% if site.author %}\n    \"author\": {\n      \"name\": \"{{ site.author.name }}\"\n      {% if site.author.url %}, \"url\": \"{{ site.author.url }}\"{% endif %}\n      {% if site.author.picture %}, \"avatar\": \"{{ site.author.picture | absolute_url }}\"{% endif %}\n    },\n  {% endif %}\n  \"expired\": false,\n  \"items\": [\n    {% comment %}for category specific feeds{% endcomment %}\n    {% assign category_limit = page.category_limit %}\n\n    {% unless page.category_limit %}\n      {% assign posts = site.posts | where_exp: \"post\", \"post.draft != true\" %}\n    {% else %}\n      {% assign posts = site.categories[category_limit] | where_exp: \"post\", \"post.draft != true\" %}\n    {% endunless %}\n\n    {% assign limit = page.limit | default: 10 %}\n    {% for post in posts limit: limit %}\n      {\n        \"id\": \"{{ post.id | absolute_url }}\",\n        \"url\": \"{{ post.url | absolute_url }}\",\n        {% if post.link %}\"external_url\": \"{{ post.link }}\",{% endif %}\n        \"title\": {{ post.title | smartify | strip_html | normalize_whitespace | jsonify }},\n        {% capture post_content %}\n          {% if post.gallery %}\n            {% capture post_gallery %}{% include gallery.html %}{% endcapture %}\n            {{ post_gallery }}\n          {% endif %}\n          {{ post.content }}\n          <p><a href=\"{{ post.url | absolute_url }}\" rel=\"nofollow\">{{ post.title }}</a> was originally published on {{ site.title }}.</p>\n        {% endcapture %}\n        \"content_html\": {{ post_content | strip | jsonify }},\n        \"content_text\": {{ post.content | strip_html | normalize_whitespace | jsonify }}\n        {% if post.excerpt and post.excerpt != empty %}\n          , \"summary\": {{ post.excerpt | strip_html | normalize_whitespace | jsonify }}\n        {% endif %}\n        {% assign post_image = post.image.feature | default: post.image.path %}\n        {% if post_image %}\n          {% unless post_image contains \"://\" %}\n            {% assign post_image = post_image | absolute_url %}\n          {% endunless %}\n          , \"image\": \"{{ post_image }}\"\n        {% endif %}\n        {% if post.tags.size > 1 %}\n          {% assign tags = post.tags | sort | uniq %}\n          , \"tags\": {{ tags | jsonify }}\n        {% endif %}\n        {% if post.date %}, \"date_published\": \"{{ post.date | date_to_xmlschema }}\"{% endif %}\n        {% if post.last_modified_at %}, \"date_modified\": \"{{ post.last_modified_at | date_to_xmlschema }}\"{% endif %}\n\n        {% assign post_author = post.author | default: post.authors[0] | default: site.author %}\n        {% assign post_author = site.data.authors[post_author] | default: post_author %}\n        {% assign post_author_email = post_author.email | default: nil %}\n        {% assign post_author_uri = post_author.uri | default: nil %}\n        {% assign post_author_name = post_author.name | default: post_author %}\n\n        {% if post_author %}, \"author\": {\n          \"name\": {{ post_author_name | default: '' | jsonify }}\n          {% if post_author_email %}, \"email\": {{ post_author_email | jsonify }}{% endif %}\n          {% if post_author_uri %}, \"url\": {{ post_author_uri | jsonify }}{% endif %}\n        }{% endif %}\n      }{% if forloop.last == false %},{% endif %}\n    {% endfor %}\n  ]\n}\n"
  },
  {
    "path": "src/_layouts/page.html",
    "content": "---\nlayout: default\n---\n\n{% include page-intro.html %}\n\n<article id=\"content\" class=\"page__content\">\n  {% include gallery.html %}\n\n  {{ content }}\n\n  {% if page.comments == true %}\n    {% include comments.html %}\n  {% endif %}\n</article>\n\n<aside class=\"page__aside\">\n  {% if page.toc %}\n    <nav class=\"page__toc\">\n      <h3 class=\"title\">On this page:</h3>\n      {{ content | toc_only }}\n    </nav>\n  {% endif %}\n  <p><a class=\"back-to-top\" href=\"#nav-primary\">↑ back to top</a></p>\n</aside>\n"
  },
  {
    "path": "src/_layouts/post.html",
    "content": "---\nlayout: default\n---\n\n{% include page-intro.html %}\n\n<article id=\"content\" class=\"page__content\">\n  {% include gallery.html %}\n\n  {{ content }}\n\n  {% if page.support == true %}\n    {% include_cached support.html %}\n  {% endif %}\n\n  {% if page.comments == true %}\n    {% include comments.html %}\n  {% endif %}\n</article>\n\n<aside class=\"page__aside\">\n  {% if page.toc %}\n    <nav class=\"page__toc\">\n      <h3 class=\"title\">On this page:</h3>\n      {{ content | toc_only }}\n    </nav>\n  {% endif %}\n  {% if page.tags %}\n    <nav class=\"page__taxonomy\">\n      <h3 class=\"title\">Explore more:</h3>\n      {% for tag in page.tags %}<span><a href=\"{{ tag | replace:' ','-' | downcase | prepend: '/tag/' | append: '/' | relative_url }}\">{{ tag }}</a></span>{% endfor %}\n    </nav>\n  {% endif %}\n  {% if site.related_posts.size >= 1 %}\n    {% include page__related.html %}\n  {% endif %}\n  <p><a class=\"back-to-top\" href=\"#nav-primary\">↑ back to top</a></p>\n</aside>\n"
  },
  {
    "path": "src/_pages/404.md",
    "content": "---\npermalink: /404.html\ntitle: \"Your pixels are on another canvas\"\nlayout: page\nexcerpt: \"Page not found. Your pixels are on another canvas.\"\ndate: 2016-08-26\nsitemap: false\n---\n\nSorry, but the page you were trying to view has moved or does not exist -- perhaps you can [find it here](/sitemap/ \"sitemap\") or by searching below.\n{: .page__excerpt}\n\n<div class=\"typed__secondary\">\n  <script type=\"text/javascript\">\n    var GOOG_FIXURL_LANG = 'en';\n    var GOOG_FIXURL_SITE = '{{ site.url }}'\n  </script>\n  <script type=\"text/javascript\" src=\"https://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js\"></script>\n</div>\n"
  },
  {
    "path": "src/_pages/about.md",
    "content": "---\npermalink: /about/\ntitle: \"About Michael Rose\"\ndate: 2016-08-26\nlast_modified_at: 2018-03-22T10:19:56-04:00\nexcerpt: \"Michael Rose is just another boring, tattooed, time traveling designer from Buffalo New York.\"\nimage:\n  path: &image /assets/images/about-michael-collage-2016.jpg\n  width: 1600\n  height: 640\n  feature: *image\ntoc: true\n---\n\nOh hey --- I'm Michael Rose, just another boring, tattooed, time traveling designer from Buffalo, New York.\n\nI'm into drawing [portraits of strangers](/procreate-paintings/) on an iPad Pro, eating popcorn and [chicken wings](http://www.duffswings.com \"Duff's Famous Wings\"), watching dust collect on my [vinyl record collection](http://www.discogs.com/user/mmistakes/collection), and playing single-player console exclusives[^videogames].\n\n[^videogames]: **Nintendo Account:** mmistakes, **Xbox Live**: [anotherJPEG](https://account.xbox.com/en-US/Profile?gamerTag=anotherJPEG), **PlayStation Network**: [anotherjpeg](https://my.playstation.com/profile/anotherjpeg)\n\nWhen I'm not drawing on my iPad or releasing open source [Jekyll themes](/work/jekyll-themes/), I work as a web designer and content administrator for a leading global provider of laboratory products. On any given day I'm designing user-interfaces, building landing pages, and massaging content in and out of a CMS with the help of HTML, CSS, and JavaScript.\n\nAnd if that wasn't enough to keep me busy --- I'm also the father of [twin girls](/tag/twins/) and married to a [subscription box addicted vegan](https://2littlerosebuds.com \"Wendy Rose\").\n\n{% figure class:\"gallery-2-col\" caption:\"Self portrait and my 2 little rosebuds drawn with Paper by FiftyThree.\" %}\n[![Michael Rose self portrait](/assets/images/michael-rose-paper-portrait-sidebar.jpg)]({% post_url /paperfaces/2014-05-19-mmistakes-2-portrait %})\n[![Everly and Chloe drawing](/assets/images/paperfaces-rosebuds-2-900.jpg)]({% post_url /paperfaces/2014-08-03-rosebuds-2-portrait %})\n{% endfigure %}\n\n{% figure caption:\"My tattoos are a mess of line and words. Don't ask me to explain them --- because I can't.\" %}\n![Michael Rose's tattoos](/assets/images/michael-rose-tattoos.png)\n{% endfigure %}\n\n## About the site\n\nSo what does this all have to do with **made mistakes** and why did I name the website this? \n\nIt vaguely has something to do with that whole happy accident thing, where a mistake can turn out to be something great and unplanned. But to be honest I was just looking for a short, memorable sounding domain name.\n\nIn May of 2004 I purchased mademistakes.com, and threw up a Macromedia Flash splash screen (hey remember those?) while I worked on building out my portfolio. For the next couple of years I would experiment with various content management systems ([Movable Type](http://www.movabletype.org/) → [Textpattern](http://textpattern.com/) → [Wordpress](http://wordpress.org/) → [Indexhibit](http://www.indexhibit.org/)), developing minimalistic themes and learning what I could about HTML, CSS, JavaScript, PHP, and MySQL databases.\n\nI've since decided to abandon using a CMS in favor of black magick and [Jekyll](http://jekyllrb.com/) to [generate flat files]({% post_url /articles/2012-03-19-going-static %}) for improved performance and security. Building layouts, stylesheets, feeds, and assets from scratch was challenging at first, but the knowledge gained made it all worth it.\n\n## How to support Made Mistakes\n\nI write tutorials and maintain a few [open source projects](https://github.com/mmistakes?utf8=%E2%9C%93&tab=repositories&q=&type=source&language=) for fun. If you've found any of them useful, here's how you can show thanks:\n\n1.  Follow me on [Twitter](https://twitter.com/mmistakes) or subscribe to one of my [RSS feeds](/support/#subscribe-to-the-feeds).\n2.  Buy anything at Amazon using [this link](https://www.amazon.com/?_encoding=UTF8&camp=1789&creative=390957&linkCode=ur2&tag=mademist-20&linkId=P557QDXPWEYIZTDS) and I'll earn a small commission.\n3.  Send a donation via [PayPal](https://www.paypal.me/mmistakes) or [Square Cash](https://cash.me/$mmistakes).\n\n## Selected interviews\n\n- [**The Story of PaperFaces**](https://web.archive.org/web/20140216060340/http://anewatlantis.com/2013/01/the-story-of-paperfaces/) --- A New Atlantis\n- [**...don't break the chain**](http://blog.sktchy.com/post/78751385093/dont-break-the-chain) --- Sktchy artist feature\n\n## Honorable mentions\n\n- [**22 Gorgeous Pieces Of Art You Won't Believe Were Drawn On An iPad**](http://www.businessinsider.com/gorgeous-ipad-art-2015-1?op=1) --- Business Insider\n- [**This Summer We Learned About PaperFaces**](http://madewithpaper.fiftythree.com/post/36767754768/this-summer-we-learned-about-paper-faces-by) --- FiftyThree\n\n*[CMS]: Content Management System\n"
  },
  {
    "path": "src/_pages/articles.md",
    "content": "---\nlayout: archive\npermalink: /articles/\ntitle: &title \"Articles\"\nalt_title: *title\nexcerpt: &excerpt \"A collection of thoughts, inspiration, mistakes, and other long-form minutia I've written. For smaller, more regular tidbits --- peruse the [notes section](/notes/).\"\nintroduction: *excerpt\npagination: \n  enabled: true\n  category: articles\ndate: 2016-08-26\n---\n\n{% include popular-topics.html %}\n"
  },
  {
    "path": "src/_pages/contact.md",
    "content": "---\npermalink: /contact/\ntitle: \"Contact\"\ndate: 2016-08-26\nlast_modified_at: 2018-02-13T12:42:42-05:00\nexcerpt: \"Preferred methods of sending your questions, inquires, messages, and love letters to me.\"\n---\n\nHave questions about me, this website, or creating art on an iPad?\n\nShort and succinct messages [via Twitter](https://twitter.com/mmistakes) is the way to ask. You can also lurk me [elsewhere on the web](/support/#follow-me-on-social-media), if that's your thing.\n\nIf you have a question, please read my [frequently asked questions section](/faqs/) first to make sure I haven't already answered it. For Jekyll and theme help it's best to submit an issue on the appropriate GitHub repo:\n\n- [Minimal Mistakes Jekyll theme](https://github.com/mmistakes/minimal-mistakes/issues)\n- [So Simple Jekyll theme](https://github.com/mmistakes/so-simple-theme)\n- [Basically Basic Jekyll theme](https://github.com/mmistakes/jekyll-theme-basically-basic)\n\nFor anything else, use the contact form below.\n\n<form id=\"form1\" name=\"form1\" accept-charset=\"UTF-8\" autocomplete=\"off\" enctype=\"multipart/form-data\" method=\"post\" novalidate action=\"https://mademistakes.wufoo.com/forms/zr2w1zk1hbcjv0/#public\">\n  <div>\n    <label id=\"title7\" for=\"Field7\">Name\n      <input id=\"Field7\" name=\"Field7\" type=\"text\" spellcheck=\"false\" maxlength=\"255\" required placeholder=\"Your name\">\n    </label>\n  </div>\n  <div>\n    <label id=\"title2\" for=\"Field2\">Email address <small>(will remain private)</small>\n      <input id=\"Field2\" name=\"Field2\" type=\"email\" spellcheck=\"false\" maxlength=\"255\" required placeholder=\"email@address.com\">\n    </label>\n  </div>\n  <div>\n    <label id=\"title1\" for=\"Field1\">Message\n      <textarea id=\"Field1\" name=\"Field1\" spellcheck=\"true\" rows=\"10\" cols=\"50\" required></textarea>\n    </label>\n  </div>\n  <div>\n    <label id=\"title10\" for=\"Field10\">How&rsquo;d you hear about my website?\n      <input id=\"Field10\" name=\"Field10\" type=\"text\" maxlength=\"255\" placeholder=\"e.g. Searching the web\">\n    </label>\n  </div>\n  <div>\n    <button id=\"saveForm\" name=\"saveForm\" class=\"btn\" type=\"submit\">Send message</button>\n  </div>\n  <div class=\"hidden\">\n    <label for=\"comment\">Do not fill this out\n      <textarea name=\"comment\" id=\"comment\" rows=\"1\" cols=\"1\"></textarea>\n      <input type=\"hidden\" id=\"idstamp\" name=\"idstamp\" value=\"DXSyHZyBYpNZI+88LvVOKO8dSfd/5lyIeCQAXFVxeJY=\">\n    </label>\n  </div>\n</form>\n"
  },
  {
    "path": "src/_pages/faqs.md",
    "content": "---\nlayout: page\npermalink: /faqs/\ntitle: \"Frequently asked questions\"\ndate: 2016-08-26\nlast_modified_at: 2018-02-19T09:56:45-05:00\nexcerpt: \"Because no one likes to repeat things here's a compilation of answers to questions I'm often asked.\"\n---\n\nDid I leave something out that you were looking for an answer to? Feel free to reach out and [ask me](/contact/).\n\n{% assign other_faqs = site.faqs | where: \"type\", \"other\" | sort: \"order\" %}\n{% assign paper_faqs = site.faqs | where: \"type\", \"paper\" | sort: \"order\" %}\n\n<ul>\n{% for faq in other_faqs %}\n<li><a href=\"{{ faq.url }}\">{{ faq.title }}</a></li>\n{% endfor %}\n</ul>\n\n## iPad Art\n\n<ul>\n{% for faq in paper_faqs %}\n<li><a href=\"{{ faq.url }}\">{{ faq.title }}</a></li>\n{% endfor %}\n</ul>\n"
  },
  {
    "path": "src/_pages/mastering-paper.md",
    "content": "---\nlayout: archive\npermalink: /mastering-paper/\ntitle: &title \"Mastering Paper for iOS\"\nalt_title: *title\nexcerpt: &excerpt \"Collection of tutorials written by an avid iPad illustrator to help you master [Paper for iOS](https://www.fiftythree.com/paper).\"\nintroduction: *excerpt\npagination: \n  enabled: true\n  category: mastering-paper\ndate: 2016-08-26\n---\n"
  },
  {
    "path": "src/_pages/notes.md",
    "content": "---\nlayout: archive\npermalink: /notes/\ncategory: notes\ntitle: &title \"Notes\"\nalt_title: *title\nexcerpt: &excerpt \"Small, bite sized content I've written. For longer, more thorough writing --- peruse the [articles section](/articles).\"\nintroduction: *excerpt\npagination: \n  enabled: true\n  category: notes\ndate: 2016-08-26\n---\n\n{% include popular-topics.html %}\n"
  },
  {
    "path": "src/_pages/portraits.md",
    "content": "---\npermalink: /portraits/\ntitle: \"Order a digital portrait\"\nexcerpt: \"Order a digital portrait drawn with the Paper app for iPad.\"\ndate: 2016-08-26\nlast_modified_at: 2014-09-22T11:27:18-04:00\ntoc: true\n---\n\nWant to be part of my PaperFaces Project and have a portrait drawn with the Paper app by FiftyThree for iPad? Well read on friend, here's how you go about commissioning one.\n\n<ul class=\"gallery-thumbnails\">\n{% for post in site.categories.paperfaces limit:5 %}\n  <li>\n    <a href=\"{{ post.url }}\" title=\"{{ post.title }}\"><img src=\"{{ post.image.thumbnail }}\" alt=\"\"></a>\n  </li>\n{% endfor %}\n</ul>\n\nUsing a photograph supplied by you as reference I draw my interpretation of it, illustrated in a loose watercolor and pencil style. I recommend going black and white since it's my favorite way to draw and often yields more realistic results. ([Portrait examples](/paperfaces/))\n\n<figure>\n  <img src=\"/assets/images/portrait-single-multiple.jpg\" alt=\"one face or multiple\">\n  <figcaption>Choose wisely: black and white, one face, or multiple.</figcaption>\n</figure>\n\n## Include a photo reference\n\nPlease include a link to a high resolution image (the larger the better) in the **portrait reference** field below. My drawings are only as strong as the photos I have to work with. Lighting, composition, and resolution all matter. I've gotten pretty good at capturing realism with Paper, but I do have limits and can only draw what I can see. When in doubt, please ask me before placing an order.\n\n## Then I draw\n\nI'm pretty quick at getting to orders and average a 24--48 hour turn around to complete a portrait. Once finished I'll tweet out the drawing so my followers can enjoy it and then email you the original PNG file[^png-file] with adequate resolution to make an 8&times;10 (or A4 for my European friends) print. If by chance you're purchasing a drawing as a gift and would like me to hold off tweeting it for a few days just let me know. Wouldn't want to ruin the surprise...\n\n[^png-file]: Paper by FiftyThree exports a PNG file measuring 2048&times;1536 pixels, viewable in most graphics software. You get the raw file --- unaltered and without a watermark.\n\n## What'll be stranger?\n\nBlack and white or color? One face or multiple? <span class=\"badge info\">Starting at $25.00 USD</span>\n\n**At the moment I'm not taking on any new portrait commissions.** After drawing close to 900 faces I need a vacation and time to regroup. Sorry :-(\n\n<fieldset>\n  <form action=\"https://www.paypal.com/cgi-bin/webscr\" method=\"post\" target=\"_top\">\n    <input type=\"hidden\" name=\"cmd\" value=\"_s-xclick\">\n    <input type=\"hidden\" name=\"hosted_button_id\" value=\"9UUR6AQ25G9EW\">\n    <input type=\"hidden\" name=\"on0\" value=\"Type of Drawing\">\n    <label style=\"margin:10px 0;\">Type of Drawing</label>\n    <select name=\"os0\" style=\"width: 100%;\">\n      <option value=\"One face - black and white\">One face - black and white $25.00 USD</option>\n      <option value=\"One face - color\">One face - color $30.00 USD</option>\n      <option value=\"Multiple faces - black and white\">Multiple faces - black and white $35.00 USD</option>\n      <option value=\"Multiple faces - color\">Multiple faces - color $40.00 USD</option>\n    </select>\n    <input type=\"hidden\" name=\"on1\" value=\"Portrait Reference URL\">\n    <label style=\"margin:10px 0;\">Portrait Reference URL</label>\n    <input type=\"text\" name=\"os1\" maxlength=\"200\">\n    <input type=\"hidden\" name=\"currency_code\" value=\"USD\">\n    <input type=\"submit\" value=\"Order Now\" class=\"btn btn-disabled\" name=\"submit\" alt=\"PayPal - The safer, easier way to pay online!\" style=\"margin:10px 0;\" onMouseDown=\"ga('send', 'event', 'button', 'click', 'PaperFaces Order');\">\n    <img alt=\"\" border=\"0\" src=\"https://www.paypalobjects.com/en_US/i/scr/pixel.gif\" width=\"1\" height=\"1\">\n  </form>\n</fieldset>\n\n{% notice %}\n####Usage and Copyright:\n\nEach PaperFaces portrait is protected under a [Creative Commons License](/terms/ \"Attribution-NonCommercial 4.0 International\"). That means you're free to use them as avatars, share on social media, or print out for personal use --- it's your face so do with it as you please.\n{% endnotice %}\n\n## What others are saying about PaperFaces\n\n<blockquote class=\"twitter-tweet\" lang=\"en\"><p>This portrait of yours truly by <a href=\"https://twitter.com/mmistakes\">@mmistakes</a> is one of the most glorious things you’ll ever see <a href=\"http://t.co/ovzxGSw72q\">http://t.co/ovzxGSw72q</a></p>&mdash; Matthew Rex (@matthewrex) <a href=\"https://twitter.com/matthewrex/statuses/458667196634640384\">April 22, 2014</a></blockquote>\n\n<blockquote class=\"twitter-tweet\" lang=\"en\"><p><a href=\"https://twitter.com/twittalkin\">@twittalkin</a> here is the pic of Jason by <a href=\"https://twitter.com/mmistakes\">@mmistakes</a> using Paper by <a href=\"https://twitter.com/FiftyThree\">@FiftyThree</a> Incredible talent!</p>&mdash; JTM (@thepuckheads) <a href=\"https://twitter.com/thepuckheads/statuses/450113132556341249\">March 30, 2014</a></blockquote>\n\n<blockquote class=\"twitter-tweet\" lang=\"en\"><p><a href=\"https://twitter.com/mmistakes\">@mmistakes</a> Well, this makes me want to give up on everything. &#10;&#10;Awesome work!</p>&mdash; Andy Hughes (@gorillandy) <a href=\"https://twitter.com/gorillandy/statuses/468947522862723072\">May 21, 2014</a></blockquote>\n\n<blockquote class=\"twitter-tweet\" data-conversation=\"none\"><p><a href=\"https://twitter.com/mmistakes\">@mmistakes</a> Thanks so much for making this! Love the no face ;)</p>&mdash; Omri Mor (@omri_mor) <a href=\"https://twitter.com/omri_mor/statuses/255021100780625922\">October 7, 2012</a></blockquote>\n\n<blockquote class=\"twitter-tweet\"><p>The talented <a href=\"https://twitter.com/mmistakes\">@mmistakes</a> draws our about page: <a href=\"https://twitter.com/FiftyThree\">@FiftyThree</a> — faces without faces of all the makers <a href=\"http://t.co/Aynukw2thh\">http://t.co/Aynukw2thh</a></p>&mdash; Georg Petschnigg (@georgpetschnigg) <a href=\"https://twitter.com/georgpetschnigg/statuses/341333760433848321\">June 2, 2013</a></blockquote>\n\n<blockquote class=\"twitter-tweet\" data-conversation=\"none\"><p><a href=\"https://twitter.com/mmistakes\">@mmistakes</a> <a href=\"https://twitter.com/Mike_FTW\">@mike_ftw</a> haha. Awesome sauce. Best one yet!</p>&mdash; Q (@maxquattromani) <a href=\"https://twitter.com/maxquattromani/statuses/248245003300794368\">September 19, 2012</a></blockquote>\n\n<blockquote class=\"twitter-tweet\" lang=\"en\"><p><a href=\"https://twitter.com/mmistakes\">@mmistakes</a> Thank you so much! I honestly thought you wouldn&#39;t find time! It reminds me a little of slenderman - in an awesome way! </p>&mdash; Anne Køhler Nielsen (@Annekoehler) <a href=\"https://twitter.com/Annekoehler/statuses/393850987171282944\">October 25, 2013</a></blockquote>\n\n<blockquote class=\"twitter-tweet\"><p>My last RT is too fucking cool, feel like Rose from Titanic <a href=\"https://twitter.com/search?q=%23frenchgirl&amp;src=hash\">#frenchgirl</a> <a href=\"https://twitter.com/mmistakes\">@mmistakes</a></p>&mdash; callum (@clamteeth) <a href=\"https://twitter.com/clamteeth/statuses/248683914368004096\">September 20, 2012</a></blockquote>\n\n<blockquote class=\"twitter-tweet\" data-media=\"none\"><p>“<a href=\"https://twitter.com/mmistakes\">@mmistakes</a>: <a href=\"https://twitter.com/search?q=%23PaperFaces&amp;src=hash\">#PaperFaces</a> <a href=\"https://twitter.com/search?q=%23MadeWithPaper&amp;src=hash\">#MadeWithPaper</a> <a href=\"http://t.co/Eo72rx2dEC\">pic.twitter.com/Eo72rx2dEC</a>”&#10;&#10;Thank you! I feel honored - this looks very well done!</p>&mdash; Finn (@invalididentity) <a href=\"https://twitter.com/invalididentity/statuses/348884007892692994\">June 23, 2013</a></blockquote>\n\n<blockquote class=\"twitter-tweet\" data-conversation=\"none\" lang=\"en\"><p>Whaaat <a href=\"https://twitter.com/mmistakes\">@mmistakes</a> did a portrait of me, and it is beyond sublime. Beyond. <a href=\"http://t.co/G2txlVXpzW\">pic.twitter.com/G2txlVXpzW</a></p>&mdash; Tiny Camera Ryan (@timcameronryan) <a href=\"https://twitter.com/timcameronryan/statuses/393597807455502336\">October 25, 2013</a></blockquote>\n"
  },
  {
    "path": "src/_pages/sitemap.md",
    "content": "---\nlayout: page\npermalink: /sitemap/\ntitle: \"Sitemap\"\nexcerpt: \"An index of all the pages found on mademistakes.com\"\ndate: 2016-08-26\nlast_modified_at: 2019-02-15\n---\n\nA hierarchical breakdown of all the sections and pages found on the site. For you robots out there, here is an [XML version](/sitemap.xml) available for your crawling pleasure.\n\n## Pages\n\n- [About](/about/)\n- [Contact](/contact/)\n- [Frequently asked questions](/faqs/)\n- [Show your support](/support/)\n- [Terms and policies](/terms/)\n- [Style guide](/style-guide/)\n- [Tag index](/tag/)\n\n## [Articles](/articles/)\n\n<ul>\n  {% for post in site.categories.articles %}\n    {% include post-list.html %}\n  {% endfor %}\n</ul>\n\n## [Notes](/notes/)\n\n<ul>\n  {% for post in site.categories.notes %}\n    {% include post-list.html %}\n  {% endfor %}\n</ul>\n\n## [Mastering Paper for iOS](/mastering-paper/)\n\n<ul>\n  {% for post in site.categories.mastering-paper %}\n    {% include post-list.html %}\n  {% endfor %}\n</ul>\n\n## [Portfolio work](/work/)\n\n<ul>\n  {% for post in site.work %}\n    {% include post-list.html %}\n  {% endfor %}\n</ul>\n"
  },
  {
    "path": "src/_pages/style-guide.md",
    "content": "---\nlayout: page\npermalink: /style-guide/\ntitle: \"Style guide\"\ndate: 2016-08-26\nlast_modified_at: 2015-02-05T10:32:14-05:00\nexcerpt: \"A handy collection of all the colors, typography, UI patterns, and components used on Made Mistakes.\"\n---\n\nA handy collection of all the colors, typography, UI patterns, and components used on Made Mistakes.\n\nWhere applicable links to a component's Sass partial[^sass] and/or Jekyll include are provided, along with short descriptions of typical usage.\n\n[^sass]: Sass partials are written using the Sassy SCSS syntax (or SCSS) and can be found in [`src/assets/stylesheets/`](https://github.com/{{ site.repository }}/tree/master/src/assets/stylesheets).\n\n{% assign entries = site.colors %}\n{% assign componentsByType = site.components | group_by:\"type\" %}\n\n<div markdown=\"0\">\n<select name=\"newurl\" id=\"component-select\" onChange=\"window.location.replace(this.options[this.selectedIndex].value)\" aria-label=\"Select a Component\" markdown=\"0\">\n  <option selected markdown=\"0\">Select a component</option>\n  <option value=\"#guide-color-palettes\" markdown=\"0\">Colors</option>\n  {% for type in componentsByType %}\n  <option value=\"#guide-{{ type.name }}\" markdown=\"0\">{{ type.name | capitalize }}</option>\n  {% for entry in type.items %}\n  <option value=\"#guide-{{ entry.title | slugify }}\" markdown=\"0\">&nbsp;&nbsp;&nbsp;{{ entry.title }}</option>\n  {% endfor %}\n  {% endfor %}\n</select>\n</div>\n\n<h2 id=\"guide-color-palettes\" class=\"cf\">Colors</h2>\n{% for entry in entries %}\n  {% include component-color.html %}\n{% endfor %}\n{% for type in componentsByType %}\n<h2 id=\"guide-{{ type.name }}\" class=\"cf\">{{ type.name | capitalize }}</h2>\n{% for entry in type.items %}\n{% include component.html %}\n{% endfor %}\n{% endfor %}\n"
  },
  {
    "path": "src/_pages/support.md",
    "content": "---\npermalink: /support/\ntitle: \"Show your support\"\ndate: 2016-08-26\nlast_modified_at: 2019-02-15T16:07:33-05:00\nexcerpt: \"If you like the free content I provide on Made Mistakes, here's how to show your thanks and motivate me to create more of it.\"\ntoc: true\n---\n\nThe tutorials, Jekyll themes, and other articles I publish have been a true labor of love for me. If you've found any of this content useful here's how to show your thanks and motivate me to create more.\n\n## Send a donation\n\nIf you'd like to support me so I can continue to provide free content and themes --- hit one of the buttons below. I accept PayPal, Square Cash, and Bitcoin: [`1KvHBVXcbeWhwcSRJQdcwVsUZBYnyH5enw`](/assets/images/bitcoin-qr.png \"Bitcoin QR code\").\n\n<div markdown=\"0\" class=\"btn--group\">\n  <a href=\"https://www.paypal.me/mmistakes\" onclick=\"ga('send', 'event', 'link', 'click', 'Send PayPal');\" title=\"Send PayPal\" class=\"btn\">\n    <svg class=\"icon icon--paypal\" width=\"16px\" height=\"16px\"><use xlink:href=\"{{ 'icons.svg#icon-paypal' | prepend: 'assets/icons/' | relative_url }}\"></use></svg> PayPal.me\n  </a>\n  <a href=\"https://cash.me/$mmistakes\" onclick=\"ga('send', 'event', 'link', 'click', 'Send Square Cash');\" title=\"Send Square Cash\" class=\"btn\">Square Cash</a>\n  <a href=\"/assets/images/bitcoin-qr.png\" onclick=\"ga('send', 'event', 'link', 'click', 'Send Bitcoin');\" class=\"btn\" title=\"1KvHBVXcbeWhwcSRJQdcwVsUZBYnyH5enw\">Bitcoin (BTC)</a>\n</div>\n\n## Buy something\n\nIf you shop on [Amazon.com](https://www.amazon.com/?_encoding=UTF8&camp=1789&creative=390957&linkCode=ur2&tag=mademist-20&linkId=P557QDXPWEYIZTDS), using my referral link below will earn me a small commission if you end up buying something. I also maintain an Amazon Wish List if you are feeling extra generous. :wink:\n\n<div markdown=\"0\" class=\"btn--group\">\n  <a href=\"https://www.amazon.com/?_encoding=UTF8&camp=1789&creative=390957&linkCode=ur2&tag=mademist-20&linkId=P557QDXPWEYIZTDS\" onclick=\"ga('send', 'event', 'link', 'click', 'Shop Amazon');\" class=\"btn\">\n    <svg class=\"icon icon--amazon\" width=\"16px\" height=\"16px\"><use xlink:href=\"{{ 'icons.svg#icon-amazon' | prepend: 'assets/icons/' | relative_url }}\"></use></svg> Shop Amazon\n  </a>\n  <a href=\"http://amzn.com/w/1K58RT2NS0SDP\" onclick=\"ga('send', 'event', 'link', 'click', 'Amazon Wish List');\" class=\"btn\">\n    <svg class=\"icon icon--amazon\" width=\"16px\" height=\"16px\"><use xlink:href=\"{{ 'icons.svg#icon-amazon' | prepend: 'assets/icons/' | relative_url }}\"></use></svg> My Amazon Wish List\n  </a>\n</div>\n\n## Spread the word\n\nHave a website or use social networking sites like Twitter, Facebook, Google+, Tumblr, or Pinterest? Please consider sharing the content found on **Made Mistakes** or linking to <https://mademistakes.com>.\n\n## Follow me on social media\n\nI post infrequently on social media --- I'm not the type to barf out a stream of rants and retweets in quick succession. Posts are typically speed painting videos, web design and development tidbits, sarcastic remarks, and photographic fragments from what little life I live.\n\nIf these sorts of things interest you, follow along on:\n\n- [Twitter](https://twitter.com/mmistakes)\n- [Instagram](https://instagram.com/mmistakes/)\n- [GitHub](https://github.com/mmistakes)\n- [YouTube](https://www.youtube.com/user/anotherjpeg)\n- [Facebook](https://www.facebook.com/michaelrose)\n\n## Subscribe to the feeds\n\nThe main feed[^feed] for everything on Made Mistakes.\n\n- Atom: [{{ 'atom.xml' | relative_url }}]({{ 'atom.xml' | relative_url }})\n- JSON: [{{ 'feed.json' | relative_url }}]({{ 'feed.json' | relative_url }})\n\n### Feeds by topic\n\n- Blog articles: [{{ 'articles.xml' | relative_url }}]({{ 'articles.xml' | relative_url }})\n- Notes: [{{ 'notes.xml' | relative_url }}]({{ 'notes.xml' | relative_url }})\n- Paper for iOS tutorials: [{{ 'mastering-paper.xml' | relative_url }}]({{ 'mastering-paper.xml' | relative_url }})\n- PaperFaces iPad portraits: [{{ 'paperfaces.xml' | relative_url }}]({{ 'paperfaces.xml' | relative_url }})\n- Procreate iPad paintings: [{{ 'procreate-paintings.xml' | relative_url }}]({{ 'procreate-paintings.xml' | relative_url }})\n\n[^feed]: Right click any of the feed links found on this page and add to your feed reader of choice. My favorite is [feedly](https://feedly.com), which syncs your subscriptions across all browsers and mobile devices.\n"
  },
  {
    "path": "src/_pages/tag.md",
    "content": "---\nlayout: archive\npermalink: /tag/\ntitle: \"Tag index\"\ndate: 2016-08-26\nlast_modified_at: 2019-02-20T14:30:19-05:00\nexcerpt: \"An archive of posts organized by topic.\"\n---\n\nAn archive of {{ site.posts | size }} posts, organized by the following {{ site.tags | size }} topics.\n\n<div class=\"entries__columns\">\n  <h2 class=\"title\">Browse by topic</h2>\n  <ul>\n    {% assign sorted_tags = site.tags | sort_tags_by_name %}\n    {% for tag in sorted_tags %}\n      <li>\n        <a href=\"/tag/{{ tag[0] | replace:' ','-' | downcase }}/\">\n          <strong>{{ tag[0] }}</strong> <span class=\"count\">{{ tag[1] }}</span>\n        </a>\n      </li>\n    {% endfor %}\n  </ul>\n</div>\n"
  },
  {
    "path": "src/_pages/terms.md",
    "content": "---\npermalink: /terms/\ntitle: \"Terms and policies\"\ndate: 2016-08-26\nlast_modified_at: 2019-02-06\nexcerpt: \"Made Mistakes privacy policy, license, and other legal stuff you won't read.\"\ntoc: true\n---\n\nThis is my personal website written and edited by me. Your use of this website, in any and all forms, constitutes an acceptance of these terms and policies. This page is reviewed and revised from time to time.\n\nAll content provided is for informational purposes only. The articles and posts on this website are my own and don't necessarily represent the positions, strategies, or opinions of my employer or its subsidiaries. I make no representations as to the accuracy or completeness of any information found here or by following any links. I will not be liable for any errors or omissions in this information nor for the availability of this information. I will not be liable for any losses, injuries, or damages from the display or use of this information.\n\n## Privacy policy\n\nAt MadeMistakes.com, the privacy of my visitors is extremely important. This Privacy Policy outlines the types of personal information that is received and collected and how it is used.\n\nFirst and foremost, I will never share your email address or any other personal information to anyone without your direct consent.\n\n### Log files\n\nLike many other websites, MadeMistakes.com uses log files to help learn about when, from where, and how often traffic flows to this site. The information in these log files include:\n\n- Internet Protocol addresses (IP)\n- Types of browser\n- Internet Service Provider (ISP)\n- Date and time stamp\n- Referring and exit pages\n- Number of clicks\n\nAll of this information is not linked to anything that is personally identifiable.\n\n### Cookies and web beacons\n\nMadeMistakes.com uses a cookie named `fullcss` to trigger the loading of cached CSS on future page loads.\n\nThird-party advertisers may also place and read cookies on your browser and/or use web beacons to collect information. MadeMistakes.com has no access or control over these cookies. You should review the respective privacy policies on any and all third-party ad servers for more information regarding their practices and how to opt-out.\n\nIf you wish to [disable cookies](https://cookies.insites.com/disable-cookies/), you may do so through your web browser options. Instructions for doing so can be found on the specific web browsers' websites.\n\n#### Amazon\n\nAmazon, a third party affiliate marketing network, uses cookies to help make sure I get a commission when you buy a product after clicking on a link or ad banner that takes you to the site of one of their merchants. Read [Amazon's Privacy Notice](https://www.amazon.com/gp/help/customer/display.html?nodeId=468496).\n\n#### Cloudflare\n\nCloudflare, Inc. is a U.S. company that provides content delivery network services, DDoS mitigation, Internet security and distributed domain name server services. Cloudflare's `__cfduid` cookie is used to identify individual clients behind a shared IP address and apply security settings on a per-client basis. Read [Cloudflare's Privacy Policy](https://www.cloudflare.com/privacypolicy/).\n\n#### Google Analytics\n\nGoogle Analytics is a web analytics tool I use to help understand how visitors engage with this website. It reports website trends using cookies and web beacons without identifying individual visitors. Read [Google's Privacy Policy](https://policies.google.com/privacy?hl=en).\n\n#### Netlify\n\nNetlify is a cloud computing company that offers hosting and serverless backend services for static websites. It features continuous deployment from Git across a global application delivery network, serverless form handling, support for AWS Lambda functions, and full integration with Let's Encrypt. Read [Netlify's Privacy Policy](https://www.netlify.com/privacy/).\n\n## Disclosure policy\n\nI make money on this website through affiliate programs. If you click an affiliate link or ad banner and buy the product, you help support this website because I'll get a percentage of that sale.\n\nWhat this means for you:\n\n- I became an affiliate to earn revenue towards the costs of running and maintaining this website. Where I have direct control over which ads are served on this website I offer only products that are directly related to the topic of this website and products that a reader/subscriber would have a genuine interest in or need of.\n- I do not and will not recommend a product just for the sake of making money.\n- I do not let the compensation I receive influence the content, topics, posts, or opinions expressed on this website.\n- I respect and value my readers too much to write anything other than my own genuine and objective opinions and advice.\n\nJust like this website, my disclosure policy is a work in progress. As the revenue streams evolve, so will this page.\n\n## License\n\nAll original content (e.g. articles, blog posts, illustrations, artwork, and photographs) available on MadeMistakes.com is released under a [Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License](http://creativecommons.org/licenses/by-nc-nd/3.0/deed.en_US) unless otherwise noted. Basically this means you are free to share, transmit, distribute, alter, transform, and build on my work just as long as you don't use it for commercial purposes without my prior written consent.\n\n### Attribution\n\nIf you're inclined to give credit --- a link back to the source article attributed to either [Made Mistakes](https://mademistakes.com) or [Michael Rose](https://mademistakes.com) is good enough for me. If you don't want to attribute my content, hey that's cool too. Just don't go stealing stuff and republishing it as your own.\n\n*Last updated: {{ page.last_modified_at | date: \"%B %d, %Y\" }}*\n"
  },
  {
    "path": "src/_pages/work.md",
    "content": "---\nlayout: archive_work\npermalink: /work/\ncategory: work\ntitle: \"Works\"\nexcerpt: &excerpt \"A selection of things I've designed, illustrated, and developed.\"\nintroduction: *excerpt\ndate: 2016-08-26\n---\n"
  },
  {
    "path": "src/_plugins/filters.rb",
    "content": "module Jekyll\n  module Filters\n    # Sort a hash using String#casecmp the case-insensitive version of String#<=>\n    # By default, Enumerable#sort uses <=>\n    # See Add sort_natural to jekyll/filters.rb https://github.com/jekyll/jekyll/issues/6290\n    def sort_natural(input)\n      input.sort { |apple, orange| apple.first.casecmp(orange.first) }\n\n      # Other solution:\n      #input.sort_by { |hash| hash.first.downcase }\n    end\n\n    def sort_tags_by_size(tags)\n      tags.sort_by { |tag| tag.last.length }.reverse\n\n      # Other solution:\n      #tags.sort { |tag1, tag2| tag2.last.length <=> tag1.last.length }\n    end\n  end\nend\n\nLiquid::Template.register_filter(Jekyll::Filters)\n"
  },
  {
    "path": "src/_plugins/lazyload.rb",
    "content": "module Jekyll\n  class LazyLoadTag < Liquid::Tag\n\n    def initialize(tag_name, markup, tokens)\n      @markup = markup\n      super\n    end\n\n    def render(context)\n      # Settings\n      site = context.registers[:site]\n      url = site.config[\"url\"]\n      baseurl = site.config[\"baseurl\"] || \"\"\n\n      # Render any Liquid variables in tag arguments and un-escape template code\n      render_markup = Liquid::Template.parse(@markup).render(context).gsub(/\\\\\\{\\\\\\{|\\\\\\{\\\\%/, '\\{\\{' => '{{', '\\{\\%' => '{%')\n\n      # Extract tag segments\n      markup = /(?<html_attr>[\\s\\S]+)?$/.match(render_markup)\n\n      unless markup\n        Jekyll.logger.abort_with(\"[Jekyll]\", \"Can't read this tag: #{@markup}\")\n      end\n\n      # Process attributes\n      html_attr = if markup[:html_attr]\n        Hash[ *markup[:html_attr].scan(/(?<attr>[^\\s=\"]+)(?:=\"(?<value>[^\"]+)\")?\\s?/).flatten ]\n      else\n        {}\n      end\n\n      # Make relative paths into absolute\n      unless html_attr[\"src\"] == nil || html_attr[\"data-src\"] == nil\n        unless html_attr[\"src\"] =~ (/https?:\\/\\//)\n          html_attr[\"src\"] = File.join(url, baseurl, html_attr[\"src\"])\n        end\n\n        unless html_attr[\"data-src\"] =~ (/https?:\\/\\//)\n          html_attr[\"data-src\"] = File.join(url, baseurl, html_attr[\"data-src\"])\n        end\n      end\n\n      image_source = html_attr[\"data-src\"]\n\n      # Create a low-quality image placeholder string\n      if html_attr[\"src\"] == nil\n        lqip = \"src=\\\"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\\\"\"\n      end\n\n      # Create a string of all transformed attributes\n      html_attr_string = html_attr.inject('') { |string, attrs|\n        if attrs[1]\n          string << \"#{attrs[0]}=\\\"#{attrs[1]}\\\" \"\n        else\n          string << \"#{attrs[0]} \"\n        end\n      }\n\n      # Output image tag with everything together\n      \"\\n<noscript><img src=\\\"#{image_source}\\\" alt=\\\"\\\"></noscript>\\n<img #{lqip} #{html_attr_string} class=\\\"lazyload fade-in\\\">\"\n    end\n  end\nend\n\nLiquid::Template.register_tag('lazyload', Jekyll::LazyLoadTag)\n"
  },
  {
    "path": "src/_plugins/markdown_img_replacement.rb",
    "content": "# Description: Jekyll plugin to replace Markdown image syntax with lazyload HTML markup\n\nJekyll::Hooks.register :documents, :pre_render do |document, payload|\n  docExt = document.extname.tr('.', '')\n  # only process if we deal with a markdown file\n  if payload['site']['markdown_ext'].include? docExt\n    newContent = document.content.gsub(/(?:!\\[(.*?)\\]\\((.*?)\\))/, '<noscript><img src=\"\\2\" alt=\"\\1\"></noscript><img src=\"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-src=\"\\2\" alt=\"\\1\" class=\"lazyload fade-in\">')\n    document.content = newContent\n  end\nend\n"
  },
  {
    "path": "src/_plugins/mm_seo_title.rb",
    "content": "module Jekyll\n  class SeoTag\n    class Drop < Jekyll::Drops::Drop\n      def title\n        @title ||= begin\n          if site_title && page_title != site_title\n            page_title + TITLE_SEPARATOR + site_title\n          elsif site_description && site_title\n            site_title + TITLE_SEPARATOR + site_description\n          else\n            page_title || site_title\n          end\n        end\n\n        return page_title + \" - \" + page_number + TITLE_SEPARATOR + site_title if page_number\n\n        @title\n      end\n\n      def page_number\n        return unless @context[\"paginator\"] && @context[\"paginator\"][\"page\"]\n\n        current = @context[\"paginator\"][\"page\"]\n        total = @context[\"paginator\"][\"total_pages\"]\n\n        return \"page #{current} of #{total}\" if current > 1\n      end\n    end\n  end\nend\n"
  },
  {
    "path": "src/_plugins/notice.rb",
    "content": "# Source: https://stackoverflow.com/questions/19169849/how-to-get-markdown-processed-content-in-jekyll-tag-plugin\n\nmodule Jekyll\n  module Tags\n    class NoticeTag < Liquid::Block\n\n      def initialize(tag_name, type, tokens)\n        super\n        type.strip!\n        if %w(info danger warning success).include?(type)\n          @type = type\n        else\n          @type = \"\"\n        end\n      end\n\n      def render(context)\n        site = context.registers[:site]\n        converter = site.find_converter_instance(::Jekyll::Converters::Markdown)\n        output = converter.convert(super(context))\n        \"<div class=\\\"notice #{@type} no_toc_section\\\">#{output}</div>\"\n      end\n    end\n  end\nend\n\nLiquid::Template.register_tag('notice', Jekyll::Tags::NoticeTag)\n"
  },
  {
    "path": "src/_plugins/sort_name.rb",
    "content": "# Jekyll Sort by Name and Post Count Filter\n# http://www.codeofclimber.ru/2015/sorting-site-tags-in-jekyll/\n\n# Sort by name example:\n# <ul>\n# {% assign sorted_tags_by_name = site.tags | sort_tags_by_name %}\n# {% for tag in sorted_tags_by_name %}\n#   <li>\n#     <a href=\"/tag/{{ tag[0] }}\">\n#       {{ tag[0] }}\n#       <span>{{ tag[1] }}</span>\n#     </a>\n#   </li>\n# {% endfor %}\n# </ul>\n\n# Sort by post count example:\n# <ul>\n# {% assign sorted_tags_by_posts_count = site.tags | sort_tags_by_posts_count %}\n# {% for tag in sorted_tags_by_posts_count %}\n#   <li>\n#     <a href=\"/tag/{{ tag[0] }}\">\n#       {{ tag[0] }}\n#       <span>{{ tag[1] }}</span>\n#     </a>\n#   </li>\n# {% endfor %}\n# </ul>\n\nmodule Jekyll\n  module TagHelpersFilter\n    def sort_tags_by_name(tags)\n      return tags.map   { |k,v| [ k, v.size] }\n                 .sort_by { |x| [ x[0].downcase ] }\n    end\n\n    def sort_tags_by_posts_count(tags)\n      max_posts_count_among_all_tags = tags.max_by { |k,v| v.size }[1].size\n      return tags.map   { |k,v| [ k, v.size ] }\n                 .sort_by { |x| [ max_posts_count_among_all_tags - x[1], x[0].downcase ] }\n    end\n  end\nend\n\nLiquid::Template.register_filter(Jekyll::TagHelpersFilter)\n"
  },
  {
    "path": "src/_plugins/video_embed.rb",
    "content": "class YouTube < Liquid::Tag\n  def initialize(tagName, markup, tokens)\n    super\n\n    args = markup.split(' ')\n    @id = args[0]\n    @width = 640\n    @height = 360\n\n    if args[1]\n      @width = args[1]\n      @height = args[2]\n    end\n  end\n\n  def render(context)\n    \"<div class=\\\"responsive-video-container\\\"><iframe width=\\\"#{@width}\\\" height=\\\"#{@height}\\\" data-src=\\\"https://www.youtube-nocookie.com/embed/#{@id}?showinfo=0\\\" frameborder=\\\"0\\\" webkitallowfullscreen mozallowfullscreen allowfullscreen class=\\\"lazyload\\\"></iframe></div>\"\n  end\n\n  Liquid::Template.register_tag(\"youtube\", self)\nend\n\nclass Vimeo < Liquid::Tag\n  def initialize(tagName, markup, tokens)\n    super\n\n    args = markup.split(' ')\n    @id = args[0]\n    @width = 640\n    @height = 360\n\n    if args[1]\n      @width = args[1]\n      @height = args[2]\n    end\n  end\n\n  def render(context)\n    \"<div class=\\\"responsive-video-container\\\"><iframe width=\\\"#{@width}\\\" height=\\\"#{@height}\\\" src=\\\"https://player.vimeo.com/video/#{@id}?title=0&amp;byline=0\\\" frameborder=\\\"0\\\" webkitallowfullscreen mozallowfullscreen allowfullscreen class=\\\"lazyload\\\"></iframe></div>\"\n  end\n\n  Liquid::Template.register_tag(\"vimeo\", self)\nend\n"
  },
  {
    "path": "src/_posts/articles/2008-07-18-display-problems-imac-g5.md",
    "content": "---\ntitle: \"Three years of problems with an iMac G5\"\nexcerpt: \"Faulty logic boards, ambient sensors, and displays oh my!\"\nimage: \n  path: &image /assets/images/imac-glitch-feature.jpg\n  width: 1024\n  height: 512\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [articles]\ntags: [Apple, tech geek]\ntoc: true\n---\n\n## A little trip down Macintosh memory lane\n\nI've been a fan of Apple's computers every since 1997, when I started using them in my design classes. Around 2000 I bought my first Mac, a *Power Mac G4* with a 17\" Graphite monitor and fell in love. This machine treated me well for about 5 years until I finally gave it away to my younger brother. Through the years I added extra hard drives, increased the memory, swapped in a Superdrive, and updated from OS 9 to OS X Tiger with every major point update in between.\n\nSometime around 2004 I decided I needed more horsepower to do light video editing. I couldn't afford a Power Mac G5 so I focused on the iMac product line instead. I can remember holding out for months waiting for Apple to update from the lamp-shade form factor to the new slim and white design. And then waiting a few more months until they refreshed these new iMac's. Knowing it's best to wait while Apple irons out hardware kinks associated with a new design.\n\nIn February of '05 I finally decided it was time. Went to the Apple Store in the Walden Galleria Mall and looked around. Back in 2005 Apple wasn't putting *Bluetooth modules* in the iMac's as a standard option, so I had to pay extra. I really hate having a wireless keyboard and mouse since they eat batteries, but I wanted the option of Bluetooth in case I needed to wireless sync contacts with my Palm Treo. I also had them double the RAM which was stupid since everyone knows it's more expensive buying memory from Apple. Oh well.\n\n## And then things go wrong part 1\n\nFor the next 6 months my new iMac worked fine. The Fourth of July was right around the corner and I was super pumped for a nice long holiday weekend. When I went to use my computer that weekend the screen was blank. Weird. I turned it on and the white pulsating light in the right corner flashed and I heard the startup chime. Then the machine died again. Ugh.\n\nTried the obvious stuff like unplugging everything, resetting the PRAM, and rebooting. Nothing worked. Called **Apple Care** and they had me open it up and check some LED diagnostic lights to see what was up. Ever try to unscrew and open a computer while on the phone with some dude walking you through it? Yeah it sucked. After trying everything customer service suggested, I was told to take it to the Apple Store for a look.\n\n*[PRAM]: Parameter RAM\n\nBlah. Had to carry this heavy 20\" iMac through half of the mall to get to the store and have an Apple Genius play with it. He determined it was dead and I had to send it away for repairs. Everything would be covered since it was still under warranty with Apple Care. But it would take about a week to repair because of the holiday.\n\nWhen I got it back everything was fine again. I was worried my hard drive would have been wiped but all my data was in check. Turned out they had to replace the display bezel, power supply, and a bunch of other innards. The parts cost close to what I paid for the computer, so they probably replaced everything to be safe.\n\n## Logic board goes bad again\n\nFlash-forward two years later to my 28th birthday. Go to use my computer on my day off and guess what? Blank screen and powered down again. Great. After some troubleshooting I decide to take it back to the Apple Store to have a Genius look at it. No way I was sitting on hold for 2 hours again with Apple Care Support.\n\nIt was the middle of the day so no one was in the store except for a few goons who had problems with their iPods and were trying to scam new ones. The Apple Genius looks at my machine and says it's the logic board and power supply. \"Umm I just had those both replaced.\" Well whatever, Apple Care was covering it and they could do the repair in store this time so I wasn't too annoyed. Came back an hour later with a new logic board, power supply, and something called an ambient light sensor installed in my iMac. I guess when they replaced my logic board the first time it was with another bad one and before a recall on that part. Everything should be fine with it now… yeah right!\n\n## Three times the charm\n\nYesterday I woke up for work and went to check my email. Walked into my office and noticed my iMac was pretty loud with the fans were going full blast. \"Uh oh… that funny pixelated pattern flashing on my screen doesn't look good either.\" I didn't panic yet since I thought maybe it was software related and just needed a fresh restart. Force rebooted my machine and the gray Apple logo came up fine.\n\nThen the funny pixels and static showed up again. Tried to run the diagnostic disc that came with Apple Care to see what was wrong, but that wouldn't work either. Everything seemed to be functioning fine except for the display. Made an appointment with a Genius later in the day and hoped that I'd be eligible for the [iMac G5 Power & Video Repair Extension Program](http://docs.info.apple.com/article.html?artnum=302181) since my Apple Care Warranty ran out in February.\n\nGot to the Apple Store early after carrying my iMac through the Galleria Mall for the 3rd time! The Genius Bar was an absolute mess with all these people waiting to have their precious iPhone's and iPod's looked at because they did something stupid and broke them. One Genius in particular seemed extremely knowledgeable. All the other Genius' were asking him questions and for help, so I was pumped when he was going to look at my broken iMac.\n\nFired up the iMac and he knew right away what the problem was. \"You need a new logic board.\" Come on are you kidding me? How many times can this stupid part go bad? The worst part was this would cost me around $700 to repair since my machine wasn't under warranty. He wasn't even interested in the fact that they've replaced the same part twice before. The machine obviously has some major flaw if the same thing keeps breaking.\n\nI refuse to pay $700 to have something replaced that would probably break again. After thinking it over I decided to buy a new *iMac 20\" Intel Core 2 Duo* and pray it doesn't have any issues. As much as I love Apple products they really need to figure out these quality control issues. Everyone I know has had a major hardware issue with their products. I guess the days of getting 5+ years out of a Macintosh are long gone. :-(\n\nThe only thing I'm worried about now is transferring all my data and applications to the new machine. I've been running *Time Machine* to backup everything so it should be a non-issue. But we'll see just how painless Apple has made that. Because my old machine still turns on I'm going to try and put it in *Firewire target mode* and see if I can move everything over first. We'll see...\n"
  },
  {
    "path": "src/_posts/articles/2009-01-05-animal-crossing-city-folk-impressions.md",
    "content": "---\ntitle: \"Those city folk in Animal Crossing still love the gossip\"\nexcerpt: \"A lengthy review of Animal Crossing City Folk for the Nintendo Wii, some things never change.\"\nlast_modified_at: 2018-02-09T09:12:50-05:00\nimage: \n  path: &image /assets/images/animal-crossing-stuck-in-hole.jpg\n  width: 500\n  height: 268\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [articles]\ntags: [video games, review]\ntoc: true\n---\n\nSome things get better and some things never change. Going in I knew **Animal Crossing: City Folk** (for the Nintendo Wii) would be remaining mostly unchanged from its predecessor AC: Wild World on the DS. But frankly I didn't care and wanted to try it out for myself even after reading a few lackluster reviews. What really surprised me after playing was how it was able to hook me in...again. Which is pretty admirable seeing how it's the same damn game I've played TWICE before.\n\nThe *Animal Crossing* series has always been able to take boring tasks like paying a mortgage, picking weeds, making deliveries, planting flowers and trees, cleaning up trash, fishing, digging up fossils, catching bugs...and transform them into fun. The charm of the game is its ability to introduce new \"carrots\" along the way that encourage you to continue playing. Payoff your first mortgage to Tom Nook and you'll see exactly what I mean.\n\nThe following are some of the additions and changes to the series that have for the most part won me over.\n\n## How you play\n\nIn the Gamecube and DS versions, *time traveling* or TT was frowned upon. If you forgot to save before turning off your game or if you changed the internal clock, Resetti would popup and drone on about the ill effects of not saving properly. TT'ing was mostly used to make money quick with the drawback of having a ton of weeds and bugs in your house to deal with after.\n\n*[TT]: time traveling\n\nIn City Folk I've been known to TT a day or so to catch events I missed. This time around Resetti doesn't bug you and the game itself makes it easy to change the time before entering your town. If you TT your turnips will wilt, you will get weeds, you can't gain interest (unless you change the Wii's clock in the system settings), and town folk may leave. But used in moderation I see no problem with going back a few hours so you can enter Nook's or catch special visitors.\n\nA cool addition is the ability to import your character from *Animal Crossing: Wild World* on the Nintendo DS. Everything you obtained in your catalog makes the move (with the exception of some rare items). You don't bring over the physical items, house expansions, or accumulated bells. But you can re-purchase any of these items from Nook by asking to see your item catalog.\n\n{% figure caption:\"She knows where I sleep\" %}\n![Wendy's Animal Crossing character lurking over me](/assets/images/animal-crossing-me-wendy.jpg)\n{% endfigure %}\n\nIf you don't have access to the internet, but do have a DS, you can take your character to a friend's town through a process called **DS Suitcase**. The game essentially saves your character to a DS allowing you to go to a friend's town, mess around, earn bells/trade items/etc, save back to your DS, and then return to your town at home. Pretty handy if you don't have an Internet connection to visit a friend via **Nintendo WFC** and want to nab some foreign fruit.\n\nAt first I thought you could transfer your save from the Wii to a SD card and visit this way (similar to the Gamecube game). But sadly you can't since the save is locked to your console. Although if you installed the Homebrew Channel there are tools that let you transfer it and then edit your town data on a PC. Browsing around on YouTube I found a ton of crazy looking towns and glitches going on. While it might be fun to tinker with your town, I don't really see the point if you want to get the most enjoyment out of Animal Crossing. Getting rich quick and having all the rare stuff right away defeats the purpose of playing the game. Meh...\n\n## The town stuff\n\nFor the most part everything functions and looks like it did in Wild World. The exceptions being you can now have a fountain, windmill (helps with perfect town status), or lighthouse (helps bring in rare fish) built by donating enough bells to the town fund.\n\n{% figure caption:\"I created a Dharma Initiative flag from LOST.\" %}\n![Dharma flag from LOST](/assets/images/animal-crossing-dharma-initiative.jpg)\n{% endfigure %}\n\nI like how you can still customize the gate's flag and place patterns on the ground --- to do some really creative paths. Pattern making has been enhanced allowing you to create what are called *Pro Designs*. Now you can design clothing and work on the front, back, and sides independently to do elaborate and realistic costumes.\n\nWhat I don't like is how your house expands. Instead of building rooms off of the house like in Wild World, you get additional floors. I suppose it's nice to have a basement again but having a kitchen on the second floor doesn't really make a whole heck of sense does it?\n\nAnother small change is the floating balloons that appear randomly during the day. In WW they floated above the horizon and you'd hear a blowing wind sound effect. In City Folk they hover directly above you and a shadow can be seen on the ground below it.\n\nA feature I thought was cool at first has caused quite the uproar in the AC community. Walking the same route daily will wear the grass or snow away, leaving a dirt path in its wake. The effects aren't obvious until you quit for the day, but the ground does wear away and look like sand. The developers thought this would help visiting friends find their way through your town. At first I thought it might grow back, but I'm pretty sure it doesn't. Lame.\n\n## Controlling stuff\n\nUsing the Wiimote and nun-chuck combo is so much better than the DS d-pad and stylus combo. My hands no longer cramp from holding the DS and playing for long periods of time. Drawing patterns with a Wiimote kind of sucks, but what can you do. A select all button for quicker Nook transactions would have been nice too.\n\n### USB Keyboard support\n\nIf you plug in any USB keyboard it is instantly recognized by the Wii and allows you to type letters or chat with friends quickly. The function keys are mapped to your Dr. Shrunk emotions as well, which is convenient if you want to emote anger in a hurry.\n\n{% figure caption:\"My neighbors say some foul things.\" %}\n![I'm so wet](/assets/images/animal-crossing-im-so-wet.jpg)\n{% endfigure %}\n\n### Hidden commands\n\nPressing the 1 button on the Wiimote takes a screenshot and then you can transfer it to a SD card or post it to your Wii Message board to send to friends. Trying to take photos of the screen with a camera while struggling to keep the action in focus is a thing of the past. Now you can document all the inappropriate catch phrases and greetings your neighbors' say or rare Gyroids you may discover.\n\n{% figure caption:\"Look at those constellations.\" %}\n![Constellations](/assets/images/animal-crossing-constellations.jpg)\n{% endfigure %}\n\n## To the city\n\nFor the most part the City is a :zzz: fest. You can visit Dr. Shrunk and pay 800 bells to learn a new emotion (you can hold up to four at a time).\n\nGo to Gracie's and get ripped off on some furniture or 'trendy' clothing. Guess this changes depending on the season, so maybe something cool will pop up and I'll feel like spending 140,000 on a table... or not.\n\nLearn more about why you weren't chosen to be the model room of the week by the HRA, which is sort of cool since it pulls from all of your friends.\n\nPut your rare items up for auction or bid on your friends' stuff...cool...but not. I'm guessing this is a limitation of Nintendo WFC because you can only bid and sell on a certain day, and once an auction starts for the week you can't sell anything else. I've yet to remember what day I can actually sell shit on and go back to the city to auction something. Very inconvenient! Can you imagine if eBay only let you bid or sell items one day a week?\n\nA few more things you can do in the city:\n\n*\tChange your shoe color by getting them shined by some skunk.\n*\tCheck out Crazy Redd's forgeries of the week.\n*\tGet a haircut or put your Mii's face on at Shampoodles.\n*\tLearn what your town's charm is.\n*\tReceive a pinwheel, balloon, or bubbles from the balloon man who shows up on sunny days.\n\n## Online with Nintendo WiFi Connection\n\nThis could have been great, instead you get another under realized implementation of online functionality by Nintendo. Works just like Wild World --- you register friend codes and then you can open your gates or travel to only their towns. You can add other people to your list if they happen to be in a town you're visiting, but that's about it. No hub to meet other people in your extended circles --- no nothing.\n\nI get it --- Nintendo wants to keep it family friendly and safe by sticking with this awful friend code business. But why in the world do you force me to check with Copper every time I want to see if a friend is online? Why can't the Wii be online all the time and notify me when a friend is available ala Xbox Live or any other online service? Get with it Nintendo! Guess that's what you get when you duct tape two Gamecubes together...\n\n{% youtube aF78u3LQduw %}\n\n### Removed Wild World features?\n\nI haven't come across these yet so I'm not sure if they were removed or what.\n\n*\tFaceless character that asks for a new face.\n*\tMissing cats that randomly need finding.\n*\tBottled messages that wash up on your beach.\n\n## Closing thoughts\n\nI wonder with Microsoft trying to make the Xbox 360 appeal to the casual gamer, if they will ever create a true Animal Crossing clone? When **Viva Pinata** came out I thought that maybe it was their answer to Animal Crossing. Well not really seeing how all the fun stuff in Animal Crossing was nowhere to be found in Viva Pinata. I can only hope they're working on a true rip-off of the Animal Crossing franchise that has full avatar support and is backed by Xbox Live's excellent online experience. Oh and lots of achievements... damn that would be an amazing game.\n\nThat being said. Feel free to add my friend code and town information if you have **Animal Crossing: City Folk**. Leave a comment with your friend code and I'll add you. Always looking for more people to play with since it can be hard to find open towns late at night.\n\n![My Animal Crossing friend code](/assets/images/animal-crossing-friend-code.jpg)\n\n{% notice %}\n#### La mer in Beetus\n\n**Friend Code:** 4769-1328-3546. My native fruit is apples (I have pears, peaches, cherries, oranges, and coconuts). I also have some golden watering cans for sale, a fountain and am close to having 1,000,000 bells to purchase a lighthouse.\n{% endnotice %}\n"
  },
  {
    "path": "src/_posts/articles/2012-03-19-going-static.md",
    "content": "---\ntitle: \"Going static: using Jekyll CMS free\"\nexcerpt: \"Migrating Made Mistakes from a Wordpress powered website back to its static file roots using Jekyll CMS free.\"\nlast_modified_at: 2017-09-07T20:38:55-04:00\nimage: \n  path: &image /assets/images/going-static-feature.jpg\n  width: 1024\n  height: 321\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [articles]\ntags: [Jekyll, web development, design, open source]\ncomments: true\ncomments_locked: true\ntoc: true\n---\n\nIf you follow the trends in modern web design and development, it's hard to ignore the work being done around responsive design. Seems like every other week there is an awesome article about media queries, fluid grids, mobile first, or responsive images on websites like [*A List Apart*](http://alistapart.com/) and [Smashing Magazine](https://www.smashingmagazine.com/).\n\nWhich got me thinking *\"Shit. I don't know anything about these new technologies or techniques, I better learn fast.\"* And the only real way I was going to pickup all this was to create a project for myself. So began the process of evaluating how to build my personal website and how I'd like it to function.\n\n## Why go static\n\nFor the last ten years I've used a CMS to hold and present various blogs and portfolios for myself and clients. These websites were all dynamically driven by a database (usually MySQL) and generally had more features I almost never needed. For example, the convenience of being able update a Wordpress powered website from an iOS app. As much as that feature sounds awesome, I never felt the need to post to my blog while away from my iMac. Especially not any sort of long form article or image heavy post.\n\nA common problem facing Wordpress sites is the speed at which they serve up pages. To be honest I never really had issues with *Made Mistakes* because it was relatively small and low on the traffic. But worrying about security exploits, if updates to the core were going to break something, poorly written plugins, or if I had [W3 Total Cache](https://wordpress.org/plugins/w3-total-cache/) configured correctly started to get old fast.\n\n### Designers are control freaks\n\nBut the real reason that prompted me to look at going back to my web roots was *control*. Trying to tame content inside of a CMS filled with loops, functions, and code I didn't write or completely understand became an exercise in wasting time. And for what? In six months I'd abandon a site and cease updating even though I had the tools to update from *anywhere* and at *anytime*. Which lead to this conclusion --- I'd much rather build something from the ground up than strip away a bunch of useless bells & whistles I didn't need.\n\n## Journey to a static website\n\nAnd so began the process of building a blog-portfolio hybrid using vanilla HTML and CSS --- no databases, no PHP. But where to start? *Do I build a few disconnected pages in a text editor like Sublime Text and upload via FTP?* Or is there a better way using a static-site generator like [Jekyll][1], [nanoc][2], [Middleman][3], [StaticMatic][4], [Bonsai][5], and the [list goes on][8]?\n\n[1]: http://jekyllrb.com/\n[2]: https://nanoc.ws/\n[3]: http://middlemanapp.com/\n[4]: https://github.com/staticmatic/staticmatic\n[5]: https://github.com/benschwarz/bonsai\n[7]: http://octopress.org/\n[8]: https://www.staticgen.com/\n\n### Generating the site with Jekyll\n\nI eventually settled on Jekyll as my static-site generator of choice --- mostly because it seemed actively developed and [Liquid](http://liquidmarkup.org/) appeared to support everything I needed to do with my templates. Publishing a new post goes something like this:\n\n1.\tCreate a text file written in Markdown for a new post.\n2.\tAdd a YAML Front Matter block to the top of these files to indicate which layout to use, the post's meta data, feature image, category, and tags.\n3.\tRun `jekyll` from the CLI to spit out the compiled site.\n4.\tDeploy `/_site` to my web server using a rake task that minifies all .html files, rsyncs the changes, and pings Google and Bing notifying them that `sitemap.xml` has updated.\n\nThere can be a few more steps to the process, but for the most part it's fairly straight forward after you've built all the necessary `_layouts` and `_includes`. What made this process appealing to me over Wordpress or another CMS was --- total control. I can set how I want the folder structure to look like, how the pages are constructed, use [Grunt](http://gruntjs.com/) and other build scripts to optimize everything, etc etc etc. Sure it's possible to do all this in a CMS, but sometimes it's not as transparent and obvious and you often have to strip out a bunch of code bloat.\n\nI will say this about using Jekyll --- it's not for everyone. I had to get my hands dirty and figure out (or research) ways of creating XML sitemaps, RSS/Atom feeds, including social media buttons on article pages, and numerous other things Wordpress powered sites take for granted. But if you ask me, digging into those details and crafting something from scratch was way more rewarding than installing a plugin to do it for you.\n\nJekyll made it possible for me to realize the following goals: familiarize myself with the basics of HTML5 and CSS3 transitions, be able to *\"art direct\"* every page without hacks, get nice with CSS preprocessors like [Less](http://lesscss.org/) to create more powerful and efficient stylesheets, and plant the seeds of a responsive design that was optimized for mobile, tablet, and desktop screens.\n\n## Inspirational frameworks\n\n### HTML5 Boilerplate\n\nOne of the most beneficial things I did to familiarize myself with the HTML5 spec was download the [*HTML5 Boilerplate*](http://html5boilerplate.com/) and read through the source code. All of the files are heavily commented and explain what is going on and why. Often with links to the source material to get more context behind a specific technique or approach. When this wasn't enough I'd hit up [*HTML5 Doctor*](http://html5doctor.com/) to learn more about the `header`, `article`, `section`, `nav`, `footer`, `figure` elements.\n\n### Art directed blog posts are so passé\n\nBack when I still had a website powered by Wordpress, I toyed with the idea of designing art directed blog posts. Essentially posts that deviated from the blog's theme and became something unique based on the posts content. Think of the editorial design work done in print magazines and you'll get the idea.\n\nTo achieve this you could install any number of art direction [Wordpress plugins](http://wordpress.org/extend/plugins/art-direction/) to include custom CSS styles into a post's layout overriding the defaults. If you ask me, using [Liquid flow tags](https://help.shopify.com/themes/liquid/tags/control-flow-tags) in a templates seems less hacky and way more customizable. Loading custom CSS for specific pages becomes an almost trivial exercise once you wrap your head around Liquid and YAML.\n\n### Less is more\n\nWhen I first heard about [Less](http://lesscss.org/) and [Sass](http://sass-lang.com/about/) I rejected the idea of using a CSS preprocessor. Feeling like I've sharpened my CSS skills to a razor sharp edge, I in no way wanted to add another layer of complexity to my workflow. With a second look I decided it made a lot of sense to at least experiment with writing Less and see how I could utilize it in my next project.\n\nBare minimum I figured I could use global variables for the site's color palette and default typography and maybe a mixin or two. The beauty of Less is that you don't have to alter your current .css files. Just changed the .css extension to .less and you're done. Then use as little or *as less* that you want.\n\nUsing variables and mixins helped to quickly prototype page styles. It also allowed me to think more modularly about how to best reuse my code throughout a project. And I didn't even have to worry about using JavaScript or a separate app to convert compiled .css files. I simply installed the [Jekyll-less](http://rubygems.org/gems/jekyll-less) Ruby Gem and any time I run `jekyll` or `jekyll-server`, the .less to .css conversion is handled automatically.\n\n{% notice %}\n#### Update: switched from less to sass\n\nSince migrating from Less to Sass I now use [Bourbon](http://bourbon.io) and [Neat](http://neat.bourbon.io/) to manage my mixins and grid. [Susy](http://susy.oddbird.net/) looks like something I'll eventually move to once I have the time to toy with it.\n{% endnotice %}\n\n### But what about the grid system?\n\nAnother added benefit of using Less are the many user created mixins. I knew I wanted an easy way to establish a grid system in my layouts, but really didn't want to go the semantically unfriendly route of using classes like `.grid_x`, `.push_x`, or `col_x`. Instead I stumbled upon [The Semantic Grid System](http://semantic.gs/) from an [article on Smashing Magazine](http://coding.smashingmagazine.com/2011/08/23/the-semantic-grid-system-page-layout-for-tomorrow/ \"The Semantic Grid System Page Layout for Tomorrow\") about using semantic markup in grid frameworks.\n\nUsing The Semantic Grid System allowed me to define fluid grids for each of my site's major page layouts with a few lines of Less. Top that off with a few carefully thought out `@media` queries and my grids were now responsive and adapted well mobile phones, tablets, desktops, and beyond.\n\n## Left to do\n\nSo now that I finally got around to migrating my Wordpress website, developed a process for publishing content, redesigned everything from the ground up, tinkered with responsive web design, and learned some new tricks... what's next? Well for starters, I need to finish cleaning-up and re-publishing around fifty old blog posts. Many of these originated from Tumblr and Wordpress, and when I migrated them over to Jekyll the outputted files were a mess. Plus I'd like to design some of these pages to make them visually interesting.\n\n### Portfolio layout\n\nYou might have noticed in the main navigation up top *(or maybe you didn't)* a coming soon line next to the portfolio link. Still thinking about how I want to showcase my design and illustration work that fits in well with the rest of the website. I did some tests on the [Work page](/work/) using a grid of thumbnails to represent each post that I think will work better as a portfolio. Either that or combination of a [responsive slider](http://www.woothemes.com/flexslider/) for featured work and smaller thumbnails below for the rest. We'll see...\n\n### Responsive images\n\nI think I have a solid handle on how to serve mobile optimized pages using `@media` queries and page widths. But what I don't have figured out are the images. Sure they scale and look decent at various breakpoints, but I didn't exactly follow a mobile first methodology with them. I started big and scaled down, which means the iPhone and other mobile devices download large images regardless. Something tells me [cracking this nut](http://alistapart.com/article/responsive-images-how-they-almost-worked-and-what-we-need \"Responsive Images How They Almost Worked and What We Need\") is going to be hard.\n\n### Version control\n\nWith a 1.0 release under my belt, I think now is the time to take a look at starting a [repository on GitHub](https://github.com/mmistakes/made-mistakes). Maybe to bring sanity to the project allowing me to version control each update. Also think it would be wise to learn how to utilize rsync and rake tasks to make deploying smoother instead of manually FTPing the contents of `_site\\` to the server.\n\n{% notice %}\n#### Open sourced Made Mistakes\n\nI've added the [sourcecode for mademistakes.com](https://github.com/mmistakes/made-mistakes-jekyll) to GitHub if you want to see how I use Jekyll. Feel free to fork my repo, use my design, or point out how bad all my code is ;-) Just don't be a dick and make a carbon copy of my content and pass it off as your own.\n{% endnotice %}\n\n## Jekyll themes\n\nGetting more comfortable using Jekyll I wanted to give back to the community, so I've released a few [Jekyll themes](/work/jekyll-themes/) on GitHub. I've taken the numerous redesigns this site has gone through and packaged them up into something I hope is a good starting point for launching a Jekyll powered blog. And they're all 100% compatible with [GitHub Pages](http://pages.github.com/) if you're looking for somewhere free to host your site or blog.\n\n*[CMS]: Content Management System\n*[YAML]: YAML Ain't Markup Language\n*[CLI]: Command Line Interface\n*[RSS]: Really Simple Syndication\n"
  },
  {
    "path": "src/_posts/articles/2014-08-29-paperfaces-retrospective.md",
    "content": "---\ntitle: \"PaperFaces retrospective\"\nexcerpt: \"A look back at two years of drawing over 800 portraits using an iPad and Paper for iOS.\"\nlast_modified_at: 2018-03-22T10:47:26-04:00\nimage: \n  path: &image /assets/images/paperfaces-800-portraits.jpg\n  width: 1600\n  height: 522\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [articles]\ntags: [illustration, Paper for iOS, Apple]\ncomments: false\ntoc: true\n---\n\n*Drawing a day* projects are a lot like resolutions made for the New Year. Often started with the best of intentions, but abandoned shortly after from lack of motivation.\n\nTwo years ago I felt inspired to start the [**PaperFaces Project**]({% post_url /notes/2012-08-31-paperfaces-ipad-portrait-project %}) as a way to improve drawing skills that had laid dormant for a decade or so. With an iPad, a stylus, and the [Paper by FiftyThree app](https://fiftythree.com), I set out to draw as many portraits as possible before boring of the idea.\n\n{% figure caption:\"What a difference two years made.\" class:\"gallery-2-col\" %}\n[![first PaperFaces portrait](/assets/images/paperfaces-veganwendy-twitter-600.jpg)](/assets/images/paperfaces-veganwendy-twitter.jpg)\n[![last PaperFaces portrait?](/assets/images/paperfaces-veganwendy-2-twitter-600.jpg)](/assets/images/paperfaces-veganwendy-2-twitter.jpg)\n{% endfigure %}\n\n## How did i do it?\n\nI'm not going to lie, finding the motivation to create something every day is incredibly difficult. Even with the proper motivation, making yourself available can be even more challenging. I'm proof that it can be done while working a full time job, fulfilling husbandly duties, caring for a set of twins, and maintaining healthy eating and sleeping habits.\n\n{% figure caption:\"\" class:\"gallery-3-col\" %}\n![The 2 little rosebuds](/assets/images/paperfaces-retro-03.jpg)\n![Tools of the trade](/assets/images/paperfaces-retro-02.jpg)\n![Drawing Everly with Pencil by 53](/assets/images/paperfaces-retro-01.jpg)\n{% endfigure %}\n\n### Start a routine\n\nHaving a routine and sticking to it was the key to hitting my goal. After a month I settled into a daily habit of putting the twins to bed and then drawing for an hour. Making time became more natural as my mind and body got used to this schedule.\n\n### Share it\n\nMaking my project and efforts public was another huge reason I kept at it for so long. With each new follower or portrait request came an increase in pressure to continue on. I suppose this could have affected me in a negative way, but I decided to look at them as positive reinforcements --- small nudges to keep me from slacking.\n\n{% notice %}\n#### ProTip: set a goal\n\nDon't start a 365 project just for the sake of starting one. Having a clear objective of what you want to get out of it will help focus and motivate you to continue on. I wanted to improve my drawing skills and drawing random people from the internet became a way for me to do that.\n{% endnotice %}\n\n### Take a step back\n\nOn their own these faceless drawings weren't all that interesting, but assembled together like **Voltron** in [Moleskine book]({% post_url /mastering-paper/2013-11-08-moleskine-book %}) and [gallery](/paperfaces/) forms they became *something stronger*. A quality that is easy to miss when you have your head down, focused only on the drawing at hand.\n\n{% figure caption:\"Having my work printed helped give it substance instead of just being 1's and 0's I carried around on a tablet.\" %}\n[![Photograph of a PaperFaces drawing](/assets/images/paper-53-book-wendy.jpg)](/assets/images/paper-53-book-wendy-lg.jpg)\n{% endfigure %}\n\n### Keep it fun\n\nThe last thing anyone wants to do is make more work for themselves. To avoid turning this into a chore I created artificial limits for the project:\n\n- Set a frequency and end date, *e.g. one doodle every day for a month*.\n- Omit anything that takes too long to complete, *e.g. drawing facial features*.\n- Chose subject matter that is varied and keep you interested, *e.g. a new face every day*.\n\n### Keep it challenging\n\nEasy and simple can turn boring in a hurry. The challenge of capturing portraits with Paper is was what originally attracted me to the app. When I first started there were only a handful of colors to choose from and no [zoom][loupe-tutorial] or [Blend][blend-first-look] features. It was during this time that I grew the most as a creator, learning how to push the tools through experimentation and practice.\n\n[loupe-tutorial]: {% post_url /mastering-paper/2014-07-03-moving-the-loupe %}\n[blend-first-look]: {% post_url /mastering-paper/2013-11-20-pencil-first-look %}\n\n{% figure caption:\"With enough practice I was able to evolve as a creator and produce sketches with greater detail.\" %}\n![PaperFaces evolution](/assets/images/paper-53-face-evolution.jpg)\n{% endfigure %}\n\nAs confidence levels grew I wasn't afraid to change the rules to challenge myself. Over the course of two years I did this numerous times by straying outside my comfort zone. First major change was switching from the ink pens to the watercolor and pencil tools. The next was when I decided to move away from drawing blank faces and attempt something more realistic.\n\n## By the numbers\n\nInitially I planned on drawing a single portrait each day for just one year. When I zipped through 365 days I decided another year wouldn't be that big of a deal and ultimately completed {{ site.categories.paperfaces | size }} finished drawings. \n\n{% figure caption:\"I've gotten through one-third of the 2,805 requests I've received on Twitter since [tweeting for volunteers](https://twitter.com/mmistakes/status/240601384477659136/) two years ago.\" %}\n![Favstar.fm tweet screenshot](/assets/images/paperfaces-volunteer-tweet.jpg)\n{% endfigure %}\n\nHere's a breakdown of the various types of portraits I've completed.\n\n| Type                                       | No. of Portraits[^portraits]                |\n|------------------------------------------- | ------------------------------------------- |\n| Faceless                                   | 522                                         |\n| [Star Wars](/tag/star-wars/) | 12                                          |\n| [Bearded Dudes](/tag/beard/) | {{ site.tags.beard | size }}                |\n| Animals and Creatures                      | 17                                          |\n| **Total**                                  | **{{ site.categories.paperfaces | size }}** |\n\n[^portraits]: For the purpose of keeping things consistent I consider a portrait a single drawing regardless if it includes multiple faces. If I was to count the amount of faces I've drawn the numbers would be much, much higher.\n\nAnd for the curious here's the various styli I've used over the two years and some quick impressions.\n\n| Stylus | My Quick Impressions\n|---\n| [*Just-Mobile AluPen*][alupen-stylus] | Lasted me a few months before wearing out. Tips aren't replaceable.\n| [*LunaTik Alloy Touch Pen*][lunatik-stylus] | My trusted sidekick for a long long time. Tip took some serious abuse.\n| [*Ten One Design Pogo Connect*][pogo-stylus] | Most of my drawings are done with a Pogo Connect now. Two broke due to bad hardware design. Wore through about four R2 tips. Connectivity issues are maddening.\n| [*Pencil by FiftyThree*][pencil-stylus] | Super reliable when I'm not wearing out tips in a few days. Flirting with it again after recent Paper update that scales tools when zoomed in.\n| [*ZEN 3 in 1*][zen-stylus] | Precision disc tip dead on arrival. Rubber nib still going strong.\n| [*Universal Touch Screen Pen*][cheap-stylus] | Cheap, small, light, and pretty crappy. Comes in a 3 pack that I have as a backup if I ever lose my other styli.\n\n[alupen-stylus]: http://www.amazon.com/gp/product/B0042U9AT6/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B0042U9AT6&linkCode=as2&tag=mademist-20&linkId=RWJ5A43BF46FLB36\n[lunatik-stylus]: http://www.amazon.com/gp/product/B00821TR7G/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=B00821TR7G\n[pogo-stylus]: {{ site.url}}{% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}\n[pencil-stylus]: {% post_url /mastering-paper/2014-11-28-pencil-53-review %}\n[zen-stylus]: https://www.kickstarter.com/projects/zenwriting/zen-next-generation-of-modern-writing-instrument\n[cheap-stylus]: http://www.amazon.com/gp/product/B00575TN42/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00575TN42&linkCode=as2&tag=mademist-20\n\n## The strange and the unique\n\nWhen my project was picked up by a few high profile designers and developers it spread pretty far through those circles. Drawing as  many bearded dudes in flannel shirts as I have, any time something different came up I was thrilled. Here's a small sampling of my favorites from the last two years:\n\n<ul class=\"gallery-thumbnails\">\n  <li><a href=\"{% post_url /paperfaces/2012-09-20-mike-ftw-portrait %}\"><img src=\"/assets/images/paperfaces-mike-ftw-twitter-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2012-11-05-andrew-shaw23-portrait %}\"><img src=\"/assets/images/paperfaces-andrew-shaw23-twitter-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2012-12-13-f5point6-portrait %}\"><img src=\"/assets/images/paperfaces-f5point6-twitter-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-06-17-studioprisoner-portrait %}\"><img src=\"/assets/images/paperfaces-studioprisoner-twitter-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-09-27-pappyshannon-portrait %}\"><img src=\"/assets/images/paperfaces-pappyshannon-twitter-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2014-01-20-thenimesh-portrait %}\"><img src=\"/assets/images/paperfaces-thenimesh-twitter-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2014-02-17-matt-s-portrait %}\"><img src=\"/assets/images/paperfaces-matt-s-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2014-05-23-barelolk-portrait %}\"><img src=\"/assets/images/paperfaces-barelolk-twitter-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2014-07-10-vlad-s-portrait %}\"><img src=\"/assets/images/paperfaces-vlad-s-150.jpg\" alt=\"\"></a></li>\n  <li><a href=\"{% post_url /paperfaces/2014-03-26-marie-a-portrait %}\"><img src=\"/assets/images/paperfaces-marie-a-150.jpg\" alt=\"\"></a></li>\n</ul>\n\n## What's next\n\nAfter two years of doing the same thing every day it's time to mix it up. I'm not leaving the [#MadeWithPaper](https://twitter.com/search?q=%23MadeWithPaper) community or anything crazy like that, but I am shifting gears slightly.\n\nBy stopping the daily portraits I'll free up time to craft new tutorials for my [**Mastering Paper for iOS**](/mastering-paper/) series. I know quite a few of you have been patiently waiting, so expect a new batch published more regularly. I also want to get serious about that companion piece I've hinted at and turn it into electronic and/or printed books.\n\nDon't get me wrong, drawing strangers for the last two years has been great. But a big part of me is interested in creating work on a personal level again. In a past life I kept [art journals](http://www.blurb.com/b/695432-scripted-entries-from-false-memories?ce=blurb_ew&utm_source=widget) filled with blind contour drawings and scribbled thoughts. I'd love to try and replicate this in Paper, building on the techniques I've mastered drawing portraits and turn them into a set of Moleskine books.\n\n<del>And for those who missed out getting a PaperFaces portrait I'm still offering my services. Color and black & white Paper portraits can be commissioned.</del>\n\n## Thank you!\n\nThe positive support I've received in the form of retweets, favs, likes, hearts, reblogs, emails, DMs, and much more --- made the days I thought about quitting tolerable. To the handful of you who supported[^support-thanks] me in the early days with donations and portrait orders I appreciate your generosity so much! And of course a HUGE THANK YOU to the team at [FiftyThree](https://fiftythree.com) for making the tools that rekindled my love for creating.\n\n![Thanks](/assets/images/thanks-m.png)\n\n[^support-thanks]: Big ups to each of these fine humans. Jason D., Leif S., Julio C., Kenn W., Brady R., Sascha G., THe SKuLL, Robin B., Dan K., Kevin K., Kristen L., Kevin W., Kristen L., Ted W., Joss V., Oleksiy C., Amy H., Michael S., Daniel W., Ruth G., Leah S., Alfred K., Richard K., Matt H., Jennifer M., Toropchin A., Carlos F., Paul J., Benjamin M., Liam D., Joel M., Dave B., Christopher K., Jacob L., Zach F., Braden R., Eberth M., Chet Y., Heikki H., Tom B., Brooks S., Graciela H., Ben M., Stef S., Rob L., Michael G., Francesco C., Miguel M., Adeirra A., Jason C., Aaron R., Raúl A, Tim M., Ryan D., Jameson R., Andrew B., Bridget D., Juan R., Kyle K., Nick A., James O., Janis R., Vasileios M., Aaron M., James G,. Ruth P., Ryan F., Chistianna M., Vanessa T., Alexander M., Glenn S., Jessica P., Maria G., Bobby H., Jose A., Nicole D., Wesley F., Peter J., Michael M., Sailesh P., Jayne W., Antonio M., Wakes M., Liese A., Miguel R., Jonathan H., Adam M., Artem T., Glen N., Diako M., Nimesh R., Cherie P., Hristian K., Jens T., Mark E., Bryan C., Matteo F., Lorenzo R., Bill L., Antonio C., Thomas D., Lisa O., Ruben H., Leanne V., Dean M., Jeffrey M., Hoon S., Mieng-Ly S., Arno S., Umberto A., Isabelle V., Marcus E., Matt D., David M., Matthew B., Andi S., Andrew E., Yousef K., Jonas C., Peter B., Patricia H., Daniel-Ray V., Lita S., Charlotte H., David S., Richard M., Stefano D., Christie N., Ronald J., Janet R., Paula L., Angelic P., Chris S., Liesse A., Mary D., Jane D., Ed G., and Elizabeth G. I hope I didn't forget anyone...\n\n{% include_cached affiliate-disclosure.html %}\n"
  },
  {
    "path": "src/_posts/articles/2015-02-10-jekyll-style-guide.md",
    "content": "---\ntitle: \"Building a style guide with Jekyll\"\nlast_modified_at: 2017-12-13T10:40:39-05:00\nexcerpt: \"How I used collections with Jekyll to build a style guide and pattern library for Made Mistakes.\"\ncategories: [articles]\ntags: [Jekyll, open source, web development, GitHub, tutorial]\nimage:\n  path: &image /assets/images/jekyll-style-guide-feature.jpg\n  width: 1280\n  height: 450\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments: true\ntoc: true\n---\n\nBuilding a living style guide that details all of the colors, typographic elements, UI patterns, and components used on Made Mistakes has been at the top of my to-do list for some time.\n\nAs sole designer, developer, and writer for the site, having one probably isn't all that crucial. Yet when iterating on the site's design I've found that some of my patterns don't always \"speak the same visual language.\" Having a document I can refer back to and quickly spot check for visual inconsistencies could be very helpful.\n\n## Keep it simple\n\nWith the attention style guides have gotten as of late, a nice selection of [generators and tools](http://styleguides.io/tools.html \"style guide tools\") have also matured in the open source community. Because I'm [using Jekyll to publish the site]({% post_url /articles/2012-03-19-going-static %}), I felt it would be silly to use another tool to generate a living style guide. Even if that meant giving up the ease of setup these other tools provide by having to build out something myself.\n\nFinding a way to do it all from within Jekyll was an important consideration since I wanted to \"set it and forget it\" as much as possible. Maintaining stylesheets and `includes` in two separate projects was a thought I didn't really want to entertain...\n\nSo with that I bumped around GitHub and Google to see what sort of solutions existed already and found these:\n\n* [Jekyll CSS Styleguide](https://github.com/davidhund/jekyll-styleguide)\n* [Boilerplate for Jekyll Styleguide](https://github.com/jeromecoupe/jekyllstyleguide)\n* [Pattern Lab Jekyll Port](https://github.com/karissademi/patternlab-jekyll)\n* [Pattern Primer Jekyll](https://github.com/opattison/Pattern-Primer-Jekyll)\n{:.fl}\n\nOut of the bunch, [Jérôme Coupé's](http://www.webstoemp.com/) approach resonated with me the most since it meshed well with my current Jekyll site setup. By leveraging **collections**[^collections] I could avoid littering my `_posts` folder with components, color palettes, and other snippets while being able to iterate over them and output individual pages if needed.\n\n[^collections]: A feature added to Jekyll in [version 2.0.0](http://jekyllrb.com/docs/history/#v2-0-0) allowing you to define new types of documents that behave like [Pages](http://jekyllrb.com/docs/pages/) or [Posts](http://jekyllrb.com/docs/posts/), while also having their own unique properties and name-spaces.\n\n## Building the style guide\n\nTo start I took a quick survey of all the Sass partials in my `_assets/stylesheets`[^jekyll-assets] folder to determine how I might want to organize the style guide. The biggies for me were:\n\n* **Color palettes**\n* **Typography** (headings, paragraphs, lists, and inline elements)\n* **Media elements** (images, figures, videos, etc.)\n* **Patterns** (buttons, badges, table of contents, etc.)\n{:.fl}\n\n[^jekyll-assets]: I'm using the excellent [Jekyll 3 Assets](https://github.com/jekyll/jekyll-assets) plugin for a Rails-like asset pipeline to run [AutoPrefixer](https://github.com/postcss/autoprefixer), minify and MD5 fingerprint CSS/JavaScript assets, and some other useful stuff.\n\n### Configure collections\n\nWith the structure of the style guide determined next came [configuring the collections](http://jekyllrb.com/docs/collections/) that would contain each component. Originally I planned to have a single collection named `components` but decided to go with a second to group together all of the color palettes used on the site.\n\nBecause I had worked with collections when I built the [FAQ section](/faqs/) of my site I had a good idea of what I was doing. To start I added the following to my `_config.yml` and created `_colors` and `_components` folders in the root of my project.\n\n```yaml\ncollections:\n  components:\n    output: false\n  colors:\n    output: false\n```\n\nI choose not to output a file for each color/component since I planned on grouping them together on a single page. But if I later wanted to break them out into separate pages (something I did for my [FAQ section](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/src/_faqs) I would simply change `output: false` to `true` and add permalinks to the YAML Front Matter.\n\n{% notice %}\n#### Looking to the future\n\nFor version 2.0 of the style guide I may investigate taking it to the next level by constructing a complete [atomic design system](http://atomicdesign.bradfrost.com/). Instead of collections for just `components` and `colors` I could create `atoms`, `molecules`, `organisms`, and `templates` to flush out the entire system. \n\nI've seen [some examples](https://github.com/karissademi/patternlab-jekyll \"Pattern Lab Jekyll port\") of trying to do this in Jekyll with just `includes`, but I think leveraging components, setting `output: true` on them, and getting creative with Liquid would make this a better option.\n{% endnotice %}\n\n### Display components and color palettes\n\nWith my two style guide collections configured I created a new layout (`_layouts/style_guide.html`) to strip away most of the fluff found in my `article` and `media` layouts. It's basically a wide wrapper with just a page title and `{% raw %}{{ content }}{% endraw %}` block.\n\n```html\n{% raw %}---\nlayout: default\n---\n\n<div id=\"main\" class=\"wrap\" role=\"main\">\n  <h1>{{ page.title }}</h1>\n  {{ content }}\n</div><!-- /#main -->{% endraw %}\n```\n\nThe bulk of the content for the style guide is going to come from creating Markdown files for each component and color palette --- so I started on that next. For components I went with the following YAML Front Matter followed by the bare minimum of HTML needed to create each. `title` and `type` are the only required bits with `scss`, `module`, and `usage` being optional to describe a component and/or link back to their source code.\n\n```html\n---\ntitle: \"Main Content Default Notice\"\ntype: notices\nscss: assets/stylesheets/_notices.scss\nmodule:\nusage: \"Emphasize post text.\"\n---\n\n<div id=\"content\" class=\"page-content\">\n  <div class=\"notice\">\n    <h4>Default Notice Headline</h4>\n    <p>Donec sed tellus eget <a href=\"#\">sapien fringilla nonummy</a>. Mauris a ante. Suspendisse quam sem, consequat at.</p>\n  </div>\n</div>\n```\n\n{% notice %}\n#### ProTip: descriptive filenames\n\nBe smart with your filenames if you're trying to sort components in a logical way. The default behavior is for them to be arranged alphabetically by filename. Adding a variable to the YAML Front Matter of each component and sorting on that is one way of overriding this behavior.\n\nOr you could hack the order sequence by doing something like this with your filenames: `01-ui-colors.md`, `02-component-one.md`, `03-component-two.md`, etc.\n{% endnotice %}\n\n#### Collection loops\n\nAfter creating a handful of components, I started to refine the [Liquid](https://github.com/Shopify/liquid/wiki) needed to display them. Mostly to make sure things were shaping up how I envisioned them before getting too deep into things.\n\n{% figure caption:\"Screenshot of my components collection.\" %}\n![Sublime Text _components screenshot](/assets/images/jekyll-style-guide-components.png)\n{% endfigure %}\n\nThere's not much magic going on here. Basically what I did was:\n\n1. Create a new page [`/style-guide/index.md`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.0.0/style-guide/index.md) to act as the style guide's main page.\n2. Added YAML Front Matter to this page --- assigning a title, `layout: style_guide` to utilize the `_layout` I created earlier, and an excerpt description for SEO purposes.\n3. Added a short introduction to the style guide.\n4. Used some Liquid to create `for` loops to output all documents found in the `colors` and `components` collections.\n\nHere's the Liquid I came up with to fill the page with content from the `components` collection.\n\n```html\n{% raw %}{% assign componentsByType = site.components | group_by:\"type\" %}\n{% for type in componentsByType %}\n<h2 id=\"guide-{{ type.name }}\" class=\"cf\">{{ type.name | capitalize }}</h2>\n{% for entry in type.items %}\n{% include component.html %}\n{% endfor %}\n{% endfor %}{% endraw %}\n```\n\nWhat's going on here is I'm iterating over the `components` collection, grouping the documents by type[^component-type], and displaying each document's content twice (rendered HTML and syntax highlighted un-rendered HTML).\n\n[^component-type]: Component type is set in the YAML Front Matter. eg: buttons, notices, media, typography, etc.\n\n{% notice %}\n#### Beware the Markdown\n\nI had some trouble getting the Liquid above, Markdown, and syntax highlighting to all play nicely. I suppose I could have just crafted a `.html` document instead, but I wanted to use Markdown with some HTML mixed in. I eventually gave up trying to make my code more readable with indents, which seemed to eliminate the formatting issues.\n{% endnotice %}\n\nSandwiched between the `entry` loop is an include that takes care of spitting out the rendered and syntax highlighted HTML along with an optional short description and links to Sass and `include` sources.\n\n```html\n{% raw %}<article class=\"component\">\n  <header class=\"component-header\">\n    <h3 id=\"guide-{{ entry.title | slugify }}\">{{ entry.title }}</h3>\n      {% if entry.usage %}<p><strong>Usage:</strong> {{ entry.usage }}</p>{% endif %}\n      {% if entry.module %}<p><strong>Include file:</strong> <a href=\"{{ site.owner.github-repo }}{{ entry.module }}\">{{ entry.module }}</a></p>{% endif %}\n      {% if entry.scss %}<p class=\"header-entry-last\"><strong>SCSS file:</strong> <a href=\"{{ site.owner.github-repo }}{{ entry.scss }}\">{{ entry.scss }}</a></p>{% endif %}\n  </header><!-- /.component-header -->\n  <div class=\"component-content\">\n    <div class=\"component-rendered\">\n      {{ entry.content }}\n    </div><!-- /.component-rendered -->\n    <div class=\"component-code\">\n      \n      {% highlight html %}\n        {{ entry.content }}\n      {% endhighlight %}\n      \n    </div><!-- /.component-code -->\n  </div><!-- /.component-content -->\n</article><!-- /.component -->{% endraw %}\n```\n\n#### Component selector navigation\n\nTo help expose components that may be buried towards the bottom of the page I came up with this to create an option list nav.\n\n```html\n{% raw %}\n<nav id=\"component-selector\" class=\"wrap\">\n  <select name=\"section\" id=\"component-select\">\n    <option value>Jump to component...</option>\n    <option value=\"#guide-color-palettes\">Colors</option>\n    {% for type in componentsByType %}\n    <option value=\"#guide-{{ type.name }}\">{{ type.name | capitalize }}</option>\n    {% for entry in type.items %}\n    <option value=\"#guide-{{ entry.title | slugify }}\">&nbsp;&nbsp;&nbsp;{{ entry.title }}</option>\n    {% endfor %}\n    {% endfor %}\n  </select>\n</nav>\n\n<!-- component selector option list -->\n<script>    \n  (function (document, undefined) {\n    // component selector\n    document.getElementById('component-select').onchange = function() {\n      //document.location=this.options[this.selectedIndex].value;\n      var val = this.value;\n      if (val !== \"\") {\n        window.location = val;\n      }\n    }\n  })(document);\n</script>{% endraw %}\n```\n\n{% figure caption:\"Style guide component selector.\" %}\n![style guide component selector](/assets/images/style-guide-component-selector.jpg)\n{% endfigure %}\n\nWith the help of some CSS and JavaScript I was able to position a drop down list in the lower right corner as a way of quickly jumping around the page. If and when I get to going full atomic design on the style guide, I may have to rethink this sort of navigation by giving it more precedence in the layout. But for now it does the trick...\n\n#### Stylesheet tweaks\n\nFor the most part all of my components displayed correctly on the page. One of the benefits of building the style guide was that it quickly pointed out components that weren't as modular as I initial thought. Meaning some were bound to specific class names that when placed in different contexts lost all of their styling.\n\nThere were also a few cases where I needed to add styles specific for the style guide in order for things to display correctly. The `colors` collection is a good example of that.\n\n{% figure caption:\"Screenshot of UI color palette.\" %}\n![UI colors screenshot](/assets/images/style-guide-ui-colors.png)\n{% endfigure %}\n\nMy goal here was to avoid hard coding color values into each document, and instead leverage the color variables already set in `/assets/stylesheets/_variables.scss` to keep things [DRY](http://en.wikipedia.org/wiki/Don%27t_repeat_yourself).\n\nTo achieve this I used a [SassScript map](https://github.com/sass/sass/blob/master/doc-src/SASS_CHANGELOG.md#sassscript-maps) of all the color variables found on the site along with some additional CSS to build the swatch tiles. \n\n```scss\n/*\n   Color swatches\n   ========================================================================== */\n\n.color-tile {\n  @include span-columns(4);\n  @include omega(3n);\n  margin-bottom: $gutter;\n  padding: $gutter 0;\n  text-align: center;\n  border-radius: $border-radius;\n  border: 1px solid $border-color;\n  code {\n    @include font-size(16,no);\n    color: $text-color;\n    white-space: nowrap;\n    margin: 0 2px;\n    padding: 0 5px;\n    border: 1px solid $code-border-color;\n    background-color: $inline-code-background;\n    border-radius: $code-border-radius;\n    white-space: normal;\n  }\n}\n```\n\n## Maintaining the style guide\n\nUpdating and adding components to the [style guide](/style-guide/) should be as simple as creating a new Markdown file and placing it in the `_components` folder. In a perfect world I would never have to touch the `.md` files of existing components. Cosmetic changes made to Sass files should ripple throughout the site without my intervention. Unfortunately, for those components that undergo markup changes, I'll have repeat myself and edit two files... something that shouldn't happen too frequently.\n\nAs always [my code is available on GitHub](https://github.com/mmistakes/made-mistakes-jekyll/) for download and forking. The Style Guide is integrated with the rest of Made Mistakes so you may have to rip out some stuff if you end up using it. \n\nBe sure and let me know if this has been useful. If I get enough feedback I'll consider breaking it out into its own repository for easier forking.\n"
  },
  {
    "path": "src/_posts/articles/2015-09-25-ipad-pro.md",
    "content": "---\ntitle: \"The path to iPad Pro\"\nlast_modified_at: 2017-10-24T09:18:55-04:00\nexcerpt: \"Convincing myself that I need an iPad Pro and Apple Pencil to fulfill all my digital illustration needs.\"\ncategories: [articles]\ntags: [Apple, illustration, Procreate, time lapse]\nimage:\n  path: &image /assets/images/procreate-painting-process-feature.jpg\n  width: 1600\n  height: 577\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments: true\ncomments_locked: true\ntoc: true\n---\n\nApple entering the stylus market means exciting things for iOS and the hardware running it. There's no question that the **iPad Pro** has the makings of being my dream tablet.\n\nDoes that dream become reality in November? Or do I prolong it for the inevitable iPad Air 3 with Apple Pencil support later? Two questions I've been wrestling with how to answer ever since the *\"Hey Siri\" Special Event*.\n\nLeft to my wife that answer would be a firm *\"uhh no, we're not spending $1,000 on a stupid iPad.\"* My decision tree is slightly more nuanced than hers though :wink:. I've waited years for these products and if the iPad Pro + Apple Pencil perform anything like they've been demoed --- goodbye to my iPad Air 2 and set of styli[^styli].\n\n[^styli]: [Pencil by FiftyThree]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}), [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) (for the nib alone since the original doesn't play nice with my iPad Air 2), and [generics from Amazon](http://www.amazon.com/gp/product/B00575TN42/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00575TN42&linkCode=as2&tag=mademist-20).\n\n## The price to play\n\nIf money were no object I'd drop the necessary coin to purchase said iPad Pro and Apple Pencil today (or whenever they officially release). But that's not the world I live in and if I want to be an early adopter there's an inherit cost for that luxury.\n\n![iPad Pro and Apple Pencil drawing](/assets/images/ipad-pro-apple-pencil-drawing.jpg)\n\nSpending $99 on Apple's stylus is a *no brainer* --- $799 for an iPad with a larger screen, beefier processor, more RAM, and 4 fancy internal speakers... not so much. Sure, I get it. If an Air 3 debuted with comparable specs and same support for the new stylus, sales would be impacted, but...\n\n## Why the tablet?\n\nUsing an iPad Air 2 for the last year I've never once thought *\"sure would be great if this ran faster and the screen was larger.\"* The convenience of drawing on an iPad roughly the size of a sketchpad has been what's driven me to [use it daily](/paperfaces/).\n\nApps like [**Paper by FiftyThree**](http://www.fiftythree.com/paper) sold me on the idea of pen and paper being done digitally. Apple's iPad Pro and stylus take this one step further by blurring the lines between analog and digital creation. A space I'm extremely excited to watch evolve.\n\n## An Apple designed stylus\n\nFor awhile it seemed like Apple wasn't as motivated in advancing the artistic aspects of the iPad; as Microsoft was with their **Surface Pro** line of tablets. Sure there was that \"[Start Something New](https://web.archive.org/web/20150127023142/http://www.apple.com/start-something-new/)\" promotional campaign they ran showcasing art and photography created on iOS, but nothing pushing the medium further than their competitors were taking it.\n\n[![Apple's Start Something New page](/assets/images/start-something-new.jpg)](https://web.archive.org/web/20150127023142/http://www.apple.com/start-something-new/)\n\nThat all hopefully changes in November when the Apple Pencil hits the market. Until I can get my hands on one I'm trying to absorb as much information about it as I can.\n\n### Improved accuracy\n\nI've used a [handful of styli](/faqs/stylus-recommendations/) in my time and one thing they've never been is accurate. iPad styli have come a long way from my early days with the easy to lose **Palm Treo** pens. But ultimately they've been held back by hardware that was never designed for their use... until now.\n\nReading Apple's iPad Pro product page it's clear to me that their tablet is growing up. Giving hope that Apple is finally serious about pushing the platform forward for artists:\n\n<blockquote>\n  <p>iPad Pro knows whether you’re using your finger or Apple Pencil. When iPad Pro senses Apple Pencil, the subsystem scans its signal at an astounding 240 times per second, giving it twice the data points it normally collects with your finger. This data, combined with Apple-designed software, means that there’s only milliseconds between the image you have in your mind and the one you see on the display.</p>\n  <p><cite><a href=\"http://www.apple.com/apple-pencil/\">apple.com</a></cite></p>\n</blockquote>\n\n### Position, force, and tilt\n\nPressure sensitive styli used to play a big role in how I drew and painted on the iPad. If Paper by FiftyThree supported the [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) I'd probably still be using it --- even though it wasn't designed all that well.\n\nComing from a fine arts background I learned how to manipulate graphite and paint by varying the amount of pressure applied. The Pogo Connect (and a few others[^pressure-styli]) attempted to simulate this behavior in select apps that supported it. Mostly viewed as a novelty because of difficulties controlling it due to precision and latency issues, the feature never really caught on.\n\n[^pressure-styli]: The following Bluetooth styli are also pressure sensitive: [Wacom Intuos Creative Stylus 2](http://www.amazon.com/gp/product/B00MNGIGMS/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00MNGIGMS&linkCode=as2&tag=mademist-20&linkId=3MSUXH5QRNRUSZBO), [Wacom Bamboo Stylus](http://www.amazon.com/gp/product/B00LZW7RS0/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00LZW7RS0&linkCode=as2&tag=mademist-20&linkId=5NSEUCIDTRSDWORD), [Adobe Ink & Slide](http://www.amazon.com/gp/product/B00LNECVN6/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00LNECVN6&linkCode=as2&tag=mademist-20&linkId=BYWPU37DS5KLIOVG), [Adonit Jot Touch](http://www.amazon.com/gp/product/B00KFAG64O/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00KFAG64O&linkCode=as2&tag=mademist-20&linkId=2MWTP7IBZA6S3V5Y)\n\nTo my knowledge FiftyThree's Pencil exclusive [**Surface Pressure**](https://vimeo.com/98146708) feature was a first for iPad. By tilting it on the side, strokes can be fattened or thinned with greater control. With Apple's stylus, this feature is lifted directly from 53's playbook as it looks to go mainstream.\n\n### Precision that lets you touch a single pixel\n\nDrawing on current iPads with a stylus isn't the best experience. It just hasn't been possible to do any sort of precise work because of hardware constraints and fat tips obscuring your view. Even with [styli that promise improved accuracy](http://www.adonit.net/jot/touch/) they're still nowhere close to \"real\" pens and pencils.\n\nI've flirted with Wacom tablets for digital illustration work before but never fell in love with them. The accuracy was better than a mouse and keyboard, but not being able to draw directly on the screen just didn't cut it. [Wacom's pen displays](http://www.wacom.com/en-es/products/pen-displays) attempt to solve this problem but bring along their own set of quirks as well.\n\nI can't really comment on parallax and air gaps in the screen, pen latency, or anything else for that matter since I've never used a Cintiq for drawing. All I can do is try and infer results from a set of numbers, which may or may not accurately describe these devices.\n\n|                                        | Screen Size | Resolution  | Weight       | Price   |\n| -------------------------------------- | ----------- | ----------- | ------------ | ------- |\n| **iPad Pro**[^ipad-pro]                | 12.9 inch   | 2732 x 2048 | 1.57 pounds  | $898.00 |\n| **Cintiq 13 HD Touch**[^cintiq-touch]  | 13.3 inch   | 1920 x 1080 | 2.646 pounds | $999.95 |\n| **Surface Pro 3**[^surface-pro]        | 12.2 inch   | 2160 x 1440 | 1.76 pounds  | $699.00 |\n\n[^ipad-pro]: Wi-Fi 32GB model included with the purchase of Apple Pencil\n[^cintiq-touch]: Classic Pen included\n[^surface-pro]: 64GB / Intel Core i3 / 4GB RAM model included with Surface Pen\n\n#### What the specs tells me\n\n1. A comparable sized Cintiq with multi-touch is more expensive than the base iPad Pro model. Not to mention you still have to factor in the cost of a computer to connect the Cintiq to.\n2. The iPad Pro's high definition screen (or Retina as Apple calls it) *blows the Cintiq away* in the amount of pixels it can push at over 5.5 million.\n3. iPad Pro is still kind of bulky compared to the current crop of Air's, but almost half as light as a Cintiq.\n\nApple's obsession with thin products have produced screens that feel like you're directly manipulating the pixels underneath. Armed with superior screens, a stylus built for precision, and an ecosystem of apps to support both, many of the hurdles of drawing digitally could finally go away.\n\n### Odds and ends\n\nA few more nuggets that make an iPad Pro + Apple Pencil combo even more appealing:\n\n#### Screen size\n\nI think a 9.7 inch screen is the sweet spot for tablets, but bigger is always better right? If I'm willing to trade weight for more screen real estate I don't think it would be the end of the world. I do most of my iPad illustration work from the couch and rarely draw on the go.\n\n{% figure caption:\"Just look at all of the extra space Paper by FiftyThree can utilize on an iPad Pro. Gimme gimme!\" %}\n![Paper by FiftyThree on iPad Pro](/assets/images/ipad-pro-paper.png)\n{% endfigure %}\n\nWith the new multi-tasking features found in iOS 9 two apps can be tiled together. The fact that the iPad Pro can fit almost two Air's next to each other frees up a ton of space to work with. Once more apps start leveraging **Split View** I can see myself opening a second app off to the side for viewing reference photos as I draw.\n\n#### Apple Pencil battery life\n\nUsing FiftyThree's Pencil for the last couple of years has really spoiled me. I don't even remember the last time I charged mine --- that thing gets some crazy battery life!\n\nGlad to see Apple will continue that trend with a modest 12 hours of life or 30 minutes of juice by quick charging for 15 seconds. The sight of an Apple Pencil jammed into an iPad does make me cringe a bit, but I guess I'll get over it as long as they're not prone to damage.\n\n{% figure caption:\"Image from [Apple.com](http://www.apple.com/apple-pencil/)\" %}\n![Charging Apple Pencil via the iPad Pro's Lightning port](/assets/images/apple-pencil-charging.jpg)\n{% endfigure %}\n\n## Preparing with Procreate\n\nAfter receiving a Pogo Connect as a birthday gift from my wife years ago, one of the first apps I tried it with (after Paper of course) was [**Procreate**](http://procreate.si/) by Savage Interactive. As someone with a long history using Adobe products, Procreate reminded me heavily of Photoshop. Every feature you could ever want was there and designed specifically for touch input:\n\n* Customizable brushes\n* Layers and blending modes\n* Sharing of palettes and brushes\n* Full screen zoom\n* Canvas flip and rotation\n* Export files in a variety of formats: PSD, Procreate native, JPG, and PNG\n* Import photographs\n* Selection and transform tools\n* Customizable interface\n* Automatically record time lapse videos\n* And much more\n\n{% figure caption:\"Procreate file formats. Love me some export options.\" %}\n![Procreate export formats](/assets/images/procreate-export-formats.jpg)\n{% endfigure %}\n\nStarting out as a digital illustration virgin I wanted to ease in with something that felt familiar to the \"real\" tools I was used to. Paper by FiftyThree fit this criteria perfectly, making the transition from analog art to digital easier. I did experiment with Procreate at the same time, but was never really happy with the results since I didn't understand the medium yet.\n\n{% figure caption:\"My early attempts with Procreate weren't all that great. It took me some time to figure out the paint engine as it felt less organic than what I was used to with traditional media.\" class:\"gallery-2-col\" %}\n[![Wendy's portrait painted in Procreate with a Pogo Connect stylus](/assets/images/wendy-portrait-procreate-600.jpg)](/assets/images/wendy-portrait-procreate-lg.jpg)\n[![Figure drawing experiments in Procreate](/assets/images/grunge-figure-drawing-procreate-600.jpg)](/assets/images/grunge-figure-drawing-procreate-lg.jpg)\n{% endfigure %}\n\nNot looking for more excuses to become an iPad Pro early adopter, the Procreate 3 tease by Savage Interactive didn't help matters much :wink:. Feeling the urge to try something more \"professional\" I've recently decided to dive deeper into the app. Partially to see what I could do with more capable tools and partially to prepare for what's to come in November...\n\n{% figure caption:\"Procreate 3 features coming this holiday season.\" %}\n![Procreate 3 coming soon](/assets/images/procreate-3-coming-soon.png)\n{% endfigure %}\n\nTrading simplicity and minimalism for options and power felt extremely rewarding. Don't get me wrong, Paper's tools can't be matched in a lot of ways. But they're also seriously handicapped in an effort to keep the app simple and intuitive. Procreate on the other hand is built for one thing and one thing alone --- art.\n\nIt's this single purpose that allows Procreate to excel at the sorts of things digital artists require in a workflow. In the five short hours I spent with the app I created a realistic portrait that probably would have taken me 10 hours in Paper. It almost felt like I was cheating by exploiting all of Procreate's hallmark features this easily!\n\n{% figure caption:\"Layers, and blending modes, and time lapse recording, oh my!\" class:\"gallery-2-col\" %}\n![Layers in Procreate](/assets/images/mr-allan-procreate-layers.jpg)\n![Blending modes in Procreate](/assets/images/mr-allan-procreate-blending-modes.jpg)\n{% endfigure %}\n\n### Time lapse recording\n\nProcreate did all the work capturing my strokes as I drew this portrait of \"Mr. Allan\" from a photo reference on [**Sktchy**](https://get.sktchy.com/). Watch me make all kinds of mistakes and fumble through *my very first serious digital painting* with Procreate.\n\n{% figure caption:\"A total 4 hours and 5 minutes over three sessions.\" %}\n{% youtube vrqoIbu7gU0 %}\n{% endfigure %}\n\nTo me eye, the face looks like a lump of clay, but with a few more hours of rendering that could be corrected. Procreate has that oil painted look down pat, it's the watercolor feel that Paper produces so effortlessly I'd like to match in future drawings. But that's for another <s>day</s> tutorial...\n\n## iPad Pro early review roundup\n\nA few more iPad Pro and Apple Pencil opinions and early impressions from around the web.\n\n<blockquote>\n  <p>&ldquo;&hellip;The precision of the stylus is as good as it can get, with pixel-level accuracy. I never felt like there was any kind of stair-stepping or odd interpolation of my input.&rdquo;</p>\n  <p><cite><a href=\"http://www.anandtech.com/show/9622/hands-on-with-the-ipad-pro-and-ipad-mini-4\">Joshua Ho</a></cite></p>\n</blockquote>\n\n<blockquote>\n  <p>&ldquo;The Apple Pencil felt like a pencil: The weight and size is just right, and it doesn&rsquo;t glide too fast over glass like current plastic-tipped third party styluses. It had a little drag, just like you experience with paper.&rdquo;</p>\n  <p><cite><a href=\"http://www.imore.com/ipad-pro-hands-preview\">Rene Ritchie</a></cite></p>\n</blockquote>\n\n<blockquote>\n  <p>&ldquo;In terms of friction on the glass, the Apple Pencil feels right, with a level of friction that approximates writing with a pen or pencil on paper.&rdquo;</p>\n  <p><cite><a href=\"http://www.anandtech.com/show/9622/hands-on-with-the-ipad-pro-and-ipad-mini-4\">Joshua Ho</a></cite></p>\n</blockquote>\n\n<blockquote>\n  <p>&ldquo;&hellip;barely any latency so you actually feel like the pencil is leaving ink and can see the outcome of your drawing as its happening.&rdquo;</p>\n  <p><cite><a href=\"https://web.archive.org/web/20150929190126/http://www.lindadong.com/blog//apple-pencil-vs-wacom-cintiq\">Linda Dong</a></cite></p>\n</blockquote>\n\n<blockquote>\n  <p>&ldquo;It also felt fast, unlike some styluses that suffer from latency issues.&rdquo;</p>\n  <p><cite><a href=\"http://www.theverge.com/2015/9/9/9290361/hands-on-with-apples-new-ipad-pro\">Laura Goode</a></cite></p>\n</blockquote>\n\n---\n\nThe big question mark left in my mind is the tip. Is that the sort of thing that will wear out like every other stylus I've owned? Hoping that answer is a big NO, but I guess we really won't know for sure until later this autumn.\n\nAfter all this I still don't know if I'm any closer to making a decision. iPad Pro and Apple Pencil on launch day this November? Or save my money, wait for someone else to be the guinea pig, and hope the technology makes it way down to smaller and cheaper form factors. Has everyone else decided if they're getting them on launch day?\n"
  },
  {
    "path": "src/_posts/articles/2016-02-17-using-jekyll-2016.md",
    "content": "---\ntitle: \"How I'm using Jekyll in 2016\"\nexcerpt: \"A brain dump documenting my approach to using Jekyll, how that's evolved over the years, and web development learnings I've picked up along the way.\"\ncategories: [articles]\ntags: [Jekyll, web development, GitHub, open source, tutorial]\nimage:\n  path: &image /assets/images/using-jekyll-2016-feature.jpg\n  width: 1600\n  height: 446\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments: true\ncomments_locked: true\nlast_modified_at: 2017-10-24T09:32:34-04:00\ntoc: true\n---\n\nI first started using [**Jekyll**](http://jekyllrb.com/) --- a static site generator, back in 2012. In the four years since, it has indirectly introduced me to a host of new tools and ways of building websites. Hell, I wasn't even using version control when developing this site --- so you know a lot has changed.\n\nWhat follows is a brain dump documenting my approach to using Jekyll, how that's evolved over the years, and any other learnings I've picked up along the way. This is mostly an excuse for me to capture and reflect on things, but maybe you'll find some useful nuggets in the mess that's sure to follow.\n\n## Converting and restructuring content\n\nTo learn how Jekyll works I set off on a journey to turn a [**Wordpress**](https://wordpress.org) powered site into the static version you see now. I read several tutorials, learned Kramdown[^kramdown] and [Liquid](https://docs.shopify.com/themes/liquid-documentation/basics), [blogged about the process]({% post_url /articles/2012-03-19-going-static %}), and eventually ended up with something I was happy with --- all without a database or CMS.\n\n[^kramdown]: [Kramdown](http://kramdown.gettalong.org/syntax.html) is a Markdown converter that supports features currently unavailable in plain Markdown. Things like automatically generating a table of contents from headlines, special attributes, and more.\n\n### Posts for all the things\n\nAs Jekyll has matured and added features, the complexity at which I use it has too. In those early days, content could only be considered a **post** or **page**. Posts became more valuable to me than pages since they could reap the benefits of `site.tags` and `site.categories` for creating archives and as a way to surface \"related content\".\n\nPosts made a lot of sense then because the only type of content I had on the site were blog posts. As I started incorporating things like portfolio pieces into the site I used categories as a way to structure content by \"post type.\" For example, [**Blog Articles**](/articles/) would get `categories: articles` added to their YAML Front Matter and `permalink: /:categories/:title/` in `_config.yml` to produce pretty URLs like `/articles/jekyll-is-the-best/`.\n\nA drawback I hit with this method was reliable pagination between posts. Jekyll provides the variables `page.previous` and `page.next` to help create previous/next style links between posts. But because I was trying to section off posts by category, these links didn't always behave as expected.\n\nFor example, when reading a post in the `articles` category, I'd expect the **NEXT →** link to show the next article post. Instead, something from the `portfolio` category came up because it was the next item in the `site.posts` array. With plugins or a messy bit of Liquid you could probably filter on the current category and get around this, but I never took it that far.\n\nDetails like this drive me bonkers, so instead I opted for a **You May Also Enjoy** module that displays three related posts (with the help of a plugin[^related-posts]) at the bottom of the page. In my eyes, this provided a better reading experience even if my site took longer to generate at build...\n\n[^related-posts]: [**jekyll-tagging-related_posts**][related-posts] - replaces Jekyll's `related_posts` function to use tags to calculate better post relationships.\n\n|      | Jekyll version  | Build time | Posts |\n|------|:---------------:|:----------:|:-----:|\n| Then | 0.12.1          | < 1s       | 25    |\n| Now  | 3.1.1           | 121.62s    | 980   |\n\nIt's no coincidence that my build times went from under a second to a few minutes as I hit almost 1,000 posts. Moving to solid-state drives and reducing the amount of Liquid `for` loops in my layouts and includes has helped --- but I still have ways to go if I want to speed things up further. \n\nThe new **`--incremental` regeneration** feature will eventually play a big role in speeding things up. On a default `jekyll new` site it works really well, but unfortunately I haven't had much luck getting it to play nicely with the plugins I use. Work currently being done on this feature seems like its [going in the right direction](https://github.com/jekyll/jekyll/pull/4269), so I'm sure in time things will sort out.\n\nFor now the best I can do is use the new **Liquid Profiler**[^profiler] to identify problematic bits and simplify where I can. I add new content so infrequently that it really isn't a bother waiting 2 minutes for a build to finish, but damn it would be nice to hit < 1s again!\n\n[^profiler]: The profiler can be enabled with the `--profile` flag (eg. `jekyll build --profile`).\n\n```terminal\njekyll build --profile\n\nConfiguration file: _config.yml\nConfiguration file: _config.dev.yml\n            Source: /Users/michael/Sites/made-mistakes-jekyll\n       Destination: /Users/michael/Sites/made-mistakes-jekyll/_site\n Incremental build: disabled. Enable with --incremental\n      Generating...\n\nFilename                               | Count |     Bytes |   Time\n---------------------------------------+-------+-----------+-------\n_layouts/default.html                  |  1379 | 42258.40K | 36.456\n_layouts/autopage_tags.html            |   344 |  7192.14K | 27.259\n_layouts/post.html                     |   994 |  5557.85K | 26.212\n_includes/posts-paginated.html         |   354 |  6967.45K | 25.228\n_includes/entry.html                   |   351 |  6826.94K | 24.220\n_includes/head.html                    |  1379 | 23448.94K | 22.107\n_includes/page-intro.html              |  1378 |  1879.93K | 17.263\n_includes/head-seo.html                |  1379 |  2031.35K | 12.697\n_includes/pager-category.html          |   994 |   518.13K |  4.545\n_includes/contact-list.html            |  1379 |  1424.79K |  4.059\n_includes/favicons.html                |  1379 |  1082.73K |  3.544\n_includes/comment.html                 |    42 |  1172.45K |  3.157\n_includes/comments.html                |    52 |   939.71K |  2.429\nsitemap.xml                            |     1 |   117.42K |  2.127\n\n                    done in 131.732 seconds.\n Auto-regeneration: disabled. Use --watch to enable.\n```\n\n### Collections\n\nWhen [collections](http://jekyllrb.com/docs/collections/) were introduced back in v2.0, I decided to build out a [**Frequently Asked Questions**](/faqs/) section on my site to familiarize myself with the feature.\n\nCreating a collection of FAQ items turned out to be easier than expected. Make a `_faqs` directory populated with Markdown-formatted text files (like any other post or page), configure the collection in `_config.yml`, build an [index page](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.1.0/_pages/faqs/index.md) to display all of the collection's documents, and done!\n\n```yaml\n# _config.yml\ncollections:\n  faqs:\n    output: true\n    permalink: /:collection/:path/\n    title: FAQs\n```\n\nAs collections have elevated in status they're increasingly becoming my preferred way of working with static content. In addition to the FAQs collection I've also created one to build a \"[living style guide]({% post_url /articles/2015-02-10-jekyll-style-guide %})\" of sorts --- documenting the look and feel of the site with visual representations and code samples. \n\nEventually I plan to convert more posts into their own collections. Posts currently categorized as `work` seem like the obvious choice since its always felt funny shoe-horning them into `_posts`. As far as others? Not sure yet.\n\nWhat I'd like to investigate deeper is adding taxonomies to collections and how they mingle with the tags and categories already in `site.posts`. I'm not exactly sure if they coexist with `site.tags` or how [tag archives](/tag/) generated by [**Jekyll Archives**][archives] might see them. A job best saved for a rainy day I suppose...\n\n### Pages for everything else\n\nContent that doesn't need to be ordered chronologically or grouped in any way becomes a **page**. To keep things nice and tidy I place all of the source `.md` or `.html` files into a `_pages` directory and assign permalink overrides in the YAML Front Matter of each.\n\nAn architecture like this helps centralize the content so you're not poking around trying to locate files. Meaningfully naming files should be the goal. Avoid patterns like `/about/index.md` as it makes distinguishing between multiple `index.md` files harder.\n\n```bash\nproject-name/\n├── _assets/\n├── _data/\n├── _drafts/\n├── _includes/\n├── _layouts/\n├── _pages/\n|   ├── 404.md               # custom 404 page\n|   ├── about.md             # about page\n|   ├── contact.md           # contact page\n|   └── home.md              # home page (eg. <root>/index.html)\n├── _posts/\n├── .gitignore\n├── _config.yml\n└── Gemfile\n```\n\nAnd then in each Markdown file I set a permalink that fits in with the format used on the rest of the site.\n\nExamples: `about.md` ~> `permalink: /about/`, `home.md` ~> `permalink: /`, `contact.md` ~> `permalink: /contact/`, etc.\n\n{% notice %}\n#### ProTip: include your pages directory\n\nTo be sure Jekyll \"sees\" and processes the files inside of `_pages`, be sure to include it. Add `include: [\"_pages\"]` to `_config.yml` and you should be good to go.\n{% endnotice %}\n\n## An evolution\n\nFrom a workflow perspective, things have mostly stayed the same. I still \"write in Markdown\", build this site locally, and push the contents of the `_site` directory to a web server. On the development side, however, complexities have been introduced in an effort to optimize and improve website performance.\n\nTinkering and experimenting with the visual design of Made Mistakes whenever I want is important to me. Since I work on both Mac OS X and Windows based devices I need tooling that plays nicely with each. Below are the tools, configurations, and Jekyll plugins that help do that.\n\n### Bundler\n\nInstalling Ruby, Bundler, and Ruby Gems were all new to me four years ago. Running `jekyll build` on different operating systems felt like a crap shoot. A setup that worked one day would most certainly break the next after updating Jekyll on a Windows machine.\n\nI eventually learned to embrace [Bundler](http://bundler.io/) from the advice of numerous Stack Overflow threads and GitHub issues. Since Bundler is the official way to install Jekyll it wasn't that big of a leap for me to start using a `Gemfile` to manage all dependencies. To do that:\n\n1. Run `bundle init` to create an empty `Gemfile`\n2. Add `gem 'jekyll'` and any other gems to the `Gemfile`.\n\n```ruby\n# Made Mistakes example Gemfile\n\nsource 'https://rubygems.org'\n\ngem 'breakpoint'\ngem 'wdm', '~> 0.1.0' if Gem.win_platform?\ngem 'mini_magick'\ngem 'autoprefixer-rails'\ngem 'uglifier'\n\n# Jekyll and Plugins\ngem 'jekyll'\ngem 'jekyll-archives'\ngem 'jekyll-tagging-related_posts'\ngroup :jekyll_plugins do\n  gem 'jekyll-assets', github: 'jekyll/jekyll-assets'\n  gem 'jekyll-sitemap', github: 'jekyll/jekyll-sitemap'\nend\n```\n\nNow when running `bundle install` each of the gems specified above are installed and a `Gemfile.lock` is created listing all of the dependencies. Prepending all Jekyll commands with `bundle exec` ensures only the versions in `Gemfile.lock` are executed helping to mitigate conflicts.\n\nCommitting both of these Gemfiles to a git repository also makes it easy to revert back if a `gem update` goes bad. Sure it's a few more characters to type, but the headaches it solves are more than worth it. You can even write shortcut tasks with Rakefiles to eliminate the extra keystrokes --- if automation is your thing (more on that below).\n\n### Environments and configurations\n\nWith the introduction of asset related plugins and various other build steps, I eventually settled on two Jekyll configuration files. A default `_config.yml` with production settings and `_config.dev.yml` for development specific ones.\n\nThe cool thing is you can chain together these configuration files, overriding settings from the previous. For example, when building locally I'd like {% raw %}`{{ site.url }}`{% endraw %} and {% raw %}`{{ site.disqus-shortname }}`{% endraw %} to default to their development equivalents for testing purposes. Adding the following values to `_config.dev.yml` overrides the ones in `_config.yml`:\n\n```yaml\nurl: http://localhost:4000\ndisqus-shortname: mmistakes-dev\n```\n\nA development server can then be fired up with the relevant settings using...\n\n```terminal\nbundle exec jekyll serve --config _config.yml,_config.dev.yml\n```\n\nGoing one step further a Jekyll environment can be specified as well. By default Jekyll runs in development with a value of `JEKYLL_ENV=development`. The [`compress.html`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/_layouts/compress.html) layout and [**Jekyll-Assets**][assets] plugin both make use of this triggering HTML, CSS, and JavaScript compression with the following command:\n\n```terminal\nJEKYLL_ENV=production bundle exec jekyll build\n```\n\n{% notice %}\n#### Windows environment gotcha\n\nOn Windows I had issues minifying when `JEKYLL_ENV=production bundle exec jekyll build` silently failed. Instead, I found that the [`SET`](http://ss64.com/nt/set.html) command had to be used to assign environment variables.\n{% endnotice %}\n\n```terminal\nset JEKYLL_ENV=production\n```\n\n#### Other configurations\n\nAs mentioned earlier I have a moderately sized Jekyll site at {{ site.posts.size }} posts. Combine that fact with an `/images/` directory that is close to 2 GB, a liberal use of Liquid `for` loops, and generator plugins like [**Jekyll Archives**][archives] --- you get site builds that are far from instant. And in the rare cases when I run `jekyll clean` to flush caches and everything in `/_site/`, builds can take over 15 minutes as the [**Jekyll Picture Tag**][picture-tag] plugin regenerates appropriately sized hero images for every posts. Yikes!\n\nSo as you might have guessed, I sure as hell never start up a server with *auto-regeneration* enabled. Instead, I start with `bundle exec jekyll serve --no-watch` and then run a rake task to manually build every time I want to check changes locally.\n\nWhen working on the site's design it can be cumbersome to sit through a 2 minute build just to check a CSS change. But until `--incremental` works reliably its something I have to suffer through (or use plugins to isolate posts at build). Its a good thing I do a lot of my 'designing' in-browser with [Chrome's DevTools](https://developer.chrome.com/devtools) before editing the actual source as this hasn't been too annoying.\n\n### Automation tools and shortcuts\n\nTo save time (and my sanity) when working on the site locally, I employee a few tools to perform common development related tasks.\n\n#### Grunt\n\n[**Grunt**](http://gruntjs.com/) describes itself as \"the JavaScript task runner.\" Grunt has a fairly large set of plugins that can handle pretty much any mundane task you through at it.\n\nPrior to Jekyll natively supporting Sass I used Grunt plugins to pre-process `.less` files, concatenate a set of JavaScript files, and optimize image assets. Now that I'm running Jekyll 3.1 and the Jekyll-Assets plugin I no longer need Grunt to mess with my scripts and stylesheets.\n\nThese days I use Grunt solely for optimizing images and SVGs with the following plugins:\n\n```js\n// Grunt plugins in package.json\n\"devDependencies\": {\n  \"grunt\": \"~0.4.2\",\n  \"grunt-newer\": \"^0.7.0\",\n  \"grunt-imgcompress\": \"~0.1.1\",\n  \"grunt-svgmin\": \"~0.3.1\",\n  \"grunt-svgstore\": \"^0.5.0\"\n}\n```\n\nWhen I add new JPEG or PNG assets to `/images/` I use the following command to optimize them --- reducing their file size and speeding up page loads.\n\n```bash\n$ grunt images\n```\n\nOn the SVG side of things any files added to `/_svg/` are optimized and merged into a [single sprite map](https://css-tricks.com/svg-sprites-use-better-icon-fonts/) with the following command:\n\n```bash\n$ grunt svg\n```\n\nIn combination with both of these tasks I use the [**grunt-newer**](https://www.npmjs.com/package/grunt-newer) plugin. This dramatically speeds up things as only new and modified files are processed.\n\n#### Rake\n\nOn the build and deployment side of things I have a few shortcut tasks defined in `Rakefile.rb`. As mentioned earlier typing out `bundle exec` before Jekyll commands can get old fast. Instead, I use the following:\n\n##### Start up a Jekyll server\n\n```bash\n$ rake serve\n```\n\n##### Production build, development build, and build with drafts\n\n```bash\n$ rake build\n$ rake build:dev\n$ rake build:drafts\n```\n\n##### Deployment\n\nSince I self-host my site I need a way of pushing the contents of the `/_site/` directory after a production build. Years ago I'd use [**Cyberduck**](https://cyberduck.io/) or [**FileZilla**](https://filezilla-project.org/) to transfer everything over slowly to [Media Temple](http://bit.ly/1Ugg7nN) via FTP.\n\nThese days I use **rsync** to speed that transfer way the hell up, sending only new and modified files. It's also a task that I can automate by adding the following to my [`Rakefile.rb`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/Rakefile.rb) file.\n\n```ruby\n# Usage: rake rsync\ndesc \"rsync the contents of ./_site to the server\"\ntask :rsync do\n  puts \"* rsyncing the contents of ./_site to the server\"\n  system \"rsync --perms --recursive --verbose --compress --delete --chmod=Du=rwx,Dgo=rx,Fu=rw,Fgo=r _site/ SSHuser@mydomain.com\"\nend\n```\n\nAs part of my deployment process I also run tasks that notify [Ping-O-Matic](http://pingomatic.com/), Google, and Bing that the site has been updated and to index the [`sitemap.xml`](/sitemap.xml) and [`atom.xml`](/atom.xml) feeds. These tasks look something like this:\n\n```ruby\n# Usage: rake notify\ntask :notify => [\"notify:pingomatic\", \"notify:google\", \"notify:bing\"]\ndesc \"Notify various services that the site has been updated\"\nnamespace :notify do\n\n  desc \"Notify Ping-O-Matic\"\n  task :pingomatic do\n    begin\n      require 'xmlrpc/client'\n      puts \"* Notifying Ping-O-Matic that the site has updated\"\n      XMLRPC::Client.new('rpc.pingomatic.com', '/').call('weblogUpdates.extendedPing', 'mydomain.com' , '//mydomain.com', '//mydomain.com/atom.xml')\n    rescue LoadError\n      puts \"! Could not ping ping-o-matic, because XMLRPC::Client could not be found.\"\n    end\n  end\n\n  desc \"Notify Google of updated sitemap\"\n  task :google do\n    begin\n      require 'net/http'\n      require 'uri'\n      puts \"* Notifying Google that the site has updated\"\n      Net::HTTP.get('www.google.com', '/webmasters/tools/ping?sitemap=' + URI.escape('//mydomain.com/sitemap.xml'))\n    rescue LoadError\n      puts \"! Could not ping Google about our sitemap, because Net::HTTP or URI could not be found.\"\n    end\n  end\n\n  desc \"Notify Bing of updated sitemap\"\n  task :bing do\n    begin\n      require 'net/http'\n      require 'uri'\n      puts '* Notifying Bing that the site has updated'\n      Net::HTTP.get('www.bing.com', '/webmaster/ping.aspx?siteMap=' + URI.escape('//mydomain.com/sitemap.xml'))\n    rescue LoadError\n      puts \"! Could not ping Bing about our sitemap, because Net::HTTP or URI could not be found.\"\n    end\n  end\nend\n```\n\nAnd with a simple `rake deploy` I can build a production-ready version of the site, rsync everything over to my web host, and notify search engines there's new content to crawl.\n\n### Asset pipeline\n\nOriginally I wrote my stylesheets in [Less](http://lesscss.org/)[^less] and squished them down with a Grunt task. Then one day Jekyll grew up and started supporting Sass files natively so I converted everything over and was able to remove a dependency. Hooray!\n\n[^less]: Less is a CSS pre-processor, meaning that it extends the CSS language, adding features that allow variables, mixins, functions to make it more maintainable.\n\nNot content with that workflow I eventually leveled-up by incorporating the [**Jekyll-Assets**][assets] plugin into the mix. It's a powerful gem with an assortment of tags that make cache busting and inlining assets (something I'll get to in a minute) so much easier.\n\nIt also supports the wonderful [PostCSS](http://postcss.org/) plugin [Autoprefixer](https://github.com/postcss/autoprefixer), for automatically adding vendor prefixes to CSS rules. CSS declarations like this:\n\n```scss\n.post__content {\n  display: flex;\n  flex-direction: column;\n  flex-wrap: nowrap;\n  margin-top: 1em;\n}\n```\n\nGet properly prefixed without any additional effort... \n\n```css\n.post__content {\n  display: -webkit-box;\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n  -webkit-flex-direction: column;\n  -ms-flex-direction: column;\n  flex-direction: column;\n  -webkit-flex-wrap: nowrap;\n  -ms-flex-wrap: nowrap;\n  flex-wrap: nowrap;\n  margin-top: 1em;\n}\n```\n\nEven better, when browsers don't need this extra prefixed nonsense --- Autoprefixer will leave it out based on the `browsers:` set in my Jekyll config.\n\nFor this site I target the *last 2 versions* of each major browser, browsers that have a *global usage of over 5%*, or are *Internet Explorer 9+*.\n\n```yaml\n# _config.yml\nassets:\n  autoprefixer:\n    browsers: [\"last 2 versions\",\"> 5%\",\"IE 9\"]\n```\n\n### Page speed optimizations\n\n### Critical path CSS\n\nTo speed up page loads I've gone to the trouble of [inlining the critical CSS](https://www.smashingmagazine.com/2015/08/understanding-critical-css/) needed to render a page. I didn't use any fancy tools to determine what was critical but instead structured my SCSS partials in a way that the important visual stuff comes first. \n\nWith a focus on modular CSS, I can build critical and non-critical flavors by `@import`-ing the bits needed for each fairly easily. Using the Jekyll-Assets `asset_source` tag[^assets-tag-example] to output the contents of [`critical.scss`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/_assets/stylesheets/critical.css.scss) into the `<head>` of ever page and a bit of JavaScript to [asynchronously load the non-critical stuff](https://github.com/filamentgroup/loadCSS).\n\n[^assets-tag-example]: Output the source of an asset using `asset_source` Jekyll-Assets tag. Example: `{% raw %}{% asset_source critical.css %}{% endraw %}`\n\n{% figure caption:\"Page speed analyzed with [Google's PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights/) tool.\" %}\n![Made Mistakes analyzed with PageSpeed Insights](/assets/images/mm-home-pagespeed-021116.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: plugin free inlined critical CSS\n\nA similar method can be achieved by placing a SCSS file inside the `/_includes/` directory and applying the `scssify` filter. Perfect for sites hosted on GitHub Pages where most plugins aren't allowed.\n{% endnotice %}\n\n```liquid\n<head>\n  <style type=\"text/css\">\n    {% raw %}{% capture criticalcss %}\n      {% include critical.scss %}\n    {% endcapture %}\n    {{ criticalcss | scssify }}{% endraw %}\n  </style>\n</head>\n```\n\n#### Responsive images revisited\n\nInlining the above the fold CSS and lazy loading the rest wasn't the only site performance improvement I've made. The biggest hurdle I've come across working with Jekyll is image management. Since Jekyll isn't a CMS and I have thousands of image assets, finding a solution to [serve them responsively](http://alistapart.com/article/responsive-images-in-practice) has been challenging.\n\nSince day one I've been trying to get closer to this [dream scenario](https://github.com/jekyll/jekyll-assets/issues/172):\n\n1. Link images in a post/page with just Markdown (e.g. `![image](image-name.jpg)`).\n2. Automatically generate smaller sizes (perhaps specified in `_config.yml`).\n3. `<img>` elements are spit out with the correct `srcset` and `sizes` markup.\n\nTo my knowledge there are no Jekyll plugin that do this, though some get close --- [Jekyll-Picture-Tag][picture-tag], [Jekyll-Responsive-Image][responsive-image], [Jekyll-Srcset][jekyll-srcset]. **Jekyll-Picture-Tag** does most of what I want (automatically size images from presets) with tags like {% raw %}`{% picture image.jpg %}`{% endraw %}, which means I have to forgo linking to images with plain Markdown for now.\n\nWhen setting up the plugin I focused in on the large hero images and decided to worry about the others later. Replacing Markdown images with {% raw %}`{% picture %}`{% endraw %} tags for 1,000 posts just isn't feasible yet. Since the hero images are Liquid driven they proved much easier to implement.\n\nAll it took was changing {% raw %}`<img src=\"{{ page.image.feature }}\" alt=\"\">`{% endraw %} to {% raw %}`{% picture hero {{ page.image.feature }} alt=\"\" %}`{% endraw %} and settling on this configuration:\n\n```yaml\npicture:\n  source: \"images/_originals\"\n  output: \"images\"\n  markup: \"picture\"\n  presets:\n    hero:\n      attr:\n        class: \"page__hero-image\"\n        itemprop: \"image\"\n      ppi: [1]\n      source_1600:\n        media: \"(min-width: 1600px)\"\n        width: \"1600\"\n      source_1024:\n        media: \"(min-width: 1024px)\"\n        width: \"1024\"\n      source_768:\n        media: \"(min-width: 768px)\"\n        width: \"768\"\n      source_600:\n        media: \"(min-width: 600px)\"\n        width: \"600\"\n      source_default:\n        width: \"320\"\n```\n\nNow when a high resolution image is placed in `/images/_originals/` and `feature: /assets/images/image.jpg` added to the YAML Front Matter of a page, this markup spits out automatically:\n\n```html\n<picture>\n  <source srcset=\"image-1600.jpg\" media=\"(min-width: 1600px)\">\n  <source srcset=\"image-1024.jpg\" media=\"(min-width: 1024px)\">\n  <source srcset=\"image-768.jpg\" media=\"(min-width: 768px)\">\n  <source srcset=\"image-600.jpg\" media=\"(min-width: 600px)\">\n  <source srcset=\"image-320.jpg\">\n  <img src=\"image-320.jpg\" class=\"page__hero-image\" itemprop=\"image\" alt=\"\">\n</picture>\n```\n\nBy default, the plugin hashes the filenames, but [I disabled that](https://github.com/mmistakes/made-mistakes-jekyll/commit/39fcf74b99d5fd6988eaff332ce90208c57ed840) since it was getting hard to manage between Mac OS X and Windows environments (each created their own hashed version of the file even when visually the same).\n\nCurrently, this plugin only supports the `<picture>` element which is great for art directed responsive images, but a bit overkill in this case. Having the option to use `srcset` instead would be preferred, but since I'm not a Rubyist making that change to the plugin is out of my hands until [someone else tackles it](https://github.com/robwierzbowski/jekyll-picture-tag/issues/68).\n\n[^picture-polyfill]: [Picturefill](https://scottjehl.github.io/picturefill/) is responsive images polyfill that enables support for the picture element and associated features in browsers that do not yet support them.\n\n{% figure caption:\"The bump in page speed has been great with a mobile score of `73/100` improving to `96/100`.\" %}\n![Page speed before and after using Jekyll-Picture-Tag plugin](/assets/images/mm-media-pagespeed-021116.jpg)\n{% endfigure %}\n\nThe one big drawback I've experienced using this plugin has been an increase in build times. If I don't instruct Jekyll to `keep_files: [\"images\"]`, every time I run Jekyll over 1,000 images will go through the process of being resized into smaller files. This takes forever and even longer when uploading them all to my web server (another reason I disabled MD5 hashed filenames). Baby steps right?\n\n### A focus on content\n\nShowcasing a post or page's content is still the primary goal of the layouts I designed years ago. It's been a balancing act as I've tried to incorporate navigation systems (*main menu*, *table of contents*, *page breadcrumbs*, *tag archives*), reader submitted comments, related posts, and social sharing links in complimenting and responsive ways.\n\n{% figure caption:\"(First) post layout then, (second) post layout now.\" class:\"gallery-2-col\" %}\n![Jekyll post layout then](/assets/images/mm-jekyll-post-then.jpg)\n![Jekyll post layout now](/assets/images/mm-jekyll-post-now.jpg)\n{% endfigure %}\n\nThe core elements have remained unchanged since I originally launched the site:\n\n1. A neutral design to avoid competing with page content (text and image).\n2. Well defined structure, way points for navigating the site, and related content to encourage deeper browsing.\n3. Readable typography to help showcase long-form articles and tutorials.\n\nBuilding everything from scratch has really given me the chance to focus on all of these points. It's also helped me avoid the trap of adding useless widgets and *other cruft* because they're trivial to install --- something I was guilty of when using plug and play software like [**Wordpress**](https://wordpress.org/). \n\nThe challenge has been finding ways to surface related content and displaying them in an attractive manner. I wanted to take a simple text list of posts and turn them into something more visual. With the thought that no one was going to sift through a bunch of boring text unless there were images to break up things.\n\n#### Listing posts\n\nArchive page layouts I've designed over the years have gone through several incarnations. I went from plain text lists, to thumbnail images, to listings with a short excerpt, to something that combined them all.\n\n{% figure caption:\"Title/excerpt versus image/date/title/excerpt post lists.\" class:\"gallery-2-col\" %}\n![Plain text post list](/assets/images/mm-text-teasers.png)\n![Visual post list](/assets/images/mm-visual-teasers.png)\n{% endfigure %}\n\nWhat I'm currently using are tiles for related and featured post modules and a more traditional plain list for archive pages.\n\n{% figure caption:\"Archive listing with teaser image, headline, published date, estimated reading time, and excerpt.\" %}\n![Current archive listing design](/assets/images/mm-archive-listing-example.jpg)\n{% endfigure %}\n\nRelated posts are dynamically pulled from `site.related_posts` and augmented with a [Jekyll plugin][related-posts] to make matches based on `post.tags`. The following tile logic resides in an include file and is ready to be used in layouts or within post/page content.\n\n```html\n{% raw %}<!-- /_includes/related.html -->\n<h3 class=\"tile__header\">You May Also Enjoy</h3>\n<div class=\"tiles\">\n  {% for post in site.related_posts limit:3 %}\n    <article class=\"tile__item\" itemscope itemtype=\"http://schema.org/CreativeWork\">\n      <meta itemprop=\"text\" content=\"{{ post.excerpt | strip_html }}\">\n      <a href=\"{{ post.url }}\">\n        <img src=\"{% if post.image.teaser %}{{ post.image.teaser }}{% else %}{{ site.teaser }}{% endif %}\" itemprop=\"image\" alt=\"{{ post.title }}\">\n        <h3 class=\"tile__title\" itemprop=\"headline\">{{ post.title | markdownify | remove: '<p>' | remove: '</p>' }}</h3>\n      </a>\n      {% if post.categories %}\n        {% assign category_slug = post.categories | first %}\n        {% assign category = site.data.slugs[category_slug] %}\n        <a href=\"/{{ post.categories | first }}/\" class=\"tile__category\">{{ category.name }}</a>\n      {% endif %}\n    </article>\n  {% endfor %}\n</div>{% endraw %}\n```\n\n{% figure caption:\"Related posts only appear if there are three or more matches based on `post.tags`.\" %}\n![Related posts example screenshot](/assets/images/mm-related-posts-example.jpg)\n{% endfigure %}\n\nSimilar in design to the **related posts** module, I also utilize a set of tiles for featuring posts. Visually they look the same but instead of being dynamically determined by `post.tags` they're manually set and grouped by category.\n\n##### Adding featured posts\n\nThe first step is to flag a post as featured. To do this, I add `featured: true` to its YAML Front Matter.\n\nNext I use a variation of the [related posts include](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/_includes/related.html) with additional Liquid conditionals to control headlines and other variable data.\n\n```html\n{% raw %}<!-- /_includes/featured.html -->\n<h3 class=\"tile__header\">{% if page.feature.headline %}{{ page.feature.headline }}{% else %}Featured Posts{% endif %}</h3>\n  <div class=\"tiles\">\n    {% assign features = site.categories[page.feature.category] | where:\"featured\", true %}\n    {% for post in features limit:3 %}\n      <article class=\"tile__item\" itemscope itemtype=\"http://schema.org/CreativeWork\">\n        <meta itemprop=\"text\" content=\"{{ post.excerpt | strip_html }}\">\n        <a href=\"{{ post.url }}\">\n          <img src=\"{% if post.image.teaser %}{{ post.image.teaser }}{% else %}{{ site.teaser }}{% endif %}\" itemprop=\"image\" alt=\"{{ post.title }}\">\n          <h3 class=\"tile__title\" itemprop=\"headline\">{{ post.title | markdownify | remove: '<p>' | remove: '</p>' }}</h3>\n          {% assign readtime = post.content | strip_html | number_of_words | divided_by:site.words_per_minute %}\n          <span class=\"tile__item-time\">{% if readtime <= 1 %}1{% else %}{{ readtime }}{% endif %} min read</span>\n        </a>\n        {% if post.work %}\n          <span class=\"tile__category\">{{ post.work }}</span>\n        {% endif %}\n      </article>\n    {% endfor %}\n  </div>{% endraw %}\n```\n\nTo display on a page, the following YAML Front Matter is added --- customizing the headline and assigning a `site.categories` category to pull from.\n\n```yaml\nfeature:\n  visible: true\n  headline: \"Featured Tutorials\"\n  category: mastering-paper\n```\n\nEverything is pulled together by adding this to relevant layouts:\n\n```liquid\n{% raw %}{% if page.feature.visible == true %}\n  {% include featured.html %}\n{% endif %}{% endraw %}\n```\n\n{% figure caption:\"How featured posts look when included on a page.\" %}\n![Featured posts module example](/assets/images/mm-featured-posts-example.jpg)\n{% endfigure %}\n\n## Introducing flexibility\n\nMy configuration files used to be a dumping ground for all kinds of site, navigation, and author data. This always felt messy to me and when support for data files was added I took advantage of it in my Jekyll themes first.\n\n### Data files\n\nSo what exactly are [data files](http://jekyllrb.com/docs/datafiles/)? I like to think of them as custom variables that Liquid can play with in all the ways you'd expect --- `for` loops, `capture`s, filters, you name it. Data files can be YAML, JSON, or CSV, are placed in `/_data/`, and are accessible with `site.data.<filename>`[^data-file].\n\n[^data-file]: **Example:** Data file `/_data/foo.yml` is accessible via `site.data.foo`.\n\n#### Easily editable navigation menus\n\nBefore discovering data files I was hard-coding nav links directly into my layouts and junking up `_config.yml` with them. It was with my first set of Jekyll themes that I began to see the benefit of pulling this data out into their own little world.\n\nIn an effort to build a DRY navigation menu for this site I created [`/_data/navigation.yml`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/_data/navigation.yml) and added the following four links:\n\n```yaml\n# masthead navigation links\nmasthead:\n  - title: \"About\"\n    url: /about/\n  - title: \"Work\"\n    url: /work/\n  - title: \"Blog\"\n    url: /articles/\n  - title: \"Mastering Paper\"\n    url: /mastering-paper/\n```\n\nAs you can guess, `title` corresponds to the page title and `url`... well the URL. With these values, I can loop over the `home-primary` key and auto-generate list elements with the appropriate titles and links from a single file.\n\n```html\n<!-- excerpt from /_includes/masthead.html -->\n<header class=\"masthead\">\n  <div class=\"container\">\n    <a class=\"masthead__title\" href=\"/\">{{ site.title }}</a>\n    <nav id=\"nav-primary\" class=\"masthead__menu-wrapper\">\n      <ul class=\"masthead__menu\">\n        <li><a href=\"/\" class=\"masthead__menu-item\">← Home</a></li>\n        {% raw %}{% for link in site.data.navigation.masthead %}\n          <li><a href=\"{{ link.url }}\" class=\"masthead__menu-item\">{{ link.title }}</a></li>\n        {% endfor %}{% endraw %}\n        <li><a href=\"#0\" class=\"overlay__menu-trigger masthead__menu-item\" aria-label=\"Navigation Menu\" title=\"Navigation Menu\">•&nbsp;•&nbsp;•</a></li>\n      </ul>\n    </nav>\n  </div>\n</header>\n```\n\nWhat's going on here is I'm looping through `site.data.navigation.masthead` to pull out a `title` and `url` variable for each. If I ever need to update the masthead navigation I just edit `navigation.yml` and the rest is handled automatically at build.\n\nTo improve the navigation's UI, `.active` classes are added using the following Liquid:\n\n```html\n{% raw %}{% for link in site.data.navigation.masthead %}\n<ul class=\"masthead__menu\">\n  {% assign class = nil %}\n  {% if page.url contains link.url %}\n    {% assign class = 'is--active' %}\n  {% endif %}\n  <li><a href=\"{{ link.url }}\" class=\"masthead__menu-item {{ class }}\">{{ link.title }}</a></li>\n</ul>\n{% endfor %}{% endraw %}\n```\n\n{% figure caption:\"Masthead end-result after some styling.\" %}\n![Masthead screenshot](/assets/images/mm-masthead-example.jpg)\n{% endfigure %}\n\nI've also used a similar technique to build drop-down navigations with nested lists. An example of one of those is as follows.\n\n##### Dropdown navigation data file\n\n```yaml\n# example /_data/navigation.yml\n- title: \"About\"\n  href: \"/about/\"\n  children:\n    - childtitle: \"Biography\"\n      childhref: \"/about/bio/\"\n    - childtitle: \"Resume\"\n      childhref: \"/about/resume/\"\n\n- title: \"Portfolio\"\n  href: \"/portfolio/\"\n  children:\n    - childtitle: \"Design\"\n      childhref: \"/portfolio/design/\"\n    - childtitle: \"Illustration\"\n      childhref: \"/portfolio/illustration/\"\n    - childtitle: \"Development\"\n      childhref: \"/portfolio/development/\"\n```\n\n##### Dropdown navigation HTML and Liquid\n\n```html\n<ul>\n  {% raw %}{% for nav in site.data.navigation %}\n    {% if nav.children != null %}\n      <li><a href=\"{{ nav.href }}\">{{ nav.title }}</a>\n        <ul class=\"child\">\n        {% for child in nav.children %}\n          <li><a href=\"{{ child.childhref }}\">{{ child.childtitle }}</a></li>\n        {% endfor %}\n        </ul>\n        {% else %}\n      <li><a href=\"{{ nav.href }}\">{{ nav.title }}</a>{% endif %}</li>\n  {% endfor %}{% endraw %}\n</ul>\n```\n\nWhich will produce the following HTML:\n\n```html\n<ul>\n  <li><a href=\"/about/\">About</a>\n    <ul class=\"child\">\n      <li><a href=\"/about/bio/\">Biography</a></li>\n      <li><a href=\"/about/resume/\">Resume</a></li>\n    </ul>\n  </li>\n  <li><a href=\"/portfolio/\">Portfolio</a>\n    <ul class=\"child\">\n      <li><a href=\"/portfolio/design/\">Design</a></li>\n      <li><a href=\"/portfolio/illustration/\">Illustration</a></li>\n      <li><a href=\"/portfolio/development/\">Development</a></li>\n    </ul>\n  </li>\n</ul>\n```\n\n#### Author overrides\n\n**Made Mistakes** has always had a singular voice, so supporting multiple authors wasn't really on my radar. But for some of [my Jekyll themes]({% link _work/jekyll-themes.md %}) the need arose and I added support for assigning authors with a data file. \n\nTo achieve this. a YAML file in created in the `_data` directory with all of the authors.\n\n```yaml\n# /_data/authors.yml\n\nbilly_rick:\n  name: Billy Rick\n  web: http://\n  email: billy@rick.com\n  bio: \"I am a very extravagant man.\"\n  avatar: billy-rick-photo.jpg\n\ncornelius_fiddlebone:\n  name: Cornelius Fiddlebone\n  email: cornelius@fiddlebone.com\n  bio: \"Jewel miner.\"\n  avatar: cornelius-fiddlebone-photo.jpg\n```\n\nThen, to override the author on any given post or page, `author:` is added to its YAML Front Matter with a key that matches one in `authors.yml`. For example to assign **Billy Rick** as the author of a post I'd add `author: billy_rick`.\n\nWith a small layout addition, Liquid is used to assign Billy Rick's info, replacing the default values. In cases where an author isn't set {% raw %}`{{ site.owner }}`{% endraw %} values in `_config.yml` are used instead.\n\n```html\n{% raw %}{% if page.author %}\n  {% assign author = site.data.authors[page.author] %}{% else %}{% assign author = site.owner %}\n{% endif %}\n{% if author.avatar contains 'http' %}\n  <img src=\"{{ author.avatar }}\" class=\"bio-photo\" alt=\"{{ author.name }} bio photo\"></a>\n{% elsif author.avatar %}\n  <img src=\"/assets/images/{{ author.avatar }}\" alt=\"{{ author.name }} bio photo\"></a>\n{% endif %}\n<h3 class=\"author-name\">{{ author.name }}</h3>\n{% if author.bio %}<p class=\"author-bio\">{{ author.bio }}</p>{% endif %}{% endraw %}\n```\n\n#### Slug names\n\nThis next one is probably overkill and inefficient in most scenarios, but for me, it has a use. The hacky way I'm going about creating breadcrumb navigations imposes some limitations on the crumb titles.\n\nWith Liquid I'm taking a `page.url` and then grabbing the first bit of text before `/`. Since I'm fairly consistent in how I organize posts (using categories as part of my permalink format) this works reliably. The problem I run into is some of these \"slug\" names aren't all that descriptive or properly title cased.\n\nBy using a `slugs.yml` data file as a definition list I can replace these \"simple slugs\" with whatever I want. \n\nLet's use the \"[What tools do you use to build your website?](/faqs/website-tools/)\" FAQ page from my site as an example. If I were to output breadcrumbs for this page, I'd filter the `page.url` of `https://mademistakes.com/faqs/website-tools/` down to `faqs` and end up with the following breadcrumbs: `Home > faqs`\n\nWhich isn't the worst thing in the world, but ideally **faqs** would be properly capitalized (eg. FAQs) or spelled out as \"**Frequently Asked Questions**.\"\n\nTo fix this, I add a `faqs` slug to `slugs.yml` and assign it a nice descriptive name to use as the title --- like \"Frequently Asked Questions.\"\n\n```yaml\nfaqs:\n  name: \"Frequently Asked Questions\"\n```\n\nThe [`breadcrumbs.html`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/_includes/breadcrumbs.html) include is then modified to output a `slug.name` instead.\n\n```html\n{% raw %}{% assign page_slug = page.url | remove_first: '/' | split: '/' %}\n{% assign slug_first = page_slug[0] %}\n{% assign slug = site.data.slugs[slug_first] %}\n\n<nav class=\"breadcrumbs\">\n  <span itemscope itemtype=\"http://data-vocabulary.org/Breadcrumb\">\n    <a href=\"/\" class=\"breadcrumb__item\" itemprop=\"url\">\n      <span itemprop=\"title\">Home</span>\n    </a> <span class=\"breadcrumb__sep\">×</span>\n  </span>\n  <span itemscope itemtype=\"http://data-vocabulary.org/Breadcrumb\">\n    <a href=\"/{{ page_slug[0] }}/\" class=\"breadcrumb__item\" itemprop=\"url\">\n      <span itemprop=\"title\">{{ slug.name }}</span>\n    </a>\n  </span>\n</nav>{% endraw %}\n```\n\n{% figure caption:\"Tada! Properly capitalized and descriptive breadcrumb titles.\" %}\n![Breadcrumb screenshot](/assets/images/mm-breadcrumb-example.jpg)\n{% endfigure %}\n\n#### Translation keys\n\nLocalizing my themes is an idea I've only started to flirt with. The thought of using [data files as translation keys](https://tuananh.org/2014/08/13/localization-with-jekyll/) for localizing text was brought to my attention through a [pull request](https://github.com/mmistakes/jekyll-theme-skinny-bones/commit/b08024fcd4815e61eb3c9a0c60c0bc793f195db2) by [@yonojoy](https://github.com/yonojoy). This is by no means a full-on i18n solution, but it does help theme developers looking to support multiple languages.\n\nThere's three pieces to pulling this off.\n\n##### 1. Languages data file\n\nIn the case of my [**Skinny Bones**](https://mmistakes.github.io/jekyll-theme-skinny-bones/) starter theme, German and [French](https://github.com/mmistakes/jekyll-theme-skinny-bones/commit/bd4c02bbf29ffbc0194fa6d871f9fefcb8979ed5) translations have been added via hashes in a YAML file (eg. `/_data/languages.yml`).\n\n```yaml\nlocales:\n  # English ---------------------------------------------\n  en: &DEFAULT_EN\n    overview: \"Overview\"\n    toc: \"Table of Contents\"\n    written_by: \"Written by\"\n    updated: \"Updated\"\n    share: \"Share on\"\n  en_US:\n    <<: *DEFAULT_EN     # use en for en_US\n  en_UK:\n    <<: *DEFAULT_EN     # use en for en_UK\n\n  # German translations ---------------------------------\n  de: &DEFAULT_DE\n    <<: *DEFAULT_EN     # load English values as default\n    overview: \"&Uuml;bersicht\"\n    toc: \"Inhalt\"\n    written_by: \"Verfasst von\"\n    updated: \"Zuletzt aktualisiert:\"\n    share: \"\"\n  de_DE:\n    <<: *DEFAULT_DE     # use de translation for de_DE\n\n  # French translations ---------------------------------\n  fr: &DEFAULT_FR\n    <<: *DEFAULT_EN     # load English values as default\n    overview: \"Aperçu\"\n    toc: \"Table des matières\"\n    written_by: \"Écrit par\"\n    updated: \"Mis à jour\"\n    share: \"Partager sur\"\n  fr_FR:\n    <<: *DEFAULT_FR     # use fr translation for fr_FR\n```\n\n##### 2. Set locale in Jekyll config\n\nTo change the default language, a locale variable is set in `_config.yml`. For example to switch from English to French you'd add `locale: fr_FR` or `locale: fr`. \n\n##### 3. Call in the correct language hashes\n\nThe last step is using long variables like `{% raw %}{{ site.data.languages.locales[site.locale].updated }}{% endraw %}` into the appropriate places --- replacing any text you want to localize. If done correctly, this variable should output with the French `updated` string, `Mis à jour`.\n\nIf you want to learn more about this technique be sure to check out Tuan Anh's [blog post](https://tuananh.org/2014/08/13/localization-with-jekyll/). Or if you're looking for a plugin to do the heavy lifting, [Jekyll-Multiple-Languages][multiple-languages] might be a good place to start.\n\n---\n\nMaybe not 100% complete, but this is certainly the majority of techniques I've picked up using Jekyll over the years. What keeps me coming back is its flexibility --- there's no shortage of ways to approach a problem and always new things to learn. Browse the threads on [Jekyll Talk](http://talk.jekyllrb.com/) on any given day and you'll see what I mean :smile:.\n\n[sitemap]: https://github.com/jekyll/jekyll-sitemap\n[archives]: https://github.com/jekyll/jekyll-archives\n[assets]: https://github.com/jekyll/jekyll-assets\n[related-posts]: https://github.com/toshimaru/jekyll-tagging-related_posts\n[picture-tag]: https://github.com/robwierzbowski/jekyll-picture-tag\n[responsive-image]: https://github.com/wildlyinaccurate/jekyll-responsive-image\n[jekyll-srcset]: https://github.com/netlify/jekyll-srcset\n[multiple-languages]: https://github.com/screeninteraction/jekyll-multiple-languages-plugin\n\n*[SCSS]: Sassy CSS\n*[CMS]: Content Management System\n*[YAML]: YAML Ain't Markup Language\n*[JSON]: JavaScript Object Notation\n*[CSV]: Comma-separated values\n*[DRY]: Don't Repeat Yourself is a principle of software development, aimed at reducing repetition.\n*[UI]: User Interface\n"
  },
  {
    "path": "src/_posts/articles/2016-08-21-jekyll-static-comments.md",
    "content": "---\ntitle: \"Going static part 2: static comments\"\nexcerpt: \"Integrating a static-based commenting system into Jekyll with the help of Staticman and ditching Disqus in the process.\"\ncategories: [articles]\ntags: [Jekyll, web development, GitHub, open source, tutorial]\nimage:\n  path: &image /assets/images/going-static-comments-feature.jpg\n  width: 1800\n  height: 700\n  feature: *image\n  caption: \"Photo by [**Ian Schneider**](https://unsplash.com/@goian)\"\ntwitter:\n  card: summary_large_image\ncomments: true\ncomments_locked: true\ntoc: true\nlast_modified_at: 2018-03-22T10:45:51-04:00\n---\n\nOffloading comments to an external service like Disqus[^third-party-commenting] has always felt like a necessary evil to me when building Jekyll sites.\n\nConvenient to embed a small bit of `<script>` voodoo into your pages, sure. But kiss goodbye to controlling the user experience, look and feel, data, and privacy. The alternatives haven't been all that great for the statically-minded unless you were willing to make some compromises...\n\n[^third-party-commenting]: There are several third-party commenting services to choose from: [**Disqus**](https://disqus.com/), [**IntenseDebate**](https://intensedebate.com/), [**Livefrye**](http://web.livefyre.com/), [**Facebook**](https://developers.facebook.com/docs/plugins/comments/), and countless others. They all essentially work the same --- you embed some JavaScript on your site and comments magically appear.\n\n## Self hosted comment systems\n\n[**Isso**](https://posativ.org/isso/)[^self-hosted-commenting] describes itself as \"commenting software similar to Disqus.\" You host a SQLite database and embed some JavaScript on your pages (just like Disqus and friends) and you're ready to roll. After freeing my content from Wordpress and \"[going static]({% post_url /articles/2012-03-19-going-static %})\" I really didn't want to manage a database again just to have comments on my site. So these solutions were out.\n\n[^self-hosted-commenting]: Other self-hosted commenting systems include: [**Discourse**](http://www.discourse.org/), [**talkatv**](https://github.com/talkatv/talkatv), [**Juvia**](https://github.com/phusion/juvia), [**HashOver**](https://github.com/jacobwb/hashover), and [**Savas**](https://github.com/savaslabs/squabble).\n\n## Static comments\n\nWhat I really was searching for was a commenting system to compliment the rest of my Jekyll generated site.\n\nOver the years I've come across [several solutions](https://tlvince.com/static-commenting) that seemed promising: \n\n- Use `mailto` links (how very retro :smirk:) to email comments for inclusion into post.\n- Use PHP to do something similar.\n- Leverage [GitHub's issue tracker](http://ivanzuzak.info/2011/02/18/github-hosted-comments-for-github-hosted-blogs.html).\n\nJekyll plugins like [**Jekyll::StaticComments**](http://theshed.hezmatt.org/jekyll-static-comments/) and [**Jekyll AWS Comments**](http://ivanzuzak.info/2011/02/18/github-hosted-comments-for-github-hosted-blogs.html) were pretty close to what I was looking for. A PHP `<form>` captures a comment, converts into YAML and emails it over to be placed in a prescribed location. Then with the help of a Liquid `for` loop, comments are displayed on the appropriate pages.\n\nI can't really explain it, but something about using PHP with Jekyll felt off to me. And so I didn't pull the trigger on these solutions either.\n\nIt wasn't until I discovered Eduardo Bouças's blog post \"[*Rethinking the Comment System for My Jekyll Site*](https://eduardoboucas.com/blog/2015/05/11/rethinking-the-commenting-system-for-my-jekyll-site.html)\" and the launch of [**Staticman**](https://staticman.net/) 2.0 that I finally decided to ditch Disqus. Starting the process of migrating years of comment data and integrating them into the rest of my site's statically generated content. \n\n### Enter Staticman\n\nOn paper and in practice Staticman was just the app I was looking for to power static-based commenting on my site.\n\n- Designed to work with [**Jekyll**](http://jekyllrb.com/) and [**GitHub Pages**](https://pages.github.com/).\n- Free and open source. Run it on your own server as a Node.js app or go the free hosted route.\n- Complete control over the data/content, user experience, and user interface.\n- Not just for comments! Perfect for any sort of user generated content: *reviews*, *comments*, *polls*, and more.\n- User submitted content can be merged in automatically or moderated.\n\n### Getting started\n\nMuch like building my first Jekyll site, I found the process of integrating Staticman into my workflow very rewarding. It was nice to get dirty again crafting markup, styling `<form>`s, and giving comments a feel that fit the rest of my site.\n\nThankfully I didn't have to start from scratch as I was able to draw inspiration from the Staticman demo site --- [**Popcorn**](https://github.com/eduardoboucas/popcorn) and [Eduardo Bouças's](https://github.com/eduardoboucas/eduardoboucas.github.io) personal site. The documentation for Staticman does a good job of explaining [how to set things up](https://staticman.net/docs/) so definitely give that a read first to familiarize yourself with what the app can do.\n\n### Building the form\n\nI set my gaze on squaring away the \"Leave a comment\" submission form first. Seemed like an easy target as the styling of various [form elements](/style-guide/#guide-forms) like `<input>`, `<label>`, `<textarea>` and [buttons](/style-guide/#guide-buttons) were already done as part of my [living style guide]({% post_url /articles/2015-02-10-jekyll-style-guide %}). \n\nAll it really needed for completion was a decision on what fields I wanted to capture, and a little bit of JavaScript for events handling and submission. Arriving at this for my [`post__comments.html`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/_includes/post__comments.html) include (`class` names and Liquid removed for brevity).\n\n```html\n{% raw %}<form id=\"comment-form\" method=\"post\" action=\"https://api.staticman.net/v1/entry/{{ site.repository }}/{{ site.staticman.branch }}\">\n  <fieldset>\n    <label for=\"comment-form-message\">Comment</label>\n    <textarea type=\"text\" rows=\"3\" id=\"comment-form-message\" name=\"fields[message]\" tabindex=\"1\"></textarea>\n  </fieldset>\n  <fieldset>\n    <label for=\"comment-form-name\">Name</label>\n    <input type=\"text\" id=\"comment-form-name\" name=\"fields[name]\" tabindex=\"2\" />\n  </fieldset>\n  <fieldset>\n    <label for=\"comment-form-email\">Email address</label>\n    <input type=\"email\" id=\"comment-form-email\" name=\"fields[email]\" tabindex=\"3\" />\n  </fieldset>\n  <fieldset>\n    <label for=\"comment-form-url\">Website</label>\n    <input type=\"url\" id=\"comment-form-url\" name=\"fields[url]\" tabindex=\"4\"/>\n  </fieldset>\n  <fieldset class=\"hidden\" style=\"display:none;\">\n    <!-- used by Staticman to generate filenames for each comment -->\n    <input type=\"hidden\" name=\"options[slug]\" value=\"{{ page.slug }}\">\n    <!-- honey pot field used to filter out spam -->\n    <label for=\"comment-form-location\">Not used. Leave blank if you are a human.</label>\n    <input type=\"text\" id=\"comment-form-location\" name=\"fields[hidden]\" autocomplete=\"off\"/>\n  </fieldset>\n  <fieldset>\n    <button type=\"submit\" id=\"comment-form-submit\" tabindex=\"5\">Submit Comment</button>\n  </fieldset>\n</form>{% endraw %}\n<!-- End new comment form -->\n```\n\nStaticman's documentation covers this in more detail, but essentially I'm adding `fields[]` values to the `name` attributes. `message`, `name`, `email`, and `url` fields are then used to generate a .yml similar to this:\n\n```yaml\nmessage: \"![Bill Murray](http://www.fillmurray.com/400/300)\\r\\n\\r\\n“It's hard to be an artist. It's hard to be anything. It's hard to be.”\"\nname: Bill Murray\nemail: b0caa2a71f5066b3d90711c224578c21\nurl: ''\nhidden: ''\ndate: '2016-08-11T19:33:25.928Z'\n```\n\nA note on `hidden` and `date` fields you may have noticed in the sample comment above:\n\n**`hidden`** is used as a spam deterrent in the form of a :honeybee: honeypot. The thought is a human wouldn't fill out an input they can't see, but a spam bot may. Adding `fields[hidden]` to this input and not placing it in the `allowedFields` array in our Jekyll config, instructs Staticman to reject the entry. Hopefully filtering out bots who are dumb enough to populate it with something.\n\n**`date`** is captured when the entry is generated by Staticman. Its format can be changed from `iso8601` (default) to `timestamp-seconds` or `timestamp-milliseconds`.\n\n#### Interactions and state\n\nUsing Popcorn's [`main.js`](https://github.com/eduardoboucas/popcorn/blob/gh-pages/js/main.js) as a guide I [added all the AJAX goodness](https://github.com/mmistakes/made-mistakes-jekyll/blob/30e10cce7836b38ea2d7f570573ac748fa7ba12e/_assets/javascripts/main.js#L128-L164), alert messaging, along with `disabled` and loading form states. \n\nTo avoid disrupting the flow too much I went with inline alert messaging directly above the **submit button**.\n\n{% figure caption:\"Comment form inline alert example.\" %}\n![Inline comment form alert example](/assets/images/mm-comment-inline-alert.png)\n{% endfigure %}\n\nAnd to improve the user experience upon submission the submit button's text changes to `Loading...`, becomes disabled, and an animated SVG icon inserted for bit of extra flare.\n\n```js\n$(form).addClass('disabled');\n$('#comment-form-submit').html('<svg class=\"icon spin\"><use xlink:href=\"#icon-loading\"></use></svg> Loading...');\n```\n\n{% figure caption:\"Submit button loading animation.\" %}\n![Submit button loading animation](/assets/images/mm-submit-comment-loading.gif)\n{% endfigure %}\n\nIf the form is successfully submitted a message appears notifying the user that the comment has been received and is pending moderation. Since my site takes a bit to generate with Jekyll I felt it necessary to convey this to the user, hopefully avoiding duplicate submissions. \n\nWith smaller sites hosted with GitHub Pages this becomes less of a problem, as they build much faster. Especially true if you decide to go with the auto merge option and skip [moderating comments](https://github.com/eduardoboucas/staticman#moderation-required).\n\n{% figure caption:\"The comment form in action.\" %}\n![Form submit success animation](/assets/images/mm-submit-comment-success.gif)\n{% endfigure %}\n\n### Displaying comments\n\nThere's a bunch of Staticman settings available to you, but forget all that right now. For this next step all you really need to know is **static comment files will live in `_data/comments/<post slug>/`**. By predictably placing them here we will be able to access their contents from the following array: `{% raw %}site.data.comments[page.slug]{% endraw %}`.\n\nWith this array we'll be looping through it with [`for`][for-tag] just like you would with `site.posts` to spit out a list of all posts. But first we'll use an [`assign`][assign-tag] tag to rename the array and apply a `sort`[^sort-filter] filter on the objects. This will order them by filename, which in our case should be chronological[^chronological].\n\n[for-tag]: https://help.shopify.com/themes/liquid/tags/iteration-tags#for\n[assign-tag]: https://help.shopify.com/themes/liquid/tags/variable-tags#assign\n[^sort-filter]: Sort an array. Optional arguments for hashes: 1. property name 2. nils order (first or last).\n[^chronological]: eg. `comment-2014-02-10-040840.yml`, `comment-2015-03-22-204128.yml`, etc.\n\n```liquid\n{% raw %}{% assign comments = site.data.comments[page.slug] | sort %}\n{% for comment in comments %}\n  show a comment\n{% endfor %}{% endraw %}\n```\n\nSince I'm capturing `message`, `name`, `email`, and `url` in the comment form these will be the same fields I'll want to pull from to build each comment. Using an [`assign`](https://help.shopify.com/themes/liquid/tags/variable-tags#assign) tag again we'll cleanup variable names like `comment[1].avatar` into just `avatar`. Which will then be used to [pass parameters](https://jekyllrb.com/docs/templates/#includes) into the [`comment.html`](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.2.0/_includes/comment.html) include:\n\n```liquid\n{% raw %}{% assign comments = site.data.comments[page.slug] | sort %}\n{% for comment in comments %}\n  {% assign avatar = comment[1].avatar %}\n  {% assign email = comment[1].email %}\n  {% assign name = comment[1].name %}\n  {% assign url = comment[1].url %}\n  {% assign date = comment[1].date %}\n  {% assign message = comment[1].message %}\n  {% include comment.html index=forloop.index avatar=avatar email=email name=name url=url date=date message=message %}\n{% endfor %}{% endraw %}\n```\n\nIf done correctly the values and strings in a data file like `_data/comments/basics/comment-2014-02-10-040840.yml`\n\n```yaml\n---\nid: comment-1237690364\ndate: '2014-02-10 04:08:40 +0000'\nupdated: '2014-02-10 04:08:40 +0000'\npost_id: \"/basics\"\nname: Tamara\nurl: ''\nmessage: \"This? This is freakin' awesome! Thanks so much for sharing your mad skills and expertise with us!\"\n```\n\nShould populate `_includes/comment.html` and spit out as the following HTML:\n\n```html\n<article id=\"comment1\" class=\"js-comment comment\" itemprop=\"comment\" itemscope itemtype=\"http://schema.org/Comment\">\n  <div class=\"comment__avatar-wrapper\">\n    <img class=\"comment__avatar\" src=\"https://www.gravatar.com/avatar/?d=mm&amp;s=50\" srcset=\"https://www.gravatar.com/avatar/?d=mm&amp;s=100 2x\" alt=\"Tamara\" height=\"50\" width=\"50\">\n  </div>\n  <div class=\"comment__content-wrapper\">\n    <h3 class=\"comment__author\" itemprop=\"author\" itemscope itemtype=\"http://schema.org/Person\">\n      <span itemprop=\"name\">Tamara</span>\n    </h3>\n    <div class=\"comment__date\">\n      <a href=\"#comment1\" itemprop=\"url\">\n      <time datetime=\"2014-02-09T23:08:40-05:00\" itemprop=\"datePublished\">February 09, 2014 at 11:08 PM</time>\n      </a>\n    </div>\n    <div itemprop=\"text\"><p>This? This is freakin’ awesome! Thanks so much for sharing your mad skills and expertise with us!</p></div>\n  </div>\n</article>\n```\n\nLooking like this when styled with `CSS`:\n\n{% figure caption:\"Comment example (rendered HTML).\" %}\n![Comment example](/assets/images/mm-comment-example.png)\n{% endfigure %}\n\nThere's not much magic in the `comment.html` include --- some [structured data](https://schema.org/Comment) markup sprinkled about and a few Liquid conditionals for displaying author avatars and URLs.\n\n{% notice %}\n#### ProTip: encode email addresses as MD5 hashes\n\nStaticman supports [transforming a string](https://github.com/eduardoboucas/staticman#transforms) into a MD5 hash. By doing this you avoid compromising a commenter's email address in what could potentially be accessible from a public GitHub repo. These hashed emails also have the benefit of being used with [**Gravatar**](https://en.gravatar.com/site/implement/hash/) to pull in avatar images.\n{% endnotice %}\n\n### Setting up Staticman\n\nWith the front-end portion of my *static-based comment system* squared away, it was time to configure Staticman. Because I went with the hosted version, it only took a few quick steps to setup.\n\n#### Adding Staticman as a collaborator\n\nFirst you need to grant Staticman access to your Jekyll repository on GitHub. You don't have to actually host the site there (I use [Media Temple](http://bit.ly/1Ugg7nN) for that), but it does need to be a [standard Jekyll site](https://jekyllrb.com/docs/structure/) with valid `_config.yml`.\n\nFollowing the docs I added GitHub username `staticmanapp` as a collaborator and then pinged `https://api.staticman.net/v1/connect/{your GitHub username}/{your repository name}` as instructed to accept the invitation.\n\n![staticmanapp as collaborator](/assets/images/staticman-collaborator.png)\n\n#### Configuring Staticman\n\nStaticman is configured by settings defined in your Jekyll `_config.yml` under a `staticman` object. There's a whole [list of stuff](https://github.com/eduardoboucas/staticman#jekyll-configuration) you can configure --- the important stuff being `allowedFields`, `branch`, `format`, `moderation`, and `path`.\n\n{% notice %}\n#### Branch setting\n\nThis is the branch comment files will be sent to via pull requests. If you host your site on GitHub Pages it will likely be `master` or `gh-pages`. If you're unsure check the [**Configuring a Publishing Source**](https://help.github.com/articles/configuring-a-publishing-source-for-github-pages/) documentation to refresh your memory.\n{% endnotice %}\n\nThere's also an undocumented `generatedFields`[^generated-fields] setting that is useful for time stamping each file Staticman creates.\n\n[^generated-fields]: Adds a [`date` timestamp](https://github.com/eduardoboucas/staticman/issues/9) to entries in ISO8601, seconds, or milliseconds formats.\n\nI ended up with the following settings in my `_config.yml`:\n\n```yaml\nstaticman:\n  allowedFields          : ['name', 'email', 'url', 'message']\n  branch                 : \"master\"\n  commitMessage          : \"New comment.\"\n  filename               : comment-{@timestamp}\n  format                 : \"yml\"\n  moderation             : true\n  path                   : \"_data/comments/{options.slug}\"\n  requiredFields         : ['name', 'email', 'message']\n  transforms:\n    email                : \"md5\"\n  generatedFields:\n    date:\n      type               : \"date\"\n      options:\n        format           : \"iso8601\"\n```\n\nIn case spam makes it through, I'd like another layer of \"protection\" to block it. Setting `moderation: true` will make Staticman send a pull request whenever a new comment entry is submitted. At this point you can examine the content inside of the PR and decide if you want to **merge** or **close** it.\n\nWhen hosting with GitHub Pages, a merge will instantly force Jekyll to rebuild the site --- publishing the comment. Since I self host I have the extra step of pulling from `remote`, before building locally and [deploying via rsync]({% post_url /articles/2016-02-17-using-jekyll-2016 %}#deployment).\n\n{% notice %}\n#### ProTip: webhooks for branch auto deletion\n\nAvoid manually cleaning up Staticman generated branches. Create a GitHub webhook instead that sends a POST request to the following payload URL `https://api.staticman.net/v1/webhook` and triggers a **`pull_request`** event automatically to delete Staticman branches on merge or close.\n{% endnotice %}\n\n### Hooking up the form\n\nFor your forms to work with Staticman they need to `POST` to:\n\n```\nhttps://api.staticman.net/v1/entry/{your GitHub repository}/{your repository name}/{the name of the branch}`\n```\n\nInstead of hard-coding the site repository and branch strings into this endpoint, use `site` variables defined in `_config.yml` instead. eg: {% raw %}`{{ site.repository }}` and `{{ site.staticman.branch }}`{% endraw %} respectively.\n\n```yaml\n# sample _config.yml\n\nrepository: \"mmistakes/made-mistakes-jekyll\"\nstaticman:\n  branch: \"master\"\n```\n\nHitting the Staticman endpoint should trigger the **success** and **error** messages in our comment `<form>`. Firing up the console in your browser of choice can also give you some more hints on what's going on if you encounter any snags.\n\nFor example if all of the required fields aren't filled out an error like this could hit the console:\n\n```js\nObject {readyState: 4, responseText: \"[{\"code\":\"MISSING_REQUIRED_FIELDS\",\"data\":[\"name\",\"email\",\"message\"]}]\", responseJSON: Array[1], status: 500, statusText: \"error\"}\n```\n\n{% notice %}\n#### ProTip: redirect after POST\n\nTo set a redirect URL for your form after comment submission, simply add a hidden `input` like so: `<input type=\"hidden\" name=\"options[redirect]\" value=\"http://your-redirect-url.com\">`.\n{% endnotice %}\n\n### Publishing comments\n\nIf configured correctly you should receive a pull request notification on GitHub each time a comment entry is submitted. Look the commit over (if you're moderating them) and **merge pull request** to accept or **close** to block it.\n\n{% figure caption:\"Staticman **pull request** notifications on GitHub.\" %}\n![Staticman pull request notifications on GitHub](/assets/images/staticman-github-pull-requests.png)\n{% endfigure %}\n\n{% figure caption:\"Staticman pull request merged and branch auto-deleted via webhook.\" %}\n![Staticman pull request merge on GitHub](/assets/images/staticman-pull-request-merge.png)\n{% endfigure %}\n\n---\n\n## Migrating Disqus comments\n\nIt was now time to deal with the 500+ Disqus comments I've accumulated. A good chunk of them had valuable content worth keeping, so I didn't exactly want to dump them all.\n\nI came across a Rake task by *Patrick Hawks*, aptly named [**jekyll-disqus-comments**](https://github.com/pathawks/jekyll-disqus-comments) that downloads Disqus posts as YAML files via the [Disqus API](https://disqus.com/api/docs/).\n\nWith [some modifications](https://github.com/mmistakes/jekyll-disqus-comments) I was able to get it working with my site and `_posts` files.\n\n### Installing\n\nCopy the following files to the root of your Jekyll project folder.\n\n- [`_rake/disqus_comments.rake`](https://github.com/mmistakes/jekyll-disqus-comments/blob/master/_rake/disqus_comments.rake)\n- [`Rakefile`](https://github.com/mmistakes/jekyll-disqus-comments/blob/master/Rakefile) (Not necessary if you already have a Rakefile that loads `_rake/*`)\n\n### Obtain a Disqus API public key\n\nTo use the plugin, you will need to obtain a `public key` from the [Disqus API](http://disqus.com/api/applications/) and add it to your `_config.yml`. You can do this by:\n\nStep 1. [**Register new application**](https://disqus.com/api/applications/register/).\n\nStep 2. **Setup application** using suggested configuration below:\n\n```\nLabel: <Name of application> eg. Jekyll Disqus importer\nDescription: Convert comments into static files.\nWebsite:\nDomains: disqus.com\nDefault Access: Read only\n```\n\nStep 3. Add the following lines to your `_config.yml`:\n\n```yaml\ncomments:\n  disqus:\n    short_name: YOUR-DISQUS-FORUM-SHORTNAME-HERE\n    api_key:    YOUR-DISQUS-PUBLIC-KEY-HERE\n```\n\n### Run import task\n\nImport comments from Disqus by running `rake disquscomments` from the CLI. If it completes successfully you should find a set of `.yml` files in `_data/comments/<post-slug>/` similar to this:\n\n```\n├── _data\n|  └── comments\n|      └── 365-days-of-drawing\n|      |   └── comment-2013-08-30-162902.yml\n|      |   └── comment-2013-08-30-204505.yml\n|      └── basics\n|          └── comment-2014-02-10-040840.yml\n```\n\nEach with YAML Front Matter data similar to this:\n\n```yaml\n---\nid: comment-1237690364\ndate: '2014-02-10 04:08:40 +0000'\nupdated: '2014-02-10 04:08:40 +0000'\npost_id: \"/basics\"\nname: Tamara\nurl: ''\nmessage: \"This? This is freakin' awesome! Thanks so much for sharing your mad skills and expertise with us!\"\n```\n\nKey names correlate with the ones defined earlier with Staticman, along with a few specific to Disqus: `id`, `updated`, and `post_id` that aren't currently used on the site.\n\nI'm a little obsessive so I went through a ton of old comments adding [GitHub Flavored Markdown](https://guides.github.com/features/mastering-markdown/#GitHub-flavored-markdown)[^markdown-filter] backticks to improve the reading experience of code blocks. Having properly formatted code blocks in comments looks so good I couldn't pass it up. \n\nPulling this off with Disqus required way [more work](https://help.disqus.com/customer/portal/articles/466253) and didn't support Markdown.\n\n[^markdown-filter]: The `markdownify` filter is used in `_includes/comment.html` to convert Markdown-formatted strings found in `{% raw %}{{ include.message }}{% endraw %}` into HTML.\n\n{% figure caption:\"Syntax highlighted code blocks in comments.\" %}\n![Syntax highlighted code blocks in comments](/assets/images/mm-comments-syntax-highlighted.png)\n{% endfigure %}\n\n### Troubleshooting\n\nWhen running `rake disquscomments` I ran into several warnings like this:\n\n```\nComments feed not found: <domain.com>/post-slug/\n```\n\nFor posts that I knew didn't have any comments this wasn't a problem, but for those that did it was a real head scratcher. Eventually I discovered that `ident` in **`disqus_comments.rake`** wasn't matching the style of post permalinks used on my site.\n\nI was able to determine what Disqus was expecting for id's and adjust the plugin by:\n\n1. [Exporting all my Disqus comments](https://disqus.com/admin/discussions/export/) as XML.\n2. Opening the Disqus XML file.\n3. Looking at the `<link>` elements eg. `<link>https://mademistakes.com/mastering-paper/contour-drawing/</link>`\n\nBy playing around with the [following line](https://github.com/mmistakes/jekyll-disqus-comments/blob/e2561412785af8cdc7579fa6a774eaccb020ea98/_rake/disqus_comments.rake#L50) in `disqus_comments.rake` I finally sorted it out:\n\n```ruby\n# site.url + post.id + trailing slash\nident = site['url'] + post.id + '/'\n```\n\n---\n\n## Final thoughts\n\nTreating comments as content and integrating them into the same build process as the rest of my site has been an informative and rewarding experience. By successfully migrating over 500 comments away from Disqus I was able to:\n\n- Style them consistently and match the rest of the site's design.\n- Improve the appearance of `<code>` blocks within comments.\n- Make it easier for visitors to leave a comment without having to create a Disqus account.\n\n### SEO implications\n\nThe comments left on many of my posts often contain corrections, follow-up, and other valuable post content. From earlier tests it did seem as if search engines were able to crawl the embedded Disqus JavaScript comments and partially index them. Time will tell if I'll see any SEO *lift* now that comments are part of the HTML and marked up as structured data.\n\n### Spam slipping through\n\nSeems to only happen on my older posts or ones that rank well in Google and friends. As no one is really adding valuable comments to these I've added a `comments_locked` conditional to disable the comment form on specific pages.\n\n```liquid\n{% raw %}{% unless page.comments_locked == true %}\n  <!-- comment form -->\n{% else %}\n  <p><!-- comments locked messaging --></p>\n{% endunless %}{% endraw %}\n```\n\nI'll have to keep an eye on the effectiveness of this method, or possibly find a tastier honeypot to better combat spam bots.\n\n### Comment replies\n\nOne thing I miss since leaving Disqus, are comment notifications. Sure you can setup GitHub to notify you of each Staticman pull request, which will in turn clue you in that you have a new comment. What's missing is a way to notify the commenter that there's been a reply to their comment.\n\nLess likely a commenter will return to the page to see if a reply was made without the nudge of a notification. Wordpress and friends has the whole \"**subscribe to comments**\" feature which could apply here I suppose.\n\n{% notice %}\n#### Update: replies, notifications, and more\n\nStaticman has been updated to support replies, email notifications, and [reCAPTCHA](https://www.google.com/recaptcha/intro/) (helps reduce spam comments). To learn more about how I added each of these to this site, read my post [Improving Static Comments with Jekyll & Staticman]({% post_url /articles/2016-12-08-improving-jekyll-static-comments %}).\n{% endnotice %}\n"
  },
  {
    "path": "src/_posts/articles/2016-12-08-improving-jekyll-static-comments.md",
    "content": "---\ntitle: \"Improving static comments with Jekyll & Staticman\"\nexcerpt: \"Using Staticman to add threaded comments and reply notifications to a static-based Jekyll site.\"\nimage:\n  path: &image /assets/images/improving-jekyll-static-comments-feature.jpg\n  width: 1790\n  height: 610\n  feature: *image\n  caption: \"[Photo by **Gabriel Santiago**](https://unsplash.com/@gabrielssantiago)\"\ntwitter:\n  card: summary_large_image\ncategories: [articles]\ntags: [web development, GitHub, Jekyll, tutorial]\ncomments: true\ncomments_locked: true\ntoc: true\nlast_modified_at: 2018-11-16T15:45:16-05:00\n---\n\nIn the months after ditching Disqus for a [static-based commenting system]({% post_url /articles/2016-08-21-jekyll-static-comments %}), [**Staticman**](https://staticman.net/) has matured with feature adds like *threaded comments* and *email notifications*.\n\nArmed with instructions provided by Eduardo Bouças in [this GitHub issue](https://github.com/eduardoboucas/staticman/issues/42 \"Email notification upon replies\"), I set off to level-up the commenting experience on **Made Mistakes**. Here's how I did it.\n\n## Upgrade to Staticman v2\n\nTo take advantage of the new features, it was necessary to migrate Staticman settings from Jekyll's `_config.yml` file into a new `staticman.yml` file[^staticman-yml]. None of the parameter names changed making the transition to `v2` that much easier.\n\n[^staticman-yml]: An added benefit of the new configuration file means you can use Staticman with other static site generators. `v2` no longer requires you to use a Jekyll specific `_config.yml` file.\n\n```yaml\ncomments:\n  allowedFields     : ['name', 'email', 'url', 'message']\n  branch            : \"master\"\n  commitMessage     : \"New comment.\"\n  filename          : \"comment-{@timestamp}\"\n  format            : \"yaml\"\n  moderation        : true\n  path              : \"src/_data/comments/{options.slug}\"\n  requiredFields    : ['name', 'email', 'message']\n  transforms:\n    email           : md5\n  generatedFields:\n    date:\n      type          : \"date\"\n      options:\n        format      : \"iso8601\"\n```\n\n{% notice %}\n#### New configuration options\n\nBe sure to check the [sample configuration file](https://github.com/eduardoboucas/staticman/blob/master/staticman.sample.yml) and [full list of parameters](https://staticman.net/docs/configuration) for setup ideas.\n\nFor example you can configure multiple properties (comments, reviews, and other types of user-generated content), change commit message and request body text, enable email notifications, and much more from a `staticman.yml` file.\n{% endnotice %}\n\n### Remove/add Staticman as a collaborator\n\nI'm not entirely sure if doing the following was necessary. I encountered errors when submitting test comments and this appeared to solve the problem. It's possible I mis-configured something else and that was the real issue...\n\nEither way, let me know about your experience upgrading from Staticman `v1` to `v2` in the comments below.\n\n1. Revoked collaboration rights for Staticman `v1` by removing from my GitHub repository.\n   ![Remove staticmanapp as a collaborator](/assets/images/staticman-remove-collaborator.png)\n2. Added Staticman back as [collaborator]({% post_url /articles/2016-08-21-jekyll-static-comments %}#setting-up-staticman).\n3. Pinged the version 2 endpoint `https://api.staticman.net/v2/connect/{your GitHub username}/{your repository name}` to accept the collaboration invitation.\n\n### Update POST endpoint in comment form\n\nTo `POST` correctly to Staticman, the `action` attribute in my comment form needed a small update. Changing `v1` to `v2` in [**_includes/page__comments.html**](https://github.com/mmistakes/made-mistakes-jekyll/blob/f0074b7b9e64b6d4b63dd13a371cedc576dae49d/src/_includes/page__comments.html#L34) and appending `/comments`[^property] to the end did the trick for me.\n\n```html\n{% raw %}<form id=\"comment-form\" class=\"page__form js-form form\" method=\"post\" action=\"https://api.staticman.net/v2/entry/{{ site.repository }}/{{ site.staticman.branch }}/comments\">{% endraw %}\n```\n\n[^property]: Site properties are optional. See Staticman documentation for details on [hooking up your forms](https://staticman.net/docs/#step-3-hook-up-your-forms).\n\n## Add support for threaded comments\n\nGetting nested comments working was a big pain point for me. Numerous Liquid errors, trying to wrap my head around `for` loops inside of other `for` loops, array filters that broke things, and more --- took me a bit to figure out.\n\n### Add \"replying to\" identifier\n\nTo properly nest replies I needed a way of determining their hierarchy. I went with a field named `replying_to` and added it as an `allowedField` to my Staticman config file:\n\n```yaml\nallowedFields: [\"name\", \"email\", \"url\", \"message\", \"replying_to\"]\n```\n\nAnd to my comment form as a hidden field:\n\n```html\n<input type=\"hidden\" id=\"comment-parent\" name=\"fields[replying_to]\" value=\"\">\n```\n\n{% notice %}\n#### Update: field name change\n\nAfter publishing this article I learned that [`options[parent]`](https://github.com/eduardoboucas/staticman/issues/42#issuecomment-262938831) is meant to identify subscription entries, and not comment lineage. I've since changed to `fields[replying_to]` and updated the article and sample code to reflect this.\n{% endnotice %}\n\n### Update Liquid loops\n\nTo avoid displaying duplicates, I needed to exclude replies and only top level comments in the main loop. This seemed like the perfect use-case for Jekyll's `where_exp` filter:\n\n{% notice %}\n#### Where expression Jekyll filter\n\nSelect all the objects in an array where the expression is true. Jekyll v3.2.0 & later. **Example:** `site.members | where_exp: \"item\", \"item.graduation_year == 2014\"`\n{% endnotice %}\n\nIf the hidden `fields[replying_to]` field I added to the form was working properly I should have comment data files similar to these:\n\n#### Parent comment example\n\n```yaml\nmessage: This is parent comment message.\nname: First LastName\nemail: md5g1bb3r15h\ndate: '2016-11-30T22:03:15.286Z'\n```\n\n#### Child comment example\n\n```yaml\nmessage: This is a child comment message.\nname: First LastName\nemail: md5g1bb3r15h\nreplying_to: '7'\ndate: '2016-11-02T05:08:43.280Z'\n```\n\nAs you can see above, the \"child\" comment has `replying_to` data populated from the hidden `fields[replying_to]` field in the form. Using this knowledge I tested against it using `where_exp:\"comment\", \"comment.replying_to == blank\"` to create an array of only \"top-level\" comments.\n\n```liquid\n{% raw %}{% assign comments = site.data.comments[page.slug] | sort | where_exp: \"comment\", \"comment[1].replying_to == blank\" %}\n{% for comment in comments %}\n  {% assign avatar      = comment[1].avatar %}\n  {% assign email       = comment[1].email %}\n  {% assign name        = comment[1].name %}\n  {% assign url         = comment[1].url %}\n  {% assign date        = comment[1].date %}\n  {% assign message     = comment[1].message %}\n  {% include comment.html avatar=avatar email=email name=name url=url date=date message=message %}\n{% endfor %}{% endraw %}\n```\n\n{% figure caption:\"Success, there be parent comments Captain!\" %}\n![Parent comments only](/assets/images/staticman-parent-comments-only.png)\n{% endfigure %}\n\n{% notice %}\n#### Note: `sort` and `where` filters don't mix\n\nI ran into strange behaviors and errors due to mixing a `sort` filter with `where` and `where_exp`. Came to the conclusion it was unnecessary as the items were already being sorted alphabetically based on their filenames, and removed the filter.\n\nI'm using the following: `filename: \\\"comment-{@timestamp}\\\"` structure. Your mileage may vary depending on how you name entries.\n{% endnotice %}\n\n{% notice %}\n#### Note: added back `sort` filter\n\nNot exactly sure if it's a filesystem or OS thing, but building my site with Travis CI shuffled the order of comments. Applying `sort` to the `comments` assign was necessary to get everything in the correct chronological order.\n{% endnotice %}\n\n#### Displaying nested comments\n\nHere is what I was looking to accomplish... before the headaches started :anguished: :gun:\n\n- Start a loop and on each iteration create a new array named `replies` of only reply comments.\n- Evaluate the value of `replying_to` in these replies.\n- If `replying_to` is equal to the index of the parent loop then it's a child and should be treated as one.\n- If not, move on to the next entry in the array.\n- Rinse and repeat.\n\nI determined the easiest way of assigning a unique identifier to each parent comment would be sequentially. Thankfully Liquid provides a way of doing this with `forloop.index`.\n\n```liquid\n{% raw %}{% assign index = forloop.index %}{% endraw %}\n```\n\n{% notice %}\n#### Universally unique identifier\n\nI realize an index based unique identifier isn't the smartest way to go about this. I have a mix of comment data migrated from Disqus and pre Staticman generating UUIDs as `_id` variables, so this made sense. YMMV.\n{% endnotice %}\n\n*[YMMV]: Your mileage may vary\n\nNext I nested a modified copy of the \"top-level comment\" loop from before inside of itself --- to function as the \"child\" or `replies` loop.\n\n```liquid\n{% raw %}{% capture i %}{{ include.index }}{% endcapture %}\n{% assign replies = site.data.comments[page.slug] | sort | where_exp: \"comment\", \"comment[1].replying_to == i\" %}\n{% for reply in replies %}\n  {% assign index       = forloop.index | prepend: '-' | prepend: include.index %}\n  {% assign replying_to = reply[1].replying_to %}\n  {% assign avatar      = reply[1].avatar %}\n  {% assign email       = reply[1].email %}\n  {% assign name        = reply[1].name %}\n  {% assign url         = reply[1].url %}\n  {% assign date        = reply[1].date %}\n  {% assign message     = reply[1].message %}\n  {% include comment.html index=index replying_to=replying_to avatar=avatar email=email name=name url=url date=date message=message %}\n{% endfor %}{% endraw %}\n```\n\nUnfortunately the `where_exp` filter proved troublesome yet again, causing Jekyll to error out with: `Liquid Exception: Liquid error (line 47): Nesting too deep in /_layouts/page.html`.\n\nAfter brief thoughts of the movie **Inception**, I applied an `inspect` filter to help troubleshoot the `replies` loop. I determined that the `where_exp` condition was failing[^integer-string] because I was trying to compare an integer against a string :flushed:.\n\n[^integer-string]: `15` is not the same as `'15'`. Those single quotes make a world of difference...\n\nTo solve this I placed a `capture` tag around the index variable to convert it from an integer into a string. Then modified the `where_exp` condition to compare `replying_to` against this new `{% raw %}{{ i }}{% endraw %}` variable --- fixing the issue and allowing me to move on.\n\n```liquid\n{% raw %}{% capture i %}{{ include.index }}{% endcapture %}\n{% assign replies = site.data.comments[page.slug] | where_exp:\"item\", \"item.replying_to == i\" %}{% endraw %}\n```\n\n#### `_includes/page__comments.html`\n\n```html\n{% raw %}<section class=\"page__reactions\">\n  {% if site.repository and site.staticman.branch %}\n    {% if site.data.comments[page.slug] %}\n      <!-- Start static comments -->\n      <div id=\"comments\" class=\"js-comments\">\n        <h2 class=\"page__section-label\">\n          {% if site.data.comments[page.slug].size > 1 %}\n            {{ site.data.comments[page.slug] | size }}\n          {% endif %}\n          Comments\n        </h2>\n        {% assign comments = site.data.comments[page.slug] | sort | where_exp: 'comment', 'comment[1].replying_to == blank' %}\n        {% for comment in comments %}\n          {% assign index       = forloop.index %}\n          {% assign replying_to = comment[1].replying_to | to_integer %}\n          {% assign avatar      = comment[1].avatar %}\n          {% assign email       = comment[1].email %}\n          {% assign name        = comment[1].name %}\n          {% assign url         = comment[1].url %}\n          {% assign date        = comment[1].date %}\n          {% assign message     = comment[1].message %}\n          {% include comment.html index=index replying_to=replying_to avatar=avatar email=email name=name url=url date=date message=message %}\n        {% endfor %}\n      </div>\n      <!-- End static comments -->\n    {% endif %}\n\n    {% unless page.comments_locked == true %}\n      <!-- Start new comment form -->\n      <div id=\"respond\">\n        <h2 class=\"page__section-label\">Leave a Comment <small><a rel=\"nofollow\" id=\"cancel-comment-reply-link\" href=\"{{ page.url | absolute_url }}#respond\" style=\"display:none;\">Cancel reply</a></small></h2>\n        <form id=\"comment-form\" class=\"page__form js-form form\" method=\"post\" action=\"https://api.staticman.net/v2/entry/{{ site.repository }}/{{ site.staticman.branch }}/comments\">\n          <fieldset>\n            <label for=\"comment-form-message\"><strong>Comment</strong> <small>(<a href=\"https://kramdown.gettalong.org/quickref.html\">Markdown</a> is allowed)</small></label>\n            <textarea type=\"text\" rows=\"6\" id=\"comment-form-message\" name=\"fields[message]\" required spellcheck=\"true\"></textarea>\n          </fieldset>\n          <fieldset>\n            <label for=\"comment-form-name\"><strong>Name</strong></label>\n            <input type=\"text\" id=\"comment-form-name\" name=\"fields[name]\" required spellcheck=\"false\">\n          </fieldset>\n          <fieldset>\n            <label for=\"comment-form-email\"><strong>Email</strong> <small>(used for <a href=\"http://gravatar.com\">Gravatar</a> image and reply notifications)</small></label>\n            <input type=\"email\" id=\"comment-form-email\" name=\"fields[email]\" required spellcheck=\"false\">\n          </fieldset>\n          <fieldset>\n            <label for=\"comment-form-url\"><strong>Website</strong> <small>(optional)</small></label>\n            <input type=\"url\" id=\"comment-form-url\" name=\"fields[url]\"/>\n          </fieldset>\n          <fieldset class=\"hidden\" style=\"display: none;\">\n            <input type=\"hidden\" name=\"options[origin]\" value=\"{{ page.url | absolute_url }}\">\n            <input type=\"hidden\" name=\"options[parent]\" value=\"{{ page.url | absolute_url }}\">\n            <input type=\"hidden\" id=\"comment-replying-to\" name=\"fields[replying_to]\" value=\"\">\n            <input type=\"hidden\" id=\"comment-post-id\" name=\"options[slug]\" value=\"{{ page.slug }}\">\n            <label for=\"comment-form-location\">Leave blank if you are a human</label>\n            <input type=\"text\" id=\"comment-form-location\" name=\"fields[hidden]\" autocomplete=\"off\">\n          </fieldset>\n          <!-- Start comment form alert messaging -->\n          <p class=\"hidden js-notice\">\n            <span class=\"js-notice-text\"></span>\n          </p>\n          <!-- End comment form alert messaging -->\n          <fieldset>\n            <label for=\"comment-form-reply\">\n              <input type=\"checkbox\" id=\"comment-form-reply\" name=\"options[subscribe]\" value=\"email\">\n              Notify me of replies by email.\n            </label>\n            <button type=\"submit\" id=\"comment-form-submit\" class=\"btn btn--large\">Submit Comment</button>\n          </fieldset>\n        </form>\n      </div>\n      <!-- End new comment form -->\n    {% else %}\n      <p><em>Comments are closed. If you have a question concerning the content of this page, please feel free to <a href=\"/contact/\">contact me</a>.</em></p>\n    {% endunless %}\n  {% endif %}\n</section>{% endraw %}\n```\n\n#### `_includes/comment.html`\n\n```html\n{% raw %}<article id=\"comment{% unless include.r %}{{ index | prepend: '-' }}{% else %}{{ include.index | prepend: '-' }}{% endunless %}\" class=\"js-comment comment {% if include.name == site.author.name %}admin{% endif %} {% unless include.replying_to == 0 %}child{% endunless %}\">\n  <div class=\"comment__avatar\">\n    {% if include.avatar %}\n      <img src=\"{{ include.avatar }}\" alt=\"{{ include.name | escape }}\">\n    {% elsif include.email %}\n      <img src=\"https://www.gravatar.com/avatar/{{ include.email }}?d=mm&s=60\" srcset=\"https://www.gravatar.com/avatar/{{ include.email }}?d=mm&s=120 2x\" alt=\"{{ include.name | escape }}\">\n    {% else %}\n      <img src=\"/assets/images/avatar-60.png\" srcset=\"/assets/images/avatar-120.png 2x\" alt=\"{{ include.name | escape }}\">\n    {% endif %}\n  </div>\n  <h3 class=\"comment__author-name\">\n    {% unless include.url == blank %}\n      <a rel=\"external nofollow\" href=\"{{ include.url }}\">\n        {% if include.name == site.author.name %}<svg class=\"icon\" width=\"20px\" height=\"20px\"><use xlink:href=\"#icon-mistake\"></use></svg> {% endif %}{{ include.name }}\n      </a>\n    {% else %}\n      {% if include.name == site.author.name %}<svg class=\"icon\" width=\"20px\" height=\"20px\"><use xlink:href=\"#icon-mistake\"></use></svg> {% endif %}{{ include.name }}\n    {% endunless %}\n  </h3>\n  <div class=\"comment__timestamp\">\n    {% if include.date %}\n      {% if include.index %}<a href=\"#comment{% if r %}{{ index | prepend: '-' }}{% else %}{{ include.index | prepend: '-' }}{% endif %}\" title=\"Permalink to this comment\">{% endif %}\n      <time datetime=\"{{ include.date | date_to_xmlschema }}\">{{ include.date | date: '%B %d, %Y' }}</time>\n      {% if include.index %}</a>{% endif %}\n    {% endif %}\n  </div>\n  <div class=\"comment__content\">\n    {{ include.message | markdownify }}\n  </div>\n  {% unless include.replying_to != 0 or page.comments_locked == true %}\n    <div class=\"comment__reply\">\n      <a rel=\"nofollow\" class=\"btn\" href=\"#comment-{{ include.index }}\" onclick=\"return addComment.moveForm('comment-{{ include.index }}', '{{ include.index }}', 'respond', '{{ page.slug }}')\">Reply to {{ include.name }}</a>\n    </div>\n  {% endunless %}\n</article>\n\n{% capture i %}{{ include.index }}{% endcapture %}\n{% assign replies = site.data.comments[page.slug] | sort | where_exp: 'comment', 'comment[1].replying_to == i' %}\n{% for reply in replies %}\n  {% assign index       = forloop.index | prepend: '-' | prepend: include.index %}\n  {% assign replying_to = reply[1].replying_to | to_integer %}\n  {% assign avatar      = reply[1].avatar %}\n  {% assign email       = reply[1].email %}\n  {% assign name        = reply[1].name %}\n  {% assign url         = reply[1].url %}\n  {% assign date        = reply[1].date %}\n  {% assign message     = reply[1].message %}\n  {% include comment.html index=index replying_to=replying_to avatar=avatar email=email name=name url=url date=date message=message %}\n{% endfor %}{% endraw %}\n```\n\n### Comment reply HTML and JavaScript\n\nNext up was to add some finishing touches to pull everything together.\n\nFamiliar with the way [**Wordpress**](https://wordpress.org/) handles reply forms I looked to it for inspiration. Digging through the JavaScript in [`wp-includes/js/comment-reply.js`](https://core.svn.wordpress.org/trunk/wp-includes/js/comment-reply.js) I found everything I could possibly need:\n\n- `respond` function to move form into view\n- `cancel` function to destroy a reply form a return it to its original state\n- pass parent's unique identifier to `fields[replying_to]` on form submit\n\nTo start I used an `unless` condition to only show reply links on \"top-level\" comments. I only planned on going one-level deep with replies, so this seemed like a good way of enforcing that.\n\n```html\n{% raw %}{% unless r %}\n  <div class=\"comment__reply\">\n    <a rel=\"nofollow\" class=\"btn\" href=\"#comment-{{ include.index }}\">Reply to {{ include.name }}</a>\n  </div>\n{% endunless %}{% endraw %}\n```\n\n{% figure caption:\"Nested comments one-level deep.\" %}\n![Nested comments](/assets/images/staticman-nested-comments.png)\n{% endfigure %}\n\nTo give the **reply link** life I added the following `onclick` attribute and [JavaScript](https://github.com/mmistakes/made-mistakes-jekyll/blob/49632d19977e341b51c91dad8e71bf6ef88e79c3/src/assets/javascripts/main.js#L84-L181) to it.\n\n```javascript\n{% raw %}onclick=\"return addComment.moveForm('comment-{{ include.index }}', '{{ include.index }}', 'respond', '{{ page.slug }}')\"{% endraw %}\n```\n\nA few minor variable name changes to Wordpress' `comment-reply.js` script was all it took to get everything working with my `form` markup.\n\n{% figure caption:\"Hitting a **reply button** moves the comment form into view and populates `<input type='hidden' id='comment-replying-to' name='fields[replying_to]' value=''>` with the correct *parent* `value`. While tapping **Cancel reply** returns the input to its original state of `null`.\" %}\n![Comment replies in action](/assets/images/comment-reply-animation.gif)\n{% endfigure %}\n\n## Add support for email notifications\n\nCompared to nesting comment replies, email notifications were a breeze to setup.\n\n### Update `staticman.yml` configuration\n\nTo ensure that links in notification emails are safe and only come from trusted domains, set `allowedOrigins` accordingly. \n\n**Example:**\n\n```yaml\nallowedOrigins: [\"mademistakes.com\"]\n```\n\nThe domain(s) allowed here must match those passed from an `options.origin` field we're going to add in the next step. Only domains that match will trigger notifications to send, otherwise the operation will abort.\n\n{% notice %}\n#### ProTip: use your own Mailgun account\n\nThe public instance of Staticman uses a [**Mailgun**](http://www.mailgun.com/) account with a limit of 10,000 emails a month. You are encouraged to create an account and add your own [Mailgun API and domain](https://staticman.net/docs/configuration#notifications.enabled) to `staticman.yml`. Be sure you encrypt both using the following endpoint: `https://api.staticman.net/v2/encrypt/{TEXT TO BE ENCRYPTED}`.\n{% endnotice %}\n\n### Update comment form\n\nTo finish, add the following three fields to the comment `form`. \n\n**Field 1 + 2:** Hidden input fields that pass the `origin`[^origin] set in `staticman.yml` and unique identifier to the entry the user is subscriber to:\n\n```html\n{% raw %}<input type=\"hidden\" name=\"options[origin]\" value=\"{{ page.url | absolute_url }}\">\n<input type=\"hidden\" name=\"options[parent]\" value=\"{{ page.url | absolute_url }}\">{% endraw %}\n```\n\n**Field 3:** A checkbox `input` for subscribing to email notifications.\n\n```html  \n<label for=\"comment-form-reply\">\n  <input type=\"checkbox\" id=\"comment-form-reply\" name=\"options[subscribe]\" value=\"email\">\n  Notify me of new comments by email.\n</label>\n```\n\nNothing fancy here, `name=options[subscribe]` and `value=\"email\"` are added to the field to associate subscription data with email address.\n\n[^origin]: This URL will be included in the notification email sent to subscribers, allowing them to open the page directly.\n\nIf setup correctly a user should receive an email anytime a new comment on the post or page they subscribed to is merged in.\n\n{% figure caption:\"Example of a Staticman **New reply** email notification.\" %}\n![Staticman reply email notification](/assets/images/staticman-email-notification.png)\n{% endfigure %}\n\n---\n\nWell there you have it, a static-based commenting system done up in Jekyll that handles nested comments and reply notifications. Now if I could only shave a minute of my build time to get new comments merged in quicker :frowning:.\n\n*[CSS]: Cascading Style Sheets\n"
  },
  {
    "path": "src/_posts/articles/2017-08-30-using-jekyll-2017.md",
    "content": "---\ntitle: \"How I'm using Jekyll in 2017\"\nexcerpt: \"Lessons learned from building, optimizing, and deploying a huge static site powered by everyone's favorite SSG --- Jekyll.\"\nimage:\n  path: &image /assets/images/using-jekyll-2017-feature.jpg\n  width: 1600\n  height: 639\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [articles]\ntags: [Jekyll, web development, GitHub, open source, tutorial]\ncomments: true\ntoc: true\nlast_modified_at: 2019-02-13T14:42:25-05:00\n---\n\nNot going to lie --- I :heart: [Jekyll](/tag/jekyll/), but huge static sites like mine take forever to build. What used to take seconds now go on for over 30 minutes, as thousands of files are generated and optimized.\n\nInspired by Anne Tomasevich's post, [**Optimizing Jekyll Performance with Gulp**](http://savaslabs.com/2016/10/19/optimizing-jekyll-with-gulp.html) --- I begun digging into my build process to identify performance bottlenecks.\n\nAt the time of writing this post, my site contained roughly:\n\n- 1,028 images generated at different sizes (5,140 in total).\n- 1,052 total documents ([991 posts](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/src/_posts) / [14 pages](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/src/_pages) / 3 sets of collections).\n- [535 comments](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/src/_data/comments) stored as YAML data files.\n\nAnd was built with the following Jekyll plugins: [jekyll-picture-tag][jekyll-picture-tag], [sort_name][sort_name], [jekyll-archives][jekyll-archives], [jekyll-assets][jekyll-assets], [jekyll/tagging][jekyll/tagging], [jekyll-tagging-related_posts][jekyll-tagging-related_posts], [jekyll-sitemap][jekyll-sitemap], [jemoji][jemoji], [jekyll-category-post-navigation][jekyll-category-post-navigation], and [jekyll-typogrify][jekyll-typogrify].\n\nUsing Jekyll's profiler flag `--profile`, I measured how long the following tasks took to complete[^3-trials]. Before each build I ran `jekyll clean` to wipe `_site`, `.asset-cache` and any other temporary files to keep results more consistent. \n\n[^3-trials]: Each task was run 3 times and averaged as the values produced by `jekyll build --profile` varied quite a bit.\n\n| Task description | Windows | Mac |\n| --- | ---: | ---: |\n| Generate responsively sized `page.image.feature` images | 1288.29s | 1429.26s |\n| Minify HTML with `layout: compress` | 39.35s | 11.18s |\n| Read `/images/` and copy to `_site/` | 32.39s | 23.63s |\n| Build tag pages with jekyll-archives | 17.40s | 9.99s |\n| Build tag index page with `sort_tag` filter | 2.62s | 0.59s |\n| List related posts with [jekyll-tagging-related_posts][jekyll-tagging-related_posts], [jekyll/tagging][jekyll/tagging], and `LSI: true` | 38.36s | 17.87s |\n| List related posts with vanilla `related_posts` | 1.65s | 4.90s |\n| Preprocess, concatenate, minify, and cache bust SCSS and JS with [jekyll-assets][jekyll-assets] | 78.75s | 25.03s |\n| Display masthead and overlay menu from `_data` | 9.66s | 7.82s |\n| List post comments from `_data` | 7.10s | 2.22s |\n| Display colophon from `_data` | 0.20s | 0.49s |\n| List post taxonomy metadata | 3.48s | 1.18s |\n| List post breadcrumb links | 2.83s | 1.03s |\n| List featured posts | 0.20s | 0.44s |\n| Build style guide collection | 1.16s | 0.31s |\n| List post social sharing links | 5.09s | 0.97s |\n\n{% notice %}\n#### Is Jekyll faster on macOS or Windows?\n\nFor giggles I also tested my Windows and Mac development environments against each other. While not exactly an apples to apples comparison I thought it would be interesting to note any variations.\n\n| Windows Environment | Mac Environment |\n| --- | --- |\n| Lenovo ThinkStation E30 | iMac 21.5-inch, Late 2013 |\n| Processor 3.30 GHz Intel Xeon E31245 | Processor 2.7 GHz Intel Core i5 |\n| Memory 16 GB | Memory 16 GB 1600 MHz DDR3 |\n| Intel SSDSA2BW160G3L 137GB | 1.12 TB Fusion Drive |\n| Windows 7 Professional Service Pack 1 | OS X El Capitan 10.11.6 |\n| ruby 2.2.4p230 [x64-mingw32] | ruby 2.1.0p0 (2013-12-25 revision 44422) [x86_64-darwin12.0] |\n{% endnotice %}\n\n## Optimization\n\nThe numbers above don't lie. Relying on Jekyll and friends to do jobs more suited for a task runner like [**Gulp**][gulpjs] was slowing the build. Armed with this knowledge I started stripping down Jekyll to one of its core purposes --- *converting Markdown files into HTML*.\n\nDoing this also allowed me to make my site's content more portable and not as reliant on a specific static-site generator. In the off-chance I wanted to swap Jekyll for another SSG like [**Hugo**](https://gohugo.io/) or [**Gatsby**](https://github.com/gatsbyjs/gatsby), I could.\n\n*[SSG]: Static-site generator\n\n### CSS and JavaScript assets\n\n[**Jekyll Assets**][jekyll-assets] is a great plugin that served me well for a long time by: preprocessing, vendor prefixing, concatenating, minifying, and fingerprinting assets. But with a site of my size it was painfully slow to iterate with during front-end development.\n\nMaking a change to a Sass partial would trigger a full site rebuild, which meant waiting a few minutes before it could be previewed in a browser. Jekyll's incremental build feature might have helped here, but I never had much luck getting it to work reliably.\n\nDuring development CSS or JavaScript changes would ideally be pushed instantly to the browser with something like [Browsersync][browsersync]. By replacing [Jekyll Assets][jekyll-assets] with the following Gulp alternatives I was able to do this, and improve build times by 93%:\n\n- [**node-sass**][node-sass] and [**gulp-sass**][gulp-sass]: natively compile SCSS files to CSS.\n- [**gulp-autoprefixer**][gulp-autoprefixer]: vendor prefix CSS.\n- [**gulp-cssnano**][gulp-cssnano]: minify CSS.\n- [**gulp-concat**][gulp-concat]: concatenate JavaScript.\n- [**gulp-uglify**][gulp-uglify]: minify JavaScript with [UglifyJS](https://www.npmjs.com/package/uglifyjs).\n- [**gulp-sourcemaps**][gulp-sourcemaps]: add source maps for CSS and JS.\n- [**gulp-gzip**][gulp-gzip]: gzip CSS and JS.\n- [**gulp-rev**][gulp-rev]: append hash to CSS and JS filenames for cache busting.\n\n*[SCSS]: Sassy CSS\n\n| Task description | Jekyll Assets | Gulp |\n| --- | ---: | ---: |\n| CSS and JavaScript asset pipeline | 25.031s | 1.577s |\n\nHere's a small taste of the [Gulp file](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/gulp/tasks/assets.js) I'm using for the site's styles if you're curious:\n\n```javascript\n// 'gulp styles' -- creates a CSS file from SCSS, adds prefixes and creates a Sourcemap\n// 'gulp styles --prod' -- creates a CSS file from your SCSS, adds prefixes,\n//   minifies, and cache busts it (does not create a Sourcemap)\ngulp.task('styles', () => {\n  return gulp.src([paths.sassFiles + '/main.scss'])\n    .pipe(when(!argv.prod, sourcemaps.init()))\n    // preprocess Sass\n    .pipe(sass({precision: 10}).on('error', sass.logError))\n    .pipe(postcss([\n      // add vendor prefixes\n      autoprefixer({\n        browsers: [\n          'last 2 versions',\n          '> 5%',\n          'IE 9'\n        ]\n      })\n    ]))\n    // minify for production\n    .pipe(when(argv.prod, when('*.css', cssnano({autoprefixer: false}))))\n    .pipe(size({showFiles: true}))\n    // output sourcemap for development\n    .pipe(when(!argv.prod, sourcemaps.write('.')))\n    .pipe(when(argv.prod, gulp.dest(paths.sassFilesTemp)))\n    // hash CSS for production\n    .pipe(when(argv.prod, rev()))\n    .pipe(when(argv.prod, size({showFiles: true})))\n    // output hashed files\n    .pipe(gulp.dest(paths.sassFilesTemp))\n    // generate manifest of hashed CSS files\n    .pipe(rev.manifest('css-manifest.json'))\n    .pipe(gulp.dest(paths.tempDir + paths.sourceDir + paths.dataFolderName))\n    .pipe(when(argv.prod, size({showFiles: true})))\n    .pipe(when(!argv.prod, browserSync.stream()))\n});\n\n// function to properly reload your browser\nfunction reload(done) {\n  browserSync.reload();\n  done();\n}\n\n// 'gulp serve' -- open site in browser and watch for changes\n//   in source files and update them when needed\ngulp.task('serve', (done) => {\n  browserSync.init({\n    // tunnel: true,\n    // open: false,\n    port: 4000, // change port to match default Jekyll\n    ui: {\n      port: 4001\n    },\n    server: [paths.tempFolderName, paths.siteFolderName]\n  });\n  done();\n\n  // watch various files for changes\n  gulp.watch(paths.sassFilesGlob, gulp.series('styles', reload));\n});\n```\n\nWithout going too deep into how these Gulp tasks work, the gist is:\n\n1. A glob of files have \"stuff\" done to them using various plugins.\n2. These files are placed in a temporary folder excluded from Jekyll so they don't trigger a full site rebuild during development.\n3. Production builds move these temporary files and deploys them alongside the HTML files generated by Jekyll.\n\n### Image assets\n\nResizing a thousand or so images to serve them responsively is no joke --- taking over 20 minutes to complete in my site's case. Up until now I was using the [Jekyll Picture Tag][jekyll-picture-tag] plugin to do this work for me... which wasn't ideal.\n\nTo try and see if [Node][nodejs] and [Gulp][gulpjs] could do this faster I came up with a set of Gulp tasks to:\n\n1. Generate thousands of \"feature\" images[^feature-image] at 4 different sizes with [**gulp-responsive**](https://github.com/mahnunchik/gulp-responsive).\n2. Optimize all images using [**gulp-imagemin**](https://github.com/sindresorhus/gulp-imagemin).\n3. Save the optimized images directly to the destination folder --- bypassing Jekyll and a full-site rebuild.\n\n[^feature-image]: I classify \"features\" as large, often full-width images commonly seen in landing pages built with **Bootstrap** and other popular CSS frameworks.\n\nThis helped some, but it wasn't until I [dropped GraphicsMagick](https://github.com/mmistakes/made-mistakes-jekyll/commit/56bbd9bf5429a269047a41e045cc2ef0bf34e62b) for [Sharp](https://github.com/lovell/sharp)[^sharp-gif] did I see a noticeable improvement...\n\n[^sharp-gif]: Sharp is super fast, but only resizes JPEG, PNG, WebP, and TIFF images... no GIF. It's also a pain in the ass to install on Windows due to the [`node-gyp`](https://github.com/nodejs/node-gyp) dependency.\n\n{% notice %}\n#### Sharp really is as fast as they say\n\nI shaved 18 minutes off my build time using this high speed [Node.js](https://nodejs.org/en/) module!\n\n| Task description | Graphics Magick | Sharp |\n| --- | ---: | ---: |\n| Resize and optimize 1,014 source images into 5 target sizes | 1288.29s | 171.00s |\n{% endnotice %}\n\nThe other missing piece was generating the necessary markup for responsive images[^rwd-images]. Because I was no longer using the `{% raw %}{% picture %}{% endraw %}` tag to output a fully formed [`<picture>` element](https://cloudfour.com/thinks/dont-use-picture-most-of-the-time/), I had to roll my own responsive image markup. \n\n[^rwd-images]: In the last couple of years several \"cloud\" solutions have emerged to make serving responsively sized images easier. [**Cloudinary**](http://cloudinary.com/) (free plan), [**imgix**](https://www.imgix.com/) (paid plans), and [**ImageEngine**](https://www.scientiamobile.com/page/imageengine) (free plan) just to name a few.\n\n```liquid\n{% raw %}{% if page.image.feature %}\n  {% assign f = page.image.feature | split: '.' %}\n  <img src=\"{{ f[0] | relative_url }}-320.{{ f[1] }}\"\n       srcset=\"{{ f[0] | relative_url }}-768.{{ f[1] }} 768w,\n               {{ f[0] | relative_url }}-1024.{{ f[1] }} 1024w,\n               {{ f[0] | relative_url }}.{{ f[1] }} 1920w\"\n       alt=\"{{ page.title }}\">\n{% endif %}{% endraw %}\n```\n\nThis bit of Liquid takes the filename as defined by `page.image.feature`, splits it at the extension, appends suffixes that match those used in the gulp-responsive task, and adds them to the `srcset` attribute. :boom: resolution switching images!\n\n{% notice %}\n#### Liquid Limitations\n\nThis Gulp + Liquid hybrid isn't as nice as a plugin since there is no logic to actually verify if `-lq`, `-320`, `-768`, or `-1024` versions of the images exist. I'm willing to overlook that since it did shave 16 minutes off my build time :wink:.\n{% endnotice %}\n\n### Simplify layouts\n\nWith the bulk of the time savings coming from faster image resizing tasks, I went after some low-hanging fruit next by [decluttering my layouts](https://github.com/mmistakes/made-mistakes-jekyll/issues/81). Anything that detracted from the main content or added visual noise to the page was fair game for removal.\n\n#### Remove social sharing module\n\nIncluding buttons at the bottom (or top of post) didn't really boost shares of my content on Twitter or Facebook --- so I dropped them. If someone really wants to share it on social media they'll use the builtin methods of iOS/Android or do it the old fashioned way of copy-pasting a URL.\n\n#### Replace `layout: compress`\n\nOccasionally things on the site would break if inline JavaScript with `//` styled comments were used. This happened because of a complex set of Liquid filters used in my [`compress` layout][compress-layout] to reduce whitespace in the generated HTML.\n\nThe fix was easy, just surround inline JavaScript comments with `/* */` instead. Or do what I did, stop using `layout: compress` and minify with these Gulp plugins instead: [**gulp-htmlmin**][gulp-htmlmin] and [**gulp-gzip**][gulp-gzip].\n\n```javascript\n// 'gulp html' -- does nothing\n// 'gulp html --prod' -- minifies and gzips HTML files for production\ngulp.task('html', () => {\n  return gulp.src(paths.siteFolderName + paths.htmlPattern)\n    .pipe(when(argv.prod, htmlmin({\n      removeComments: true,\n      collapseWhitespace: true,\n      collapseBooleanAttributes: false,\n      removeAttributeQuotes: false,\n      removeRedundantAttributes: false,\n      minifyJS: true,\n      minifyCSS: true\n    })))\n    .pipe(when(argv.prod, size({title: 'optimized HTML'})))\n    .pipe(when(argv.prod, gulp.dest(paths.siteFolderName)))\n    .pipe(when(argv.prod, gzip({append: true})))\n    .pipe(when(argv.prod, size({\n      title: 'gzipped HTML',\n      gzip: true\n    })))\n    .pipe(when(argv.prod, gulp.dest(paths.siteFolderName)))\n});\n```\n\n{% notice %}\n#### Minifying HTML with Gulp\n\nIn my tests, replacing [`_layouts/compress.html`](http://jch.penibelst.de/) with Gulp tasks to minify and gzip every HTML file ended up being slightly slower.\n\n| Task description | compress layout | gulp-html and gulp-gzip |\n| --- | | ---: | ---: | ---: |\n| Minify HTML files | 39.348s | 47.00s |\n\nI'm willing to live with the extra 8 seconds of build time as it helps avoid potential site breakages due to badly minified scripts...\n{% endnotice %}\n\n#### Reduce and replace JavaScript\n\nI'm close to ditching jQuery and going vanilla, but I'm not quite there yet. Where possible I've ditched jQuery plugins and [replaced with \"lighter\" alternatives](https://github.com/mmistakes/made-mistakes-jekyll/issues/84). Here's a few highlights:\n\n- Replaced [**Magnific Popup**](https://github.com/dimsemenov/Magnific-Popup) with [**Lity**](http://sorgalla.com/lity/).\n- Replaced [**Lazyload**](https://github.com/verlok/lazyload) with [**Lazysizes**](https://github.com/aFarkas/lazysizes) + [Lazysizes responsive images polyfill extension](https://github.com/aFarkas/lazysizes/tree/gh-pages/plugins/respimg).\n- Added [**SVG 4 Everybody**](https://github.com/jonathantneal/svg4everybody) for external SVG spritemap support.\n- Replaced [**FitVids.JS**](http://fitvidsjs.com/) with responsive embed CSS and a custom Jekyll [video embed tag](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_plugins/video_embed.rb).\n\n### Results\n\nDecoupling the asset pipeline from Jekyll and Gulp-ifying it made the biggest splash in terms of build time. Along with [Browsersync][browsersync], any asset (CSS, JavaScript, images and icons) updates could be previewed almost instantly. Greatly speeding up the time it takes to develop and iterate the site's front-end.\n\n{% notice %}\n#### Made Mistakes Gulp files\n\nThis set of Gulp tasks were heavily inspired by those in Sondre Nilsen's [**Jekyllized Yeoman generator**](https://github.com/sondr3/generator-jekyllized). The main [`gulpfile.js`](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/gulpfile.js) is broken down into [smaller bits](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/gulp/tasks): assets, build, clean, copy, html, images, and uploading.\n\nWith [`paths.js`](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/gulp/paths.js) assigning all of the various paths used throughout the files to DRY things up.\n{% endnotice %}\n\n*[DRY]: Don't Repeat Yourself is a principle of software development, aimed at reducing repetition of information of all kinds, especially useful in multi-tier architectures.\n\n## Automation & Continuous Integration\n\nAfter ditching Disqus last year to [roll my own static-based solution]({% post_url /articles/2016-08-21-jekyll-static-comments %}) powered by [**Staticman**](https://staticman.net/), I needed to find a better way of deploying the site. Merging in new comments, pulling those commits down, manually building the site locally, and then deploying to my web server wasn't ideal.\n\nWith some research I determined a continuous integration[^ci] platform like **Travis CI**[^ci-platforms] that integrates with GitHub was what I needed.\n\n![Travis CI interface screenshot](/assets/images/mm-travis-ci-screenshot.png)\n{: .browser-frame}\n\n[^ci]: Continuous integration is a DevOps software development practice where developers regularly merge their code changes into a central repository, after which automated builds and tests are run.\n\n[^ci-platforms]: There are several CI platforms and services out there that can automate testing, building, and deploying a JAMstack site. [Netlify](https://www.netlify.com/), [Circle CI](https://circleci.com/), [Codeship](https://www.codeship.io/), [Travis CI][travis-ci], and [GitLab CI](https://about.gitlab.com/features/gitlab-ci-cd/) to name a few.\n\nSetting things up with Travis CI wasn't too painful, but there was some trial and error getting dependencies squared away. I'd suggest reading through [their documentation](https://docs.travis-ci.com/), but the basic idea is:\n\n1. [Sign in to Travis CI](https://travis-ci.org/auth) with your GitHub account and grant it access.\n2. Configure the build and deployment scripts with a [`.travis.yml`](https://github.com/mmistakes/made-mistakes-jekyll/blob/aaf88a5223e757eba1e19ee52d0b55dbd0a8328c/.travis.yml) file.\n3. Set the type of triggers[^triggers] that initiate a build.\n\n[^triggers]: Branch updates, pull requests, or both.\n\n### Travis CI configuration\n\nLet's take a closer look my `.travis.yml` config file and how I've set it up.\n\n```yaml\nlanguage: ruby\nrvm:\n  - 2.2\n```\n\nSince Jekyll is built on Ruby I set the language to `ruby`. Depending on what version of Jekyll you're using you can change `rvm` to meet your needs. I went with `2.2` since that's the latest [Travis CI provides](https://docs.travis-ci.com/user/languages/ruby/#Supported-Ruby-Versions-and-RVM).\n\n```yaml\nsudo: false\n```\n\nThis enables quicker build start times using the new [container-based infrastructure](https://docs.travis-ci.com/user/migrating-from-legacy/).\n\n```yaml\nbranches:\n  only:\n    - master\n```\n\nFairly obvious, build only from the `master` branch.\n\n```yaml\ncache:\n  bundler: true\n  yarn: true\n  directories:\n    - node_modules # NPM packages\n```\n\nTravis CI pulls down and installs gem and Node.js modules before every build. Depending on what you have in your `Gemfile` and `package.json` files this can take a bit of time. \n\nThe above lines enable caching of these dependencies eliminating this installation step.\n\n```yaml\naddons:\n  apt:\n    sources:\n      - ubuntu-toolchain-r-test\n    packages:\n      - g++-4.8\n\nenv:\n  CXX=g++-4.8\n```\n\nEnables the [GCC, GNU Compiler Collection](https://gcc.gnu.org/) using [APT Addon](https://docs.travis-ci.com/user/installing-dependencies/#Installing-Packages-with-the-APT-Addon) and a newer version of `gcc/g++` to properly install [Sharp](https://github.com/lovell/sharp).\n\n### Travis CI build lifecycle\n\nMy [build lifecycle](https://docs.travis-ci.com/user/customizing-the-build/#The-Build-Lifecycle) breaks down like this: \n\n1. Clone repo and any submodules. \n2. Install `apt addons`.\n3. Install Ruby gems.\n4. Upgrade Node.js and install [Yarn](https://yarnpkg.com/en/) + Node modules.\n5. Run Gulp production build task `gulp build --prod`.\n6. [Decrypt private SSH keys](https://oncletom.io/2016/travis-ssh-deploy/) needed to rsync files to my server.\n7. Run Gulp deploy task:\n   ```yaml\n   deploy:\n     provider: script\n     skip_cleanup: true\n     script: gulp deploy\n     on:\n       branch: master\n   ```\n\nWith everything configured I no longer need to build locally and deploy. I can merge in comments or make small edits to Markdown files directly on GitHub, and automatically trigger a site build/deploy.\n\nIf there's a problem Travis CI will notify me, otherwise in ~15 minutes (or however long the build takes) any changes committed will be live on the site.\n\n{% notice %}\n#### ProTip: use Travis CI with sites hosted with GitHub Pages\n\nTravis CI comes in handy if you want to use Jekyll plugins or a more advanced Gulp workflow like I am. There are [deployment scripts](https://docs.travis-ci.com/user/deployment/pages/) specifically for this purpose. \n\n[Netlify](https://www.netlify.com/), [GitLab](https://pages.gitlab.io/), and friends also do similar things if you're feeling constrained by what's currently allowed by GitHub Pages.\n{% endnotice %}\n\n## Other Jekyll related bits\n\n### Pagination upgrades\n\nLooking to wring a little more #WebPerf juice out of my site, I went after category and tag archive pages next. Depending on the tag, these `index.html` pages could be quite hefty due to the amount of HTML needed to display hundreds of post teasers.\n\nTo trim them down in size I needed a way of paginating these pages into small chunks. Jekyll has an [official pagination plugin](http://jekyllrb.com/docs/pagination/), but unfortunately it's limited (and deprecated) in what it can actually paginate. [**Jekyll Paginate v2**][jekyll-paginate-v2] on the other hand is fully featured, backwards compatible, and actively being worked on.\n\nIn addition to paginating posts it can handle: [collections](https://github.com/sverrirs/jekyll-paginate-v2/blob/master/README-GENERATOR.md#paginating-collections), [categories](https://github.com/sverrirs/jekyll-paginate-v2/blob/master/README-GENERATOR.md#filtering-categories), [tags](https://github.com/sverrirs/jekyll-paginate-v2/blob/master/README-GENERATOR.md#filtering-tags), and [locales](https://github.com/sverrirs/jekyll-paginate-v2/blob/master/README-GENERATOR.md#filtering-locales) (useful if you have a multi-language site).\n\nIt doesn't stop there though! It has a built-in generator called [**Auto-Pages**][auto-pages] to create tag, category, and collection archives. Which unlike [**Jekyll Archives**][jekyll-archives], can all be paginated.\n\nWith a few changes to my `_config.yml` file and adapting my Jekyll Archive [layout](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_layouts/autopage_tags.html) to work with [Jekyll Paginate v2][jekyll-paginate-v2], I was ready to roll.\n\n```yaml\n# Plugin: Pagination (jekyll-paginate-v2)\npagination:\n  enabled      : true\n  debug        : false\n  per_page     : 15\n  permalink    : \"/page/:num/\"\n  title        : \":title - Page :num of :max\"\n  limit        : 0\n  sort_field   : \"date\"\n  sort_reverse : true\n\n# Plugin: Auto Pages (jekyll-paginate-v2)\nautopages:\n  enabled      : true\n  categories:\n    enabled    : false\n  collections:\n    enabled    : false\n  tags:\n    enabled    : true\n    layouts:\n      - \"autopage_tags.html\"\n    title      : \":tag\" # :tag is replaced by the tag name\n    permalink  : \"/tag/:tag\"\n```\n\nFor category archives I created my own bespoke pages since there are only a handful of them. Mostly because it was easier to customize them than generating with [Auto-Pages][auto-pages].\n\n**Step 1:** Create an archive page... let's use my [Articles archive](/articles/) as an example. I like to keep all of my source pages grouped together, so I created `articles.md` and placed it in a [folder named `_pages`]({% post_url /articles/2016-02-17-using-jekyll-2016 %}#pages-for-everything-else).\n\n**Step 2:** Enable pagination and define what categories it should filter, in this case `articles` by adding the following YAML Front Matter to `articles.md`.\n\n```yaml\npagination: \n  enabled: true\n  category: articles\n```\n\n{% notice %}\n#### ProTip: [filter multiple categories](https://github.com/sverrirs/jekyll-paginate-v2/blob/master/README-GENERATOR.md#filtering-categories)\n\nWant to combine several categories into one paginator object? Jekyll Paginate v2 has you covered. Just add additional categories as a comma separated list e.g. `category: foo, bar`.\n{% endnotice %}\n\n**Step 3:** Output the posts by looping through the `paginator.posts` array. A simple example would look something like this:\n\n```liquid\n<ul>\n  {% raw %}{% for post in paginator.posts %}\n    <!-- what you want to output. title, url, image, etc. -->\n    <li><a href=\"{{ post.url }}\">{{ post.title }}</a></li>\n  {% endfor %}{% endraw %}\n</ul>\n```\n\nAnd for \"next/previous\" navigation links you can do something like this:\n\n```liquid\n{% raw %}{% if paginator.total_pages > 1 %}\n  {% if paginator.previous_page %}\n    <a href=\"{{ paginator.previous_page_path }}\">Newer Posts</a>\n  {% endif %}\n  {% if paginator.next_page %}\n    <a href=\"{{ paginator.next_page_path }}\">Older Posts</a>\n  {% endif %}\n{% endif %}{% endraw %}\n```\n\n### Lazyload tag\n\nAnother #WebPerf improvement was adding the ability to defer loading of images and video embeds.\n\nTo do this I created a custom Jekyll plugin using [**lazysizes**](https://github.com/aFarkas/lazysizes) to do some JavaScript magic.\n\n| Attribute  | Required     | Description |\n| ----       | --------     | ----------- |\n| `data-src` | **Required** | Full path to image eg: `/assets/images/filename.jpg`. Use absolute URLS for those hosted externally. |\n| `src`      | Optional     | Full path to low-quality image eg: `/assets/images/filename.jpg`. Use absolute URLS for those hosted externally. Defaults to inline transparent `.gif`. |\n| `alt`      | Optional     | Image alternate text. |\n\n**Example:**\n\n```liquid\n{% raw %}{% lazyload data-src=\"/assets/images/my-image.jpg\" src=\"/assets/images/my-image-low-quality.jpg\" alt=\"my lazyloaded image\" %}{% endraw %}\n```\n\nA Liquid version of this method is used in the [hero image include](https://github.com/mmistakes/made-mistakes-jekyll/blob/11.0.0/src/_includes/page__hero.html) to apply a nice blur effect as those large images are loaded by the browser.\n\n### Responsive video embed tag\n\nCustom Jekyll plugin to embed a video from YouTube or Vimeo that responsively sizes to fit the width of its parent using [`/_plugins/video_embed.rb`](https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_plugins/video_embed.rb).\n\nEmbeds are also [lazyloaded](#lazyload-tag) to improve page performance.\n\n#### YouTube embed\n\nTo embed the following YouTube video at url `https://www.youtube.com/watch?v=fFX1CUO472U` (long version) or `https://youtu.be/fFX1CUO472U` (short version) into a post or page's main content you'd use: \n\n```liquid\n{% raw %}{% youtube fFX1CUO472U %}{% endraw %}\n```\n\n#### Vimeo embed\n\nTo embed the following Vimeo video at url `https://vimeo.com/97649261` into a post or page's main content you'd use: \n\n```liquid\n{% raw %}{% vimeo 34948855 %}{% endraw %}\n```\n\n### Simplified breadcrumbs\n\nPreviously I was using some Liquid voodoo to [build a trail of breadcrumbs](https://github.com/mmistakes/made-mistakes-jekyll/blob/10.3.0/src/_includes/breadcrumbs.html). This sort of worked because my site structure isn't too complex. On the other hand it wasn't flexible and didn't allow for overriding crumbs with more descriptive labels.\n\nSince my content hierarchy is shallow I decided to manually assign breadcrumbs to each post with YAML Front Matter.\n\n```yaml\nbreadcrumbs:\n  - label: \"Blog Articles\"\n    url: /articles/\n```\n\nThen using this Liquid and HTML it's outputted in my layout:\n\n```liquid\n{% raw %}{% if page.breadcrumbs %}\n  {% assign crumb = page.breadcrumbs[0] %}\n  <a href=\"{{ crumb.url }}\"><strong>{{ crumb.label }}</strong></a>\n{% endif %}{% endraw %}\n``` \n\nFor multiple levels of breadcrumbs the following YAML and sample `for` loop should get the job started.\n\n```yaml\nbreadcrumbs:\n  - label: \"Level 1\"\n    url: /level-1/\n  - label: \"Level 2\"\n    url: /level-2/\n```\n\n```liquid\n{% raw %}{% if page.breadcrumbs %}\n  <ul class=\"breadcrumbs\">\n    {% for crumb in page.breadcrumbs %}\n      <li><a href=\"{{ crumb.url }}\">{{ crumb.label }}</a></li>\n    {% endfor %}\n  </ul>\n{% endif %}{% endraw %}\n```\n\n{% notice %}\n#### ProTip: add breadcrumbs using [front matter defaults](http://jekyllrb.com/docs/configuration/#front-matter-defaults)\n\nTake a DRY approach and [add breadcrumbs](https://github.com/mmistakes/made-mistakes-jekyll/blob/11.0.0/_config.yml#L126-L128) at the category level instead of on every post/page. `defaults:` in `_config.yml` is your friend.\n{% endnotice %}\n\n### Popular tags\n\nLooking over my site's analytics I came to the conclusion no one was clicking on the \"this post was tagged\" links, so I removed them. To make category pages more sticky and useful including tags seemed more useful. So with the following Liquid I was able to build a list of the most popular tags filtered on the current category.\n\n```liquid\n{% raw %}{% assign filterCategory = page.pagination.category | default: page.category %}\n\n<ul>\n  {% assign tagLimiter = 0 %}\n  {% for tag in site.tags %}\n    {% comment %}create an empty array{% endcomment %}\n    {% assign postsInCategory = \"\" | split: \"/\" %}\n\n    {% comment %}loop over site.tags{% endcomment %}\n    {% for post in tag[1] %}\n      {% if post.categories contains filterCategory %}\n        {% comment %}if a post is in the filter category add it to postsInCategory array{% endcomment %}\n        {% assign postsInCategory = postsInCategory | push: post %}\n      {% endif %}\n    {% endfor %}\n\n    {% comment %}poor man's tag limit on those that are frequently used{% endcomment %}\n    {% if postsInCategory.size >= 5 and tagLimiter <= 5 %}\n      {% assign tagLimiter = tagLimiter | plus: 1 %}\n      <li><a href=\"/tag/{{ tag[0] | replace:' ','-' | downcase }}/\" >{{ tag[0] }}</a></li>\n    {% endif %}\n  {% endfor %}{% endraw %}\n</ul>\n```\n\nOn my **Mastering Paper** category page about the iPad app [Paper by FiftyThree](http://www.fiftythree.com/), you'll see related links to tags like *Paper by 53*, *iPad*, *drawing*, etc.\n\n![popular topics screenshot](/assets/images/mm-popular-tags-screenshot.png)\n\n---\n\nWell there you have it, the complete tale of how I took something inherently simple and overly complicated it to suit my needs :stuck_out_tongue_winking_eye:. If you have any questions after looking over the source ask away in the comments below.\n\n[jekyll-picture-tag]: https://github.com/robwierzbowski/jekyll-picture-tag\n[sort_name]: https://github.com/mmistakes/made-mistakes-jekyll/blob/master/src/_plugins/sort_name.rb\n[jekyll-archives]: https://github.com/jekyll/jekyll-archives\n[jekyll-assets]: https://github.com/jekyll/jekyll-assets\n[jekyll/tagging]: https://github.com/pattex/jekyll-tagging\n[jekyll-tagging-related_posts]: https://github.com/toshimaru/jekyll-tagging-related_posts\n[jekyll-sitemap]: https://github.com/jekyll/jekyll-sitemap\n[jekyll-paginate-v2]: https://github.com/sverrirs/jekyll-paginate-v2\n[jekyll-category-post-navigation]: http://ajclarkson.co.uk/blog/jekyll-category-post-navigation/\n[auto-pages]: https://github.com/sverrirs/jekyll-paginate-v2/blob/master/README-AUTOPAGES.md\n[jemoji]: https://github.com/jekyll/jemoji\n[jekyll-typogrify]: https://github.com/myles/jekyll-typogrify\n[nodejs]: https://nodejs.org/en/\n[gulpjs]: http://gulpjs.com/\n[browsersync]: https://www.browsersync.io/\n[node-sass]: https://github.com/sass/node-sass\n[gulp-sass]: https://github.com/dlmanning/gulp-sass\n[gulp-cssnano]: https://github.com/ben-eb/gulp-cssnano\n[gulp-autoprefixer]: https://github.com/sindresorhus/gulp-autoprefixer\n[gulp-concat]: https://github.com/contra/gulp-concat\n[gulp-sourcemaps]: https://github.com/gulp-sourcemaps/gulp-sourcemaps\n[gulp-uglify]: https://github.com/terinjokes/gulp-uglify\n[gulp-gzip]: https://github.com/jstuckey/gulp-gzip\n[gulp-rev]: https://github.com/sindresorhus/gulp-rev\n[gulp-htmlmin]: https://github.com/jonschlinkert/gulp-htmlmin\n[travis-ci]: https://travis-ci.org/\n[compress-layout]: http://jch.penibelst.de/\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-02-13-short-guide.md",
    "content": "---\ntitle: \"Short guide to drawing with Paper for iOS\"\nexcerpt: \"My simple Paper techniques for drawing faceless portraits and landscapes on an iPad.\"\nlast_modified_at: 2018-11-06T11:46:47-05:00\nimage: \n  path: &image /assets/images/madewithpaper-guide-feature.jpg\n  width: 1280\n  height: 528\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\ncomments_locked: true\n---\n\nHow do you draw or sketch on an iPad with **Paper on iOS**? What iPad stylus is the best for creating art? Why does it burn down there when I pee? Wait a minute... I don't have an answer for that last one, but I think I can help with the first two.\n\n{% notice %}\n#### Mastering Paper tutorials\n\nSince publishing this short guide I've gone through several iPad styli and written numerous tutorials expanding on the techniques teased here. Be sure to check out my [**Mastering Paper series**](/mastering-paper/) to learn the latest ways I'm using the app and tools to create realistic portraits and other pieces of art. \n{% endnotice %}\n\n## Tools\n\n-\tObviously you'll need an iPad --- I use a 3rd generation with the nice retina screen.\n- [Paper](http://www.fiftythree.com/paper/) for iOS is my sketching app of choice. It's a free download, but you'll want to buy the additional brushes, pens, and Color Mixer --- my favorites are the pencil and watercolor brush.\n- A stylus is optional, but highly recommended. I use [FiftyThree's Pencil][pencil-stylus] and in the past a [Pogo Connect Smart Pen][1], [LunaTik Alloy Touch Pen][2], and [Just Mobile's AluPen][3]. If you can't afford a decent stylus right now Amazon has [dirt cheap styli for a few dollars][4] that offer more precision than finger painting but not much else.\n\n[pencil-stylus]: {% post_url /mastering-paper/2014-11-28-pencil-53-review %}\n[1]: {% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}\n[2]: http://www.amazon.com/gp/product/B00821TR7G/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=B00821TR7G\n[3]: http://www.amazon.com/gp/product/B0042U9AT6/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=B0042U9AT6\n[4]: http://www.amazon.com/gp/product/B00575TN42/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00575TN42&linkCode=as2&tag=mademist-20\n\n{% figure caption:\"At first I wasn't a fan of the LunaTik Touch Pen, but it's quickly grown on me and become my non-Bluetooth stylus of choice.\" %}\n[![Image of a LunaTik Touch Pen Alloy on top of an iPad](/assets/images/lunatik-touch-pen.jpg)](http://www.amazon.com/gp/product/B00821TR7G/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=178&creative=390957&creativeASIN=B00821TR7G)\n{% endfigure %}\n\n{% notice %}\n#### Update: stylus switch\n\nI've since moved on from the LunaTik Touch Pen to using FiftyThree's Pencil exclusively.\n{% endnotice %}\n\nEvery drawing is different and I try to keep that in mind before opening Paper for iOS. With that said, the following are some general steps and techniques I utilize when drawing and painting on a 3rd generation iPad with retina screen. One thing to remember is experimenting with all the tools and drawing everyday will really up your game. I've learned so much doing just that for the last couple of months.\n\n## Block out your composition\n\nWhen I begin a new [PaperFaces portrait](/paperfaces/), I start by sketching an imperfect square with the pen tool. I use the square as a rough guide for the composition because I like the look of shapes and lines bleeding outside the border. An alternative would be to use the eraser to straighten up the edges, if you like things neat and tidy. You could of course forgo the square and fill the entire page --- whatever works for you.\n\nUsually I pencil in quick gestural outlines as a guide for painting forms later. Other times I jump right to the background and splash in layer upon layer of watercolor. It really depends on the source material and if the background has enough detail to bother with.\n\n{% figure caption:\"Face study using watercolor and some default colors.\" %}\n![Screenshot of an in progress Paper for iOS drawing](/assets/images/girl-madewithpaper-in-progress.jpg)\n{% endfigure %}\n\n## Watercolor without water\n\nIf you ask me, this tool is what sets Paper for iOS apart from all the other iPad drawing apps like *Procreate* and *Sketchbook Pro*. I use the watercolor brush in two ways... well maybe three.\n\nWhen crisp edges aren't a concern, I'll block in color quickly with the watercolor brush. I achieve continuous tones by painting slowly and never removing the stylus (or my finger) from the screen. If I want to create a smooth gradation in color I move the brush progressively faster to fade it out.\n\n### Highlights and shadows\n\nBrightening existing areas is easily achieved with the watercolor brush. Mix enough white into a color and the brush can be used to lighten. This technique is perfect for adding highlights or correcting mistakes when an eraser's edges might be too harsh. When working with white my general rule of thumb is to move fast. If you stick around in one location too long it'll lighten too fast. The same is true when using full black...\n\nTo shade existing areas apply a darker hue, gray, or black. For backgrounds I tend to use a light blue-gray to paint in shadows. I prefer to start light and layer on multiple strokes to add depth and contrast gradually. When working on a subjects' face, I'll use a dull brown to add dimension and shape. Applying a coat of gray or brown works wonders on hair as well.\n\n## Filling shapes with ink\n\nI don't use the fountain pen  or marker tools all that much because I like my illustrations to have a more painterly feel to them. However, these tools are perfect for covering  large irregular shaped areas with a base color --- like hair. They also come in handy when I need to rework or make adjustments (more precise than the eraser) to something I already drew or painted.\n\n{% figure caption:\"Filling in shapes using the fountain pen gets the job done quickly.\" %}\n![Screenshot of a PaperFaces drawing](/assets/images/madewithpaper-filling-shapes.jpg)\n{% endfigure %}\n\nTwo things to keep in mind when working with the marker tool:\n\n1.\t**It has some translucency to it.** If you draw over something, it will most likely show through. Because of this, the marker can  help you shade more precisely than the  brush since the tip is narrower.\n2.\tBlack, white, and some **dark colors are opaque**; meaning they will completely cover up anything you draw over.\n\n## The multipurpose Pencil\n\nI saved the best for last. When I first started using Paper for iOS, I was enamored with the thick and thins of the fountain pen and how true to life the watercolor brush handled. But then I rediscovered an old friend, in a digital world --- Mr. Pencil.\n\nNeed to lightly sketch out a face... pull out the pencil. Need to smoothen out some edges... pull out the pencil. Need to add shadows and highlights... pull out the pencil. It has so many uses, that by default I spend most of my time with it. My absolute favorite is to use a white on top of a black (or dark background) and sketch in highlights, especially in long hair. It's sick how easy achieving realistic looking hair is when using the pencil.\n\n{% notice %}\n#### How to draw hair\n\nRead in detail [how I draw hair]({% post_url /mastering-paper/2013-05-10-drawing-hair %}) as part of my Mastering Paper by FiftyThree series of tutorials.\n{% endnotice %}\n\n{% figure caption:\"Paper for iOS's pencil tool works wonders for rendering hair.\" %}\n![Detail shot of hair drawn using Paper for iOS](/assets/images/madewithpaper-hair-detail.jpg)\n{% endfigure %}\n\n## Closing thoughts and questions\n\nI hope some of this has been helpful. To better describe and show my process, I've recorded numerous speed paintings done with an iPad 3, Paper by FiftyThree, the Mac OS X application [Reflector](http://reflectorapp.com/), and edited with Adobe AfterEffects. \n\nI've taken the liberty of embedding a video playlist below, demonstrating how I use Paper by FiftyThree to paint portraits. *(ProTip: watch it fullscreen)*. Feel free to comment, like, or [subscribe to my channel](https://www.youtube.com/user/anotherjpeg \"Subscribe to Michael Rose's YouTube Channel\") if you like what you see.\n\nIf I missed anything or you're looking for additional pointers leave a comment below or [tweet me](https://twitter.com/mmistakes).\n\n{% figure caption:\"View more of my Paper for iOS video tutorials on [YouTube](https://www.youtube.com/user/anotherjpeg) or [learn how I use Paper](/mastering-paper/).\" %}\n{% youtube videoseries?list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao&amp; %}\n{% endfigure %}\n\n{% include_cached affiliate-disclosure.html %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-05-10-drawing-hair.md",
    "content": "---\ntitle: \"How to draw realistic hair with Paper for iOS\"\nexcerpt: \"I'm often asked what my Paper techniques for drawing hair is. Learn what they are in this short tutorial.\"\nlast_modified_at: 2018-11-06T11:48:32-05:00\nimage: \n  path: &image /assets/images/how-to-draw-hair-feature.jpg\n  width: 1280\n  height: 373\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\n## Block out the hair\n\nI like to rough out a general shape of the subject's hair using watercolor loaded with black or dark brown. Depending on what the overall palette is I might adjust the brown --- usually mixing in red to warm it up or blue to cool it down.\n\nWhen working with the watercolor brush remember to **layer** numerous strokes to get a rich dark base. Just painting one coat of black won't give great results needed for the next step.\n\n[![Drawing hair with Paper for iOS cheatsheet](/assets/images/drawing-hair-paper-53-cheatsheet-600.jpg)](/assets/images/drawing-hair-paper-53-cheatsheet-lg.jpg)\n\n## Draw each strand\n\nThe key here is observation --- look at how each strand(or section) of hair moves, where they start, and where they end. Using the pencil draw each strand of hair from root to tip, following the same paths you observed. For these initial strokes use mid tones to shape the major hair sections and parts. Then gradually brighten the color as you draw in hair with highlights. Adding small strokes of white and light yellow can really bring life to the hair, just be careful not to over do it.\n\nFor those new to the app I suggest drawing in grays --- limiting your palette to get a feel for the tools and how they behave. Working with a limitless selection of color could complicate and distract you from learning the tools. Thankfully FiftyThree's excellent color mixer *just works* when you're ready to exploit it.\n\n{% figure caption:\"The browns in this default palette are good to start with before mixing your own.\" %}\n![Default palette](/assets/images/paper-default-hair-palette-600.jpg)\n{% endfigure %}\n\nOn the subject of palettes... I stick with the default sets. Since I draw a ton of portraits, it's much quicker for me to adjust a color on the fly. But I do see the benefit of setting up a predetermined palette beforehand to give your illustration a feeling of cohesion. Before the color mixer existed you had to get inventive if you wanted additional colors. A limitation that encouraged experimentation and sometimes unexpected results.\n\n{% figure caption:\"Some of my favorite color presets for drawing hair.\" class:\"gallery-3-col\" %}\n[![Paper 53 color for red hair base](/assets/images/paper-53-color-redheads-200.jpg)](/assets/images/paper-53-color-redheads-lg.jpg)\n[![Paper 53 color for brunette highlights](/assets/images/paper-53-color-brunettes-highlight-200.jpg)](/assets/images/paper-53-color-brunettes-highlight-lg.jpg)\n[![Paper 53 color watercolor shading](/assets/images/paper-53-color-watercolor-shading-200.jpg)](/assets/images/paper-53-color-watercolor-shading-lg.jpg)\n{% endfigure %}\n\n## Dark strokes add definition\n\nWorking an area too much with the pencil can cause your hair to flatten out. To fix this, draw dark pencil strokes over the problematic areas. If you follow the hair paths, drawing root to tip again --- these dark strokes can help add detail back to the hair. Make your strokes quick and try not to go over the same line twice or else it might darken too much.\n\n## Watercolor for dimension\n\nIf you're a maniac with the pencil and prefer to draw in all the gradations then feel free to omit this step. I'm much too lazy for that and prefer to paint over the strokes to achieve the same effect. A warm light gray works great for brunettes and a light orange or pink for redheads. Experimentation is the key here. If you don't like the result just two finger rewind that noise and try another color. Lighter layers of watercolor that are built up gradually allow for subtler tones than a stroke of black would.\n\n{% notice %}\n#### Mastering Paper tutorials\n\nSince publishing this short guide I've gone through several iPad styli and written numerous tutorials expanding on the techniques described above. Be sure to check out my [**Mastering Paper by FiftyThree series**](/mastering-paper/) to learn the latest ways I'm using the app and tools to create realistic portraits and other pieces of art. \n{% endnotice %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-05-16-drawing-blank-faces.md",
    "content": "---\ntitle: \"Drawing faces without faces with Paper for iOS\"\nexcerpt: \"Short on time? Here's the quick and fun way I draw portraits using Paper for iOS.\"\nlast_modified_at: 2018-11-06T11:48:54-05:00\nimage: \n  path: &image /assets/images/paper-53-draw-face-feature.jpg\n  width: 1280\n  height: 361\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, portrait, Apple]\ntoc: true\n---\n\nI hate cutting the grass because it's a chore, and chores suck. [Drawing a portrait every day]({% post_url /notes/2012-08-31-paperfaces-ipad-portrait-project %}) for the last 10 months could have turned into a royal chore, but I kept it fun by setting a few restraints. These restrictions had a big effect on my style and time investment. Not exactly the most busy dude in the world, but working full time, tinkering with side projects, finding time for [my wife](https://2littlerosebuds.com/ \"2 Little Rosebuds\"), and helping to raise my twin girls doesn't leave much open.\n\n[Download a Drawing PaperFaces Guide](/assets/images/paperfaces-portrait-cheatsheet.jpg){:.btn}\n\n*I can't draw and I'm not an artist* --- that's the real reason most of my [PaperFaces illustrations](/paperfaces/) don't have facial features. Capturing a likeness is tough business yo! Omitting the trickiest part (the face) frees up all kinds of time, which circles back to how I've been able to maintain a daily drawing rhythm. A technically precise illustration that might have taken 8 hours is now squashed down to 30--60 minutes. Half an hour is fun, 10 hours is a chore!\n\nBrevity is at the heart of every one of my portraits. *Can't draw facial features well?* Imply a face with intersecting lines that cross the face instead. *Don't have time to shade and blend skin tones?* Paint a few strategically placed gray blobs instead. *Can't wrap your head around drawing realistic hair?* Drop some black ink and pencil over it with brown for an effect that is sure to wow your mom.\n\nStill confused? Here are the general steps I follow for every portrait I draw. Don't worry if you're just starting out --- almost anything you create with Paper by 53 will look beautiful. Just experiment with the tools and have fun with your journey --- the rest will come naturally.\n\n## Shape the canvas\n\nI decided on a square frame for [my project](/paperfaces/ \"PaperFaces iPad Portrait Project\"), but you might want to experiment with the shape and canvas placement to better suit your needs. I like to draw the frame freehand with black ink to give it character, but you can use pencil if you want to hide it easier.\n\n{% notice %}\n#### ProTip: create a template\n\nDon't want to bother drawing the same frame each time? Then make a template of it that you can copy at will. To do this: draw the frame or whatever else you want on all your pages, pinch the page to zoom out, tap and hold on the (+) until the *duplicate button* appears, then tap that. Now you're free to move this new page around, copy it to another sketchbook, or duplicate it again.\n{% endnotice %}\n\n## Apply a background\n\n{% figure caption:\"Paint from light to dark with watercolors and add detail with a pencil.\" class:\"gallery-2-col\" %}\n[![Drawing a background with Paper 53](/assets/images/paper-53-draw-background-400.jpg)](/assets/images/paper-53-draw-background-lg.jpg)\n[![Detailing the background with Paper 53](/assets/images/paper-53-detail-background-400.jpg)](/assets/images/paper-53-detail-background-lg.jpg)\n{% endfigure %}\n\nTypically, I spend way more time drawing or painting the background. No one is going to notice if a wall or some tree doesn't match the original --- they're way more forgiving than a mouth or nose. Adding detail here instead of the face adds a sense of tension that I quite enjoy.\n\nWhether I'm working on clouds, a landscape, or a face, I follow the same process:\n\n1. Rough blobs of watercolor to define major shapes.\n2. Layer shape after shape after shape with watercolor until dark and opaque.\n3. Add detail with a pencil.\n4. Layer even more watercolor strokes over the pencil.\n5. Finish with the pencil to cleanup edges or apply highlights and shadows.\n\n## Ghost the face\n\nThe background should be nice and heavy now. Using a white pencil, outline the face or blob it out with watercolor instead. On the rare chance the background is really light, use flesh tones (light brown/pink/orange) instead. The marker or fountain pen are appropriate for face lightening, but you can't layer them as much. Watercolor allows you to progressively lighten and soften edges, which helps enhance the realism.\n\n{% figure caption:\"Use white to outline and lighten the figure's shape or face.\" class:\"gallery-3-col\" %}\n[![Outline the figure with Paper 53](/assets/images/paper-53-pencil-outline-figure-400.jpg)](/assets/images/paper-53-pencil-outline-figure-lg.jpg)\n[![Begin lighting the figure with Paper 53](/assets/images/paper-53-lighten-figure-1-400.jpg)](/assets/images/paper-53-lighten-figure-1-lg.jpg)\n[![Continue lighting the figure with Paper 53](/assets/images/paper-53-lighten-figure-2-400.jpg)](/assets/images/paper-53-lighten-figure-2-lg.jpg)\n{% endfigure %}\n\nA white mixed with a hint of orange or yellow works great too. Experiment with the amount of color you mix because if you add too much the opaque nature of white is removed and it won't \"erase\" the background beneath.\n\n## Build up the face\n\nThe trick here is to gradually apply smooth layers of a light color using the watercolor brush. First few layers are to fill the entire face with whatever skin color you're trying to match. For areas that are in shadow, mix in a dull (almost gray) red or blue and then quickly paint half of the face. Shape really matters --- if you don't get it right just two finger rewind and try again. Move fast and avoid lingering in one spot to keep your edges soft and avoid going too dark.\n\n{% figure caption:\"Move quick and deliberate with watercolor.\" class:\"gallery-2-col\" %}\n[![Use light watercolors to build up a face with Paper 53](/assets/images/paper-53-build-face-watercolor-1-400.jpg)](/assets/images/paper-53-build-face-watercolor-1-lg.jpg) [![Use dull colors to shade a face with Paper 53](/assets/images/paper-53-build-face-watercolor-2-400.jpg)](/assets/images/paper-53-build-face-watercolor-2-lg.jpg)\n{% endfigure %}\n\n## Pencil in details\n\nSame deal as the background, select the pencil tool and start refining edges that are deep in shadow (hair line, necks, clothing, etc). This will help tighten things up and fix the less than precise strokes of watercolor you laid down earlier. \n\nNow is a great time to pencil in the hair, mustache, or beard whiskers using black as your base and a bright brown or yellow over the top. For a detailed Paper by 53 hair tutorial, [check this out]({% post_url /mastering-paper/2013-05-10-drawing-hair %}) one time.\n\n{% figure caption:\"Use black and white pencils to shade and highlight.\" class:\"gallery-2-col\" %}\n[![Pencil details with Paper 53](/assets/images/paper-53-pencil-detail-face-1-400.jpg)](/assets/images/paper-53-pencil-detail-face-1-lg.jpg) [![Pencil details with Paper 53](/assets/images/paper-53-pencil-detail-face-2-400.jpg)](/assets/images/paper-53-pencil-detail-face-2-lg.jpg)\n{% endfigure %}\n\n## Imply facial features\n\nTo finish the face take care to observe the direction and tilt of the head. Carefully draw a line from the forehead down to where the lips should be, following the same curve of your subject. You could keep it really straight, but I find following this natural curve helps make it look more three-dimensional. For the horizontal line, make it eye to eye in length. A fun tip for exaggerating what a face might be looking at --- extending the horizontal line off the face and into the background on one side.\n\n{% figure caption:\"Cross your face and then you're done.\" %}\n![Detail of face drawn with Paper by 53](/assets/images/paper-53-face-cross-lg.jpg)\n{% endfigure %}\n\n{% notice %}\n#### Mastering Paper Tutorials\n\nSince publishing this short guide I've gone through several iPad styli and written numerous tutorials expanding on the techniques described above. Be sure to check out my [**Mastering Paper by FiftyThree series**](/mastering-paper/) to learn the latest ways I'm using the app and tools to create realistic portraits and other pieces of art. \n{% endnotice %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-07-08-pogo-connect-smart-pen.md",
    "content": "---\ntitle: \"Pogo Connect stylus makes Paper for iOS better\"\nexcerpt: \"An iPad stylus that brings enhanced functionality to devices and apps that support its SDK.\"\nlast_modified_at: 2018-11-06T11:49:14-05:00\nimage: \n  path: &image /assets/images/pogo-connect-review-feature.jpg\n  width: 1488\n  height: 489\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Pogo Connect, Paper for iOS, Procreate, review, Apple]\ncomments_locked: true\ntoc: true\n---\n\nI've been lusting over the promise of pressure sensitive drawing on an iPad ever since I first read about the [Pogo Connect Smart Pen]( http://www.amazon.com/gp/product/B009K448L4/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B009K448L4&linkCode=as2&tag=mademist-20)[^pogo-compatibility]. Released back in January for around $80, I held off buying one until the price dropped. Waiting turned out to be smart since my favorite iOS app [**Paper by FiftyThree**](/tag/paper-by-53)[^pogo-paper] also received numerous updates to better support the Pogo Connect.\n\n[^pogo-paper]: As of version 2.5 FiftyThree has dropped support for the Pogo Connect Smart Pen.\n\n[^pogo-compatibility]: Since publishing this review, Apple released the iPad Mini and iPad Air --- both have some compatibility issues with a Pogo Connect Smart Pen. There's something about these new screens that cause the Pogo to not function properly. In the case of the iPad Air it doesn't work at all. The iPad Mini has better support but a few of the new tips don't work. For the full story check out [Ten One Design's website](http://www.tenonedesign.com/connect).\n\nFor my birthday [my wife](http://2littlerosebuds.com) picked me up one and I started the process of learning all its nuances. I've gotten fairly adept at using a [LunaTik Alloy Touch Pen]( http://www.amazon.com/gp/product/B00821TR7G/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00821TR7G&linkCode=as2&tag=mademist-20) by drawing with it every day for the last 9 months, but the tip is starting to show signs of tearing --- perfect time to try something new.\n\n## Pogo Connect Smart Pen vs. normal styluses\n\n{% figure caption:\"If you like how rubber nibbed tips feel when drawing you'll be at home with the Pogo Connect.\" %}\n![Stylus rubber tips comparison](/assets/images/stylus-rubber-tips-comparison.jpg)\n{% endfigure %}\n\nSo how does the Pogo Connect's feel compare to other styluses? In your hand it doesn't quite have the same solidness as the LunaTik or an [AluPen]( http://www.amazon.com/gp/product/B0042U9AT6/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B0042U9AT6&linkCode=as2&tag=mademist-20). By no means is it cheap feeling, but it doesn't have the heft as those other two pens. The tip isn't any more accurate than your average rubber nub stylus, so if you're looking for precision look at the [Adonit Jot Touch 4](http://www.amazon.com/gp/product/B00AO1L1RG/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00AO1L1RG&linkCode=as2&tag=mademist-20) line[^adonit-touch] instead.\n\n[^adonit-touch]: At the time of writing this review the Adonit Jot Touch 4 is not supported by Paper. If you were hoping to take advantage of the palm detection and pressure sensitive features you'll need to use a different app --- here's the full list of [Jot ready apps](http://adonit.net/jot-ready-apps/).\n\n## Setting it up is a breeze\n\nThe Pogo Connect comes with a name brand AAA battery to get you up and running right away. I've been drawing with it every day for over a month and I have around 60% of battery life remaining --- not bad at all. To pair with your iPad just fire up Paper by 53 ([or one of the many supported apps]( https://www.tenonedesign.com/connect.php)) and press the button near the tip. After a few seconds it should connect over Bluetooth and you're set to go.\n\n## Pogo Connect Smart Pen options\n\n{% figure caption:\"Pogo Connect dedicated settings in Paper by 53.\" class:\"align-right\" %}\n![Paper by 53 settings palette](/assets/images/paper-53-pogo-connect-settings.jpg)\n{% endfigure %}\n\nPaper by 53 has a dedicated settings panel for the Pogo Connect that you can access from tapping the 53 logo in the upper right corner. Here you can check the stylus' connection status, battery level, firmware, and toggle the pen button undo feature. There is an option labeled \"Button\" with a circle that I have no idea what it does or indicates. If anyone knows feel free to chime in below. \n\n### Procreate niceties\n\nIf you're using Procreate similar options are presented, along with a cool feature that Paper by 53 doesn't possess --- the LED light on the Pogo will match whatever color you select in the picker. Not really a useful feature when drawing and painting, but still kind of cool.\n\n{% figure caption:\"Procreate takes advantage of the LED light and will change hues depending on the current color.\" %}\n![Pogo Connect colored LED light](/assets/images/pogo-connect-led-color.jpg)\n{% endfigure %}\n\n## Is the Pogo Connect better for drawing?\n\nI suppose you want to know if the Pogo Connect lives up to the hype. In my opinion, yes --- yes it does. \n\nThe pencil and watercolor tools in Paper by 53 have always been great at feeling and reacting like the real thing. When used with a Pogo Connect these tools are augmented to a point where you can create thick and thin marks with more precision and ease.\n\nBelow is a sketch made with all of the Paper by 53 tools using just my finger. Each stroke was made by moving my finger slowly at the beginning of each line and progressively getting faster near the end. This has the effect of making strokes thicker or darker depending on the tools used --- something I probably don't have to tell you if you've used Paper for any amount of time.\n\n{% figure caption:\"Finger drawn lines with varying speed (slow to fast).\" %}\n![Lines drawn with my finger](/assets/images/paper-53-hand-drawn-lines.jpg)\n{% endfigure %}\n\nIn this next example I drew strokes with the same five tools, but this time using a Pogo Connect Smart Pen. Instead of varying the speed at which I drew each line, I varied the amount of pressure applied to the tip of the pen. Each stroke was started by barely touching the iPad's screen and applying more pressure until reaching the end.\n\n{% figure caption:\"Pogo Connect drawn lines with varying pressure (soft to hard).\" %}\n![Lines drawn with a Pogo Connect](/assets/images/paper-53-pogo-connect-lines.jpg)\n{% endfigure %}\n\nIf it's not painfully obvious from the sample sketches, the Pogo Connect Smart Pen reacts in the following ways compared to a standard capacitive stylus pen while applying pressure:\n\n* **Pencil:** strokes get darker\n* **Fountain pen:** strokes get wider\n* **Marker:** strokes get wider\n* **Pen:** strokes get slightly wider\n* **Watercolor:** strokes get wider\n \nIn my opinion the two tools that benefit the most from using a Pogo Connect stylus are the watercolor brush and pencil. Both tools become more responsive and natural to use --- especially the pencil when used for shading and sketching. The watercolor brush gets the added benefit of being able to draw thinner strokes than your finger or other styluses can, which is nice since there is no way to control brush size yet.\n\n### On the subject of palm rejection\n\nSeen this one mentioned on a few other reviews and forums so I figured I'd address it quickly. I've never really had a problem with drawing or writing on an iPad and having my palm make random marks. Not sure if I draw in a way that eliminates this, so I don't really have a way to judge if the Pogo fixes this. What I can say is when activated you can't draw with anything except the Pogo, but gestures like pinch to zoom, rewind, and moving pages around all still work.\n\nBut if you rest your palm on the screen while you draw things break down quickly. Because of the way multi-touch gestures work in Paper, the palm rejection feature was likely turned off as not to conflict. If you use an app like Procreate, palm rejection works quite nicely when multi-touch gestures are turned off on your device.\n\n## Is it worth the money?\n\nIf you're a Paper addict and mostly use watercolor and pencil I think the high price of a Pogo Connect is justified. If you're predominantly an inker then it's probably not worth it. I find controlling the fountain pen to be much harder when using a Pogo Connect because it is really sensitive to pressure. This makes drawing smooth lines hard unless you have a steady hand and don't vary the pressure as you draw.\n\nIt's worth noting that there appears to be a major design flaw with the internals of the pen (see below). From constant pressure being applied to a soldered circuit board behind the tip, it eventually breaks and ceases to work properly. I don't know anyone in the Paper community who has escaped this. But since it's the only stylus Paper supports with pressure sensitivity you'll have to decide how important that is to you. Buyer beware…\n\n## What's wrong with the Pogo Connect\n\nAbout those bugs I mentioned earlier. Not sure if they're hardware or software related, but I've experienced a ton of lockups with the Pogo Connect and Paper by 53. The stylus will randomly disconnect or just become unresponsive and I have to force quit the app or remove the AAA battery to make the Pogo Connect behave again. I usually notice it becoming unresponsive when making a bunch of quick strokes, like when I'm [drawing beard whiskers]({% post_url /paperfaces/2013-07-01-josearato-portrait %}). Not a deal breaker because it doesn't happen all the time, but it is kind of annoying that it interrupts the creative flow.\n\n{% figure caption:\"Disconnected! Better get used to this screen...\" %}\n![Pogo Connected disconnected screenshot](/assets/images/pogo-connect-paper-53-disconnected.jpg)\n{% endfigure %}\n\n### Lock screen annoyances\n\nDuring my first week with the Pogo I encountered another issue that I thought might have been a bug with Paper. Out of nowhere the iPad's screen would turn off and the lock \"chhkk\" would sound. After complaining about it on Tumblr a friend messaged me to say that I needed to turn off the iPad cover lock setting. It never occurred to me that there was a magnet in the tip of the Pogo that could trigger a screen lock when moved near the iPad's outer bezel.\n\n{% figure caption:\"Toggling iPad Cover Lock/Unlock to OFF in Settings will stop the Pogo from turning off your screen if you get to close to the edge.\" %}\n![iPad iOS 6 cover lock setting](/assets/images/iPad-cover-lock-setting.jpg)\n{% endfigure %}\n\nEven with these hiccups I'm still a big fan of the Pogo Connect. Gives me hope that companies like [Ten One Design](https://www.tenonedesign.com) will continue to innovate in this space, giving digital creators tools that are even closer to the real thing. Who knows, maybe Apple will rethink that whole \"if you see a stylus they blew it\" line of thinking and do something to help nurture this.\n\n## Update two months later\n\nWell that didn't take long. About a month after writing this review and two months of daily drawing, my Pogo Connect finally gave up the ghost. Out of the blue I was drawing and my strokes stopped registering in Paper. I figured it was just a software hiccup and the stylus temporarily lost connectivity, but no.\n\nRemoved the rubber tip to find this mess. Like many others, the metal contact that is soldered to the internal circuit board broke free rendering the pressure sensitivity useless.\n\n{% figure caption:\"I don't think this metal contact is suppose to break off so easily...\" %}\n![Pogo Connect broken circuit connection and tip](/assets/images/pogo-connect-broken-circuit.jpg)\n{% endfigure %}\n\nI have an email out to Ten One Design to see what can be done. I've heard they respond quickly with free replacements, which could indicate they're aware of a major design flaw and trying to do right by it. I just don't know if I can continue to recommend the product if it's prone to breaking after a few months. I'll let you know things go...\n\n## Update a week later\n\nAnd just like that Ten One Design sent me a replacement pen with 2 extra tips free of charge. Excellent customer service if you ask me! Not sure if it's that new car smell effect, but this pen feels more sturdy and responsive. Hoping that means the build quality has been improved and the tip sensor breaking apart is no longer an issue.\n\n## Update three months later\n\n{% figure caption:\"All the solder in the world probably isn't going to fix this design flaw.\" %}\n![Seems like a major design flaw to me](/assets/images/pogo-connect-broken-circuit-2.jpg)\n{% endfigure %}\n\nFeels like Groundhog Day all over again. Sadly my replacement Pogo didn't fair too well and broke in the exact same way after three months of daily usage. Big shout out to Ten One Design's customer service for setting me up with another replacement gratis. I've been told they beefed up the soldering for a new production run in September. Not sure if that will make much of a difference, but will report back after I get my hands on it.\n\nIf it wasn't for Paper I probably would have dumped the Pogo and moved to the Adonit Jot Touch and Procreate full time. But there's something magical about Paper that keeps pulling me back...\n\n{% notice %}\n#### A new iPad stylus\n\nAfter having a long run with Ten One Design's Pogo Connect stylus I have finally left it behind. After updating to an iPad Air 2 (which has poor support for the original Pogo Connect) and Paper being updated to include **Surface Pressure**, I've begun using [FiftyThree's Pencil stylus]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}) exclusively.\n\nIt doesn't vary strokes in the same way as a Pogo Connect (or other pressure sensitive styli), but it produces the same results and has [a few tricks]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}) up its sleeve.\n{% endnotice %}\n\n{% include_cached affiliate-disclosure.html %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-07-31-introduction-tool-guide.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: introduction and tool guide\"\nexcerpt: \"An introduction to Paper's tools and how to exploit them for drawing realistically.\"\nlast_modified_at: 2017-12-13T11:23:35-05:00\nimage: \n  path: &image /assets/images/paper-53-expanded-guide-feature.jpg\n  width: 1280\n  height: 436\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\nPaper by FiftyThree and me were BFFs from the start. Spread across my journals you'd find around 600 pages with creation times ranging from 30 minutes to 4 hours. A conservative estimate has me logged at around 500 hours of drawing and painting in this iOS app --- which is kind of crazy when I think about it. I'm not sure if that qualifies me as a good teacher or not, but I'm going to try and expand on some tips and techniques I've previously written about in this multi-part series.\n\n![Paper 53 journals screenshot](/assets/images/paper-53-journals.jpg)\n\nIn this first part you'll learn about the benefits of a stylus, how all of the Paper by 53 tools work, and basic gestures you'll want to master. The remaining parts will dig deeper into techniques I use when drawing idealistically, page management, advanced features, and how to record the iPad's screen and make time lapse videos of your creations.\n\n## Is a stylus necessary?\n\nFinger painting with Paper can yield some impressive results, but may feel unnatural if you're used to drawing with pens and pencils. If you decide to go with a capacitive stylus be aware that it won't match the precision of a traditional pen because of the fat and rubbery tip.\n\n{% figure caption:\"Adonit makes some nice styli if drawing precise marks is your thing.\" %}\n![Adonit Jot](/assets/images/adonit-jot-classic-tip.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: use an iPad stylus meant for accuracy\n\nFor those craving precision I'd suggest trying one of the many [**Adonit Jot**](http://www.amazon.com/gp/product/B00931K1QK/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00931K1QK&linkCode=as2&tag=mademist-20) styli. The tips on these bad boys have clear plastic tips that can pivot and tilt allowing you to see exactly where you are on the iPad's screen. The fancier Bluetooth ones aren't supported by Paper, but apps like [Procreate](http://procreate.si) do.\n{% endnotice %}\n\nGoing one step further are styli built with pressure sensitivity in the tip that can alter the characteristics of a mark depending on how hard you press on it. Paper by 53 supports Ten One Design's **Pogo Connect Smart Pen** out of the box, and has quickly become my go to stylus when creating on iPad. To learn more about how it became a favorite, check out my [image filled review]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %} \"My Pogo Connect Smart Pen Review\") here.\n\n![Paper by 53 tools screenshot](/assets/images/paper-53-the-tools.jpg)\n\n## The tools and how they behave\n\nStarting with order of appearance you have the following tools at your disposal: [*eraser*](#eraser), [*fountain pen*](#fountain-pen), [*pencil*](#pencil), [*marker*](#marker), [*ink pen*](#ink-pen), [*watercolor brush*](#watercolor-brush), and [*color mixer*](#color-mixer). The fountain pen and eraser are included with the free app --- the rest can be downloaded via in-app purchase as a set or individually.\n\nWhen describing these tools I will be using the following descriptors:\n\n* **Speed:** How does the speed of drawing affect a line's weight.\n* **Blending:** Are marks opaque[^opaque] or translucent and how many layers are needed to make a pure color[^pure-color].\n* **Sensitivity:** How are marks and line quality affected by the amount of pressure applied when using a Pogo Connect Smart Pen.\n\n### Eraser {#eraser}\n\nThe eraser does what its name implies --- it erases. It is not the most precise tool with such a fat tip, which is why I prefer to undo mistakes with the rewind tool instead ([more on that later](#rewind)).\n\nFor handling cleanup duty, the eraser is very effective at defining edges and making them straight. By simply running it along an edge you can remove jaggies left by a pencil or watercolor stroke.\n\n![Erased edge screenshot](/assets/images/paper-53-erased-edge.jpg)\n\n* **Speed:** Slow = thin. Fast = thick.\n* **Blending:** Completely opaque. One stroke erases down to the egg shell white colored background.\n* **Sensitivity:** Soft = thin. Hard = thick.\n\n{% figure caption:\"The faster the stroke, the larger the eraser.\" %}\n![Eraser line showing thin to thick](/assets/images/paper-53-eraser-thick-thin.jpg)\n{% endfigure %}\n\n### Fountain pen (Draw) {#fountain-pen}\n\nAlong with the eraser, the fountain pen is included for free when you download Paper by FiftyThree from the App Store. This was the tool I originally used the most when experimenting with Paper a year ago. It's hard not to fall in love with the flowing lines it makes when sliding your fingertips across the iPad's glass screen.\n\n{% figure caption:\"The fountain pen is slightly transparent.\" %}\n![Fountain pen shapes to show the tool's opacity](/assets/images/paper-53-fountain-pen-layers.jpg)\n{% endfigure %}\n\nMy drawing style has evolved over the year from crisp line work to soft blended edges and tones. Because of this shift the fountain pen sees less usage and has been demoted to janitorial status like the eraser. Perfect for getting into tight places it also works well when coloring large blocks of color.\n\n![Background fill cover-up screenshot](/assets/images/paper-53-background-fill.jpg)\n\n{% notice %}\n#### ProTip: quick and dirty erasing\n\nThe eraser removes everything --- including a background filled with color. A fountain pen filled with color that matches the background can be used instead of the eraser to correct mistakes. Improvements to the eraser tool have made this technique less needed, but it still [has its uses]({% post_url /mastering-paper/2014-10-25-erasing %}).\n{% endnotice %}\n\n- **Speed:** Slow = thin. Fast = thick.\n- **Blending:** Almost fully opaque. Depending on the color it can take 2--3 layers to create a purely opaque color.\n- **Sensitivity:** Soft = thin. Hard = thick.\n\n### Pencil (Sketch) {#pencil}\n\nVersatile and perfect in almost any situation --- this is the one tool you should invest time in learning. The marks it makes resemble a traditional 2B pencil leaving behind a texture perfect for shading. The pencil also works great for lightly sketching to nail your composition before painting.\n\n{% figure caption:\"A gray pencil is perfect for sketching.\" %}\n![Pencil sketch screenshot](/assets/images/paper-53-pencil-sketch.jpg)\n{% endfigure %}\n\nShading power is amplified immensely when used with a fancy Bluetooth stylus with pressure sensitivity. If you've used a pencil in real life to draw you already know how to use this digital incarnation --- making it one of the most precise and forgivable tools in Paper's toolbox. \n\n* **Speed:** Slow = dark. Fast = light.\n* **Blending:** Semi-transparent --- takes many layers to create a purely opaque color.\n* **Sensitivity:** Soft = light. Hard = dark.\n\n### Marker (Outline) {#marker}\n\nUnlike the fountain pen, the marker makes transparent marks you can see through. To make sense of the marker I pretend it's one of those neon yellow highlighters. If you drew yellow over black it wouldn't show up, the same is true in Paper.\n\n{% figure caption:\"The marker is completely transparent and will not show up well when applied on top of dark colors. Use the fountain pen or pencil instead.\" %}\n![Layers of marker acting like a highlighter screenshot](/assets/images/paper-53-marker-yellow-layers.jpg)\n{% endfigure %}\n\nThe exception to this rule is when the marker is filled with white. In this case it would act almost identically to the eraser but instead of an off-white color it makes a pure white. \n\n{% figure caption:\"If you look closely you can spot the slight difference in color.\" %}\n![Eraser vs. marker lines screenshot](/assets/images/paper-53-eraser-vs-marker.jpg)\n{% endfigure %}\n\nWhen sharp shadows and values are desired in your illustrations, the marker tool is A+++. I tend to work more photo-realistic, but if you want that cartoon or comic book look the marker might be for you.\n\n![Comic book style shading with marker screenshot](/assets/images/paper-53-eraser-sharp-edge.jpg)\n\n* **Speed:** Slow = thick. Fast = thin.\n* **Blending**: Transparent, with the exception of white and black.\n* **Sensitivity**: Soft = thin. Hard = thick.\n\n### Ink pen (Write) {#ink-pen}\n\nLike the name implies the ink pen behaves most closely to a roller-ball pen. If you look closely at the lines it creates you'll notice heavier spots where a stop or start occurs. Even lines can be achieved by moving quickly throughout the entire stroke.\n\n![Ink pen start and end points screenshot](/assets/images/paper-53-ink-pen-lines.jpg)\n\nIf you found the fountain pen's thick/thins undesirable or hard to control the ink pen might be a better choice. The ink pen has less variation in line-width making it a perfect choice for writing or doing detail work. \n\nBefore I began using a Pogo Connect Smart Pen exclusively, I did all my lettering and writing with the fountain pen. I found the pressure sensitivity of that stylus difficult to control when crafting letter forms, so I switched to the ink pen[^pen-lettering] instead. \n\n* **Speed:** The difference is barely noticeable. Moving slower will make a slightly thicker line.\n* **Blending:** Opaque.\n* **Sensitivity:** The difference is barely noticeable. Pressing harder will make a slightly thicker line.\n\n### Watercolor brush (Color) {#watercolor-brush}\n\nLike the pencil, the watercolor brush is another tool you really should spend time experimenting with to learn all its nuances. This tool sets Paper apart from other apps by replicating the natural feel of pushing and pulling paint across a canvas. Without it I wouldn't be able to shade, paint skies, or render hair realistically at all.\n\n{% notice %}\n#### ProTip: manipulate the brush's size\n\nWhile there is no obvious way to change the size of your brush in Paper by FiftyThree, you can make thinner lines when used with a pressure sensitive stylus like the Pogo Connect Smart Pen. Pressing lightly will make a line about a 1/4th as thick as the default one. [FiftyThree's Pencil]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}) stylus also allows you to dynamically change brush size depending on how you hold it.\n{% endnotice %}\n\nIt helps to think of your stylus tip as a brush loaded with watered down paint. Because the paint has been thinned it won't be as intense or saturated as the color from one of the pens. Instead you need to build up color with multiple layers.\n\n{% figure caption:\"To achieve a smooth layer of paint, move slowly to avoid blotches of color.\" %}\n![Choppy painting vs. consistent painting screenshot](/assets/images/paper-53-watercolor-even-fill.jpg)\n{% endfigure %}\n\nThis \"thinned out\" behavior also factors into how even of a coat you can apply. *Moving the brush faster* doesn't let the paint fully cover a spot and will make it appear choppy. While *moving slowly* allows the paint to flow evenly off the brush and build into a dark even value. Mastering the speed at which you apply color is essential to creating even tones and shading.\n\nIt may be helpful to create a few color scales with the primary colors, gray, and black to practice. Below are watercolor tests I created for myself after FiftyThree updated Paper to include the Color Mixer tool.\n\n![Gradations created with the watercolor brush](/assets/images/paper-53-watercolor-layers.jpg)\n\n{% notice %}\n#### ProTip: white to lighten\n\nWhen loaded with white the watercolor brush can become a way to lighten areas you've previously painted or drawn. Just keep in mind that white paint doesn't behave like other colors and can be difficult to master. If you paint too slowly it will remove most of the color and leave you with bright white spots.\n{% endnotice %}\n\n### Color Mixer {#color-mixer}\n\nBefore the Color Mixer existed, you had to get creative if you wanted a color other than the nine Paper shipped with. By mixing these colors directly on canvas you could make other colors. Some colors worked great with this technique while others turned to mud if too many layers were applied.\n\n{% figure caption:\"**First row:** mixing colors directly on canvas. **Second row:** mixing colors with the *Color Mixer*.\" %}\n![Mixing primary colors mixes with watercolor screenshot](/assets/images/paper-53-watercolor-primary-secondary.jpg)\n{% endfigure %}\n\nColor theory is a tricky dick --- thankfully FiftyThree did something great with their Color Mixer. Mixing together any color will almost always make a new one that looks great.\n\nFor those who need more control or want a traditional color picker --- one can be accessed by dragging a color swatch onto the mixing wheel, then tapping on it. From here you can adjust a color's hue, saturation, and brightness (luminosity).\n\n{% figure caption:\"A more traditional way of adjusting color if you need it.\" %}\n![Color picker sliders screenshot](/assets/images/paper-53-color-picker-slider.jpg)\n{% endfigure %}\n\nFor a good shadow color I usually adjust the base color I'm shading with by cranking the saturation down and the brightness way up.\n\n{% notice %}\n#### ProTip: point of no return\n\nIf you go too far in any direction you will approach pure white, which will make the watercolor brush or marker opaque. Each color has a different \"point of no return,\" that can be found by experimenting with the sliders.\n\nSometimes approaching the \"point of no return\" is a good thing --- especially when you need a color for lightening. Instead of using pure white, I like to start with the base color I'm working with and crank the brightness way up to make less dramatic tints when erasing.\n{% endnotice %}\n\n## Gestures to master\n\nIf you only learn two gestures when using Paper, make them Rewind and Zoom.\n\n### Rewind {#rewind}\n\nI'm going to let you in on a little secret. The first couple of months I used Paper by 53, I absolutely hated the Rewind feature because I couldn't use it consistently. It pissed me off so much, that I gave up and used the eraser instead. I would have killed for a button with multiple undos back then...\n\n![Rewind screenshot](/assets/images/paper-53-rewind-stormtrooper.jpg)\n\nI eventually came to my senses and gave it another go by forcing myself to use Rewind exclusively. After a few drawings I mastered it and was time traveling back through my boo boos with ease. It's entirely possible that FiftyThree tweaked Rewind behind the scenes to make it easier to use, but I like to think it was my perseverance that made the difference.\n\nJust stick with it if you're having trouble, I promise it will eventually come naturally. And if it doesn't, you can always purchase a [Pogo Connect Smart Pen]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) and map the button to undo. To correct simple one step mistakes the undo button works great, for anything else I prefer the rewind gesture to avoid pressing the button a million times.\n\n### Zoom\n\nThe single most requested feature by fans and haters of Paper... Zoom. I had drawn a couple hundred portraits just fine without zoom, but boy was I happy when FiftyThree finally added the feature. That said I did cheat a bit by using an accessibility feature in iOS[^ios-zoom] that lets you magnify the screen by tapping with 3 fingers. Not a true zoom, but it does have its place when you need to magnify an area --- the tools don't scale so it isn't that useful.\n\n![Zoom tool screenshot](/assets/images/paper-53-zoom-tool-eye.jpg)\n\nThere isn't much else to Zoom, I'm merely mentioning it to increase awareness around it. Unlike other drawing and painting apps with zoom, the entire canvas doesn't scale. Instead you control the area you want magnified by you opening a circular <s>portal</s> loupe that can be moved around or dismissed by tapping outside of it.\n\n{% notice %}\n#### Full screen zoom and grid indicator\n\nThe loupe shown above has been retired and replaced with a more traditional zoom tool in Paper v3. Pinching the screen now magnifies the entire canvas allowing for more room to work. As you magnify, a grid of dots appear on the screen to indicate how far you've zoomed in.\n{% endnotice %}\n\n---\n\nWell there you have it. I hope this has served as a good introduction to Paper by 53, how to use the  tools, the gestures, and a taste of what is possible with the app.\n\n[^opaque]: Not transparent or translucent; impenetrable to light; not allowing light to pass through.\n[^pure-color]: I define pure as matching the color selected in the mixer. Many of the tools have a hint of translucency to them and need 2--3 layers to match exactly.\n[^pen-lettering]: I suppose I could break the creative flow and switch to a traditional capacitive stylus for just lettering if I wanted to continue using the fountain pen. Nah...\n[^ios-zoom]: The iPad has a system wide zoom feature that allows you to enlarge the screen by 3 finger tapping it. To activate, go to **Settings** > **General**. Tap on **Accessibility** and then turn on **Zoom**.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-08-31-drawing-trees.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: drawing trees and grass\"\nexcerpt: \"Techniques to draw trees, green grass, bushes, and other foliage using the iPad app Paper for iOS.\"\nlast_modified_at: 2018-11-06T11:57:32-05:00\nimage: \n  path: &image /assets/images/paper-53-trees-guide-feature.jpg\n  width: 1280\n  height: 436\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\nSorry for the delay in publishing the next installment of my **Mastering Paper Guide** --- between the twins, my job, and trying to launch [**Relic Scout**](https://relicscout.com/), I've had my hands full this summer. But enough of all the excuses, let's get right into it ok?\n\n## Drawing trees\n\nWhen I draw trees I select the watercolor brush and jump right in, using one continuous stroke to rough out a general shape. Don't worry about being precise here, we'll refine the edges later. You could start with a light pencil sketch to nail your the composition, but I usually don't --- it keeps the tree feeling organic and less rigid (a happy accident is your friend).\n\n![screenshot of watercolor tree shape](/assets/images/paper-53-outline-trees-watercolor.jpg)\n\n{% notice %}\n#### ProTip: build up tones by layering\n\nWhen using the watercolor brush, try and mix a color around 50--75% lighter than the desired color. This lighter color allows you to layer multiple coats to create a nice vivid color. Going dark right away usually makes shapes flat and lifeless, with color that lacks richness.\n{% endnotice %}\n\n{% figure caption:\"Building up a color with multiple layers usually yields better results than one dark glaze.\" class:\"gallery-2-col\" %}\n![screenshot of leaf color layered](/assets/images/paper-53-tree-green-layered.jpg)\n![screenshot of leaf color single coat](/assets/images/paper-53-tree-green-one-layer.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: painting with the brush\n\nRemember the watercolor brush is translucent and no matter what color you pick it won't match without a few coats.\n{% endnotice %}\n\nHere are some of my favorite colors to get you started painting leaves:\n\n{% figure caption:\"On the left, base green color. On the right, highlight color.\" class:\"gallery-2-col\" %}\n![screenshot of leaf base color](/assets/images/paper-53-leaf-mixed-green.jpg)\n![screenshot of leaf highlight color](/assets/images/paper-53-leaf-mixed-highlight.jpg)\n{% endfigure %}\n\nOnce you're happy with the general shape of the tree, it's time to add some shadows. You can continue to use the same base color from before or darken it up depending on how much shadow you have to color. What I like to do is make short strokes to create a blotchy texture. For you traditional painters out there, it's kind of like scumbling, only we're not scraping paint around with a dry brush.\n\nThe primary goal here is to give the illusion of leaf clusters and indicate where the branches and trunk flow. [FiftyThree's Pencil]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}) or a [Pogo Connect Smart Pen]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) can help immensely to paint branches of varying widths --- an ability no other styli support when used with Paper by 53.\n\n{% figure caption:\"A fast way to create leaves is to make short quick strokes with the watercolor brush.\" %}\n![screenshot of leaf texture strokes](/assets/images/paper-53-tree-texture-strokes.jpg)\n{% endfigure %}\n\nNow it's time to start adding detail to the tree with highlights. Using a reference photo can help determine a good highlight color, but if you don't have one check below for my favorite mixes. Stay away from colors that are too white --- you want a color that is still in the family of your base color, just warmed and lightened.\n\n{% notice %}\n#### ProTip: mixing leaf highlights\n\n![screenshot of yellow orange highlight color](/assets/images/paper-53-leaf-highlight-swatch.png){: .align-right}\nIf you're having trouble mixing a highlight I like to start with a green from the leaf's base, and add yellow. Yellow with orange mixed in also makes for a nice leaf highlight --- note the example on the left.\n{% endnotice %}\n\nWith our highlight color mixed, select the pencil tool and start lightly sketching small \"scratchy\" marks over the base coat. The more times you go over a pencil stroke, the more intense the color will get. Try not to overwork one area with the pencil, the key is to keep everything harmonious.\n\n{% notice %}\n#### ProTip: pencil in highlights\n\nApply highlight strokes on dark shadows to define individual leaves or groupings. A well placed pencil highlight can go a long way in adding texture and realism to your art.\n{% endnotice %}\n\n{% figure caption:\"For a more textured look use the pencil tool instead of the fountain or ink pens.\" %}\n![screenshot of highlight strokes](/assets/images/paper-53-leaf-highlight-strokes.jpg)\n{% endfigure %}\n\nAt this point your tree is pretty much done --- it really depends on how much detail you think it needs. If this tree is the primary subject of your composition then you probably want to work it some more and sharpen the edges. If it's just background filler I'd suggest keeping it soft and blurry so it doesn't compete with whatever you're placing in the foreground.\n\nFor extra detail grab the base green from before, and mix in some brown and black, for a nice dark color. Armed with a pencil, use this color to add branches, and refine edges. If you overworked areas with highlights earlier, this darker color is perfect for adding shadows back in.\n\n{% figure caption:\"This dark green can also be used to add texture to the leaves by making small *scratchy* strokes.\" %}\n![screenshot of branch detail](/assets/images/paper-53-tree-branch-detail.jpg)\n{% endfigure %}\n\nTo finish, quick strokes of watercolor with either a light gray or light dull green, can be used to add subtle gradations. Don't go crazy here, just a few small strokes on top of the pencil marks is enough to add depth. \n\n![screenshot of subtle watercolor shadows](/assets/images/paper-53-dull-green-gradation.jpg)\n\n{% notice %}\n#### ProTip: background cleanup\n\nFill the pencil with a color that matches the background and use it to refine the tree's outline, cleaning up any watercolor that might have bled.\n\nThis technique works great to \"erase\" any spots in the middle of the tree where the sky might be showing through leaves.\n{% endnotice %}\n\n{% figure caption:\"Erasing parts of the tree by using a pencil filled with a color that closely matches the background.\" %}\n![screenshot of refine tree edges with background color](/assets/images/paper-53-refine-tree-edges.jpg)\n{% endfigure %}\n\n---\n\n## Grass and foliage\n\nWhen drawing grass, bushes, and other greenery, the same tree techniques can be applied --- with some slight variations.\n\nInstead of painting a base coat with watercolor, I like to use the marker or fountain pen. If done in one stroke (without lifting your pen or finger) you'll get a single continuous color. Otherwise two coats will be required to make this shape smooth because of the translucent nature of these tools.\n\n![screenshot uneven comparison grass](/assets/images/paper-53-grass-uneven-even.jpg)\n\nThis next step can be quite tedious, especially if you have a lot of grass to add. To draw each shard of grass, I use green mixed with yellow (pretty much the same highlight color used for trees), and draw small strokes with the pencil. The direction and length of these strokes are very important to render realistic looking grass.\n\nGrass cut short is fairly painless to draw. Making small subtle marks with the pencil to suggest grass is all that's needed --- texture is what's important here. \n\n{% notice %}\n#### ProTip: treat grass like hair\n\nWhen drawing longer grass, I like to think of it as hair and block out the major sections with stroke guides. These help determine what direction the rest of the grass should be moving when filling in each chunk.\n{% endnotice %}\n\n![screenshot grass stroke guides](/assets/images/paper-53-grass-short-long-strokes.jpg)\n\n{% notice %}\n#### ProTip: use stroke speed to your advantage\n\nTo feather out each shard of grass, move slow as you begin a stroke and faster as you finish. For those using a Pogo Connect Smart Pen, press hard at the start of your stroke and lighten up as you follow through.\n{% endnotice %}\n\n{% figure caption:\"You can create a various types of grass by varying their length and direction.\" %}\n![screenshot grass stroke feathered](/assets/images/paper-53-long-grass-feathered.jpg)\n{% endfigure %}\n\nDark green pencil strokes from the grass's base up to the middle can be used to add shadow to longer grass. For shorter strands, well placed marks below highlight strokes will add just the right amount of depth.\n\n{% figure caption:\"A few well placed shadows strokes to add depth to the grass.\" %}\n![screenshot long grass shadows vs. short grass shadows](/assets/images/paper-53-long-grass-shadows.jpg)\n{% endfigure %}\n\nOne final tip for creating depth is to paint over everything with light gray or tan colors. Grass that is furthest back receives more coats of watercolor --- while grass that is in the foreground gets less.\n\n![screenshot of applying tan shadows to grass](/assets/images/paper-53-grass-tan-shadows.jpg)\n\n{% notice %}\n#### ProTip: cool and warm colors\n\nA general rule of thumb is to mix blue/gray to your background colors, and warm them up as you move forward. A couple of well placed pencil strokes using this principle can enhance a composition's depth quite effectively.\n![screenshot background blue grass](/assets/images/paper-53-grass-blue-shadows.jpg)\n{% endnotice %}\n\n## Variations on a theme\n\nUsing all of these techniques on their own or in concert, I was able to create lush backgrounds for many of the portraits in my [PaperFaces Project](/paperfaces/). Below are a few tree and grass examples to show what is possible just by varying the color and composition.\n\n<ul class=\"gallery-thumbnails\">\n  <li><a href=\"{% post_url /paperfaces/2013-08-19-isellsoap-portrait %}\"><img src=\"/assets/images/paperfaces-isellsoap-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-08-02-thatmiddleway-portrait %}\"><img src=\"/assets/images/paperfaces-thatmiddleway-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-07-11-lmichelleinc-portrait %}\"><img src=\"/assets/images/paperfaces-lmichelleinc-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-04-26-elektrojunge-portrait %}\"><img src=\"/assets/images/paperfaces-elektrojunge-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-02-12-jupiter909-portrait %}\"><img src=\"/assets/images/paperfaces-jupiter909-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-01-25-ryandawidjan-portrait %}\"><img src=\"/assets/images/paperfaces-ryandawidjan-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2012-12-31-quimeraimantada-portrait %}\"><img src=\"/assets/images/paperfaces-quimeraimantada-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-01-01-michael-rose-portrait %}\"><img src=\"/assets/images/paperfaces-michael-rose-150.jpg\" alt=\"thumb\" /></a></li>\n</ul>\n\n---\n\nIn the next article in this series I'll take you through the techniques and steps I use to paint a blue skies, fluffy clouds, and sunsets. All three are the perfect compliments to a well drawn tree...\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-09-05-drawing-clouds.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: drawing skies and clouds\"\nexcerpt: \"Techniques for drawing blue skies, clouds, and pretty sunsets using the iPad app Paper for iOS.\"\nlast_modified_at: 2018-11-06T11:57:52-05:00\nimage: \n  path: &image /assets/images/paper-53-skies-guide-feature.jpg\n  width: 1280\n  height: 436\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\nPaper by FiftyThree makes painting realistic skies and clouds a breeze. If you had fun drawing trees, just wait until you fluff out happy clouds that would make Bob Ross proud. Honestly, with just a few washes of watercolor and strokes of pencil, you'll have an instant masterpiece. Here...let me show you how.\n\n## Blue skies fade\n\nLet's start with the easier of the two, a nice bright blue sky. One of the more important steps is choosing a blue to paint with. The hue...the saturation...and the brightness all play a role in the overall emotion of the piece. I tend to mix in a swirl of green and keep it slightly over saturated to contrast against skin tones as seen in my many [PaperFaces portraits](/paperfaces/). If you're going for doom and gloom, back off the blue and mix in gray instead to set the foundation for an overcast sky.\n\n{% figure caption:\"Blue and overcast sky color mixes\" class:\"gallery-2-col\" %}\n![screenshot of blue sky color mix](/assets/images/paper-53-blue-sky-mix.jpg)\n![screenshot of overcast sky color mix](/assets/images/paper-53-overcast-sky-mix.jpg)\n{% endfigure %}\n\nWith the base sky color mixed, select the pencil tool and draw a line across the screen to represent the horizon. This step isn't always necessary, so if you're a pro and don't need the help of a guide feel free to move on.\n\n![screenshot of pencil horizon line in blue](/assets/images/paper-53-pencil-horizon-line-blue.jpg)\n\n### Watercolor base coat\n\nPrep work complete, now you can start the actual painting of the sky. What you're trying to accomplish with this step is a smooth coat that gradually fades to white as you approach the horizon line. The easiest way to do this is with the watercolor brush, starting from the top of the composition, working down in a slight zig zag pattern.\n\n{% figure caption:\"Direction your stroke should follow. Back and forth, top to bottom.\" class:\"gallery-2-col\" %}\n![screenshot showing sky stroke direction with arrows](/assets/images/paper-53-sky-stroke-direction-arrows.jpg)\n![screenshot showing sky stroke direction desired result](/assets/images/paper-53-sky-stroke-direction.jpg)\n{% endfigure %}\n\nWhen painting, do not lift the stylus or your finger from the screen until you finish this first coat. The trick is to move very slow near the top, and progressively speed up the zig zag pattern as you approach the horizon line. Depending on how gradual of a fade you want in the sky, multiple coats may be required. Follow the same pattern from before to keep everything looking smooth.\n\n{% figure caption:\"The finished result. Even distribution of color near the top that slowly fades as it approaches the horizon line.\" %}\n![screenshot of blue sky with multiple coats](/assets/images/paper-53-blue-sky-base-multiple.jpg)\n{% endfigure %}\n\n### Painting puffy clouds\n\nNow comes my favorite part, painting happy clouds ala Bob Ross[^1]. Sticking with the watercolor brush, we're going to fluff a few clouds in using short circular strokes. If you have a [Pogo Connect Smart Pen]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}), you can control the amount of background lightening easier. But if you don't, just focus on making quick strokes --- the faster the better. \n\n{% notice %}\n#### ProTip: go easy on the white\n\nWhite lightens quickly and you don't want to remove too much blue at once, so be careful with this step. If you remove too much, just rewind and try again.\n{% endnotice %}\n\n{% figure caption:\"The technique I use for fluffing in clouds with the brush is very similar to [how I create leaves]( /mastering-paper/drawing-trees/).\" %}\n![screenshot of fluffed clouds](/assets/images/paper-53-fluffed-white-clouds.jpg)\n{% endfigure %}\n\nWith the clouds shaped and looking like clumps of cotton, it's time to add a few wispy cirrus clouds and clean the edges up. Again, a [Pogo Connect Smart Pen](http://www.amazon.com/gp/product/B009K448L4/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B009K448L4&linkCode=as2&tag=mademist-20) comes in handy, allowing you to work lightly and gradually. Finger painters and normal stylus creators fear not, quick strokes can achieve the same results.\n\nNo need to overdo it with the wisps, just a few light crosshatches is all that's needed. For those longer streaky clouds your pencil strokes should be longer and more horizontal. I usually stick with just a pencil to create these wisp textures, but if you're feeling adventurous a light touch of white watercolor can be used to finish them off.\n\n{% figure caption:\"Criss-cross your pencil strokes\" %}\n![screenshot of streaky cloud pattern](/assets/images/paper-53-streaky-cloud-pattern.jpg)\n{% endfigure %}\n\nDon't be afraid to go back into the clouds with the blue color we initially painted the sky with. The same \"streaky\" pencil pattern used to draw wisps (see above) can be used to add subtle cloud shadows. I often flip flop between blue and white to get the detail just right.\n\n{% figure caption:\"Adding subtle blue shadows to the larger fluffy clouds and the finished result.\" class:\"gallery-2-col\" %}\n[![screenshot adding blue shadows to clouds](/assets/images/paper-53-cloud-blue-shadow-600.jpg)](/assets/images/paper-53-cloud-blue-shadow-lg.jpg)\n[![screenshot the finished cloud](/assets/images/paper-53-clouds-600.jpg)](/assets/images/paper-53-clouds-lg.jpg)\n{% endfigure %}\n\n## Sunsets and fire skies\n\nTo paint a sunset, I use the same exact techniques and process. The only difference is the addition of three to four colors to create all the sunset fades and multi-colored clouds.\n\nFiery red skies and silhouetted foreground subjects look super dramatic, so that's what I'm going to demonstrate in the following steps. Remember, color is extremely subjective, I'm merely showing a few examples to get you started. Feel free to experiment and vary them up --- there is no right or wrong here.\n\n![screenshot of sunset red orange color mix](/assets/images/paper-53-sunset-red-color-mix.jpg)\n\nWe'll start by mixing orange into red and then draw a light line at the sky's horizon to act as our guide. Select the watercolor brush and apply paint from the horizon line up --- in the opposite direction from before. Remember the zig zag pattern we used earlier to paint a blue sky? Good. Because it's going to come in handy here.\n\nJust like the blue sky from before, paint slowly from left to right, slightly overlapping the row before without lifting your pen or finger. As you approach the top of the sky move faster to fade the color into the background.\n\n![screenshot of 1st red coat](/assets/images/paper-53-sunset-red-color-wash.jpg)\n\n### Gradations of color\n\nA few coats to build up the sky into a smooth gradation of color may be necessary. What you're looking for is a darker red at the horizon, that gradually fades into the background about halfway up from the top. I fade the red around halfway to leave room to fade a dark blue-violet down from the top in this next step.\n\n![screenshot of sunset dull blue color mix](/assets/images/paper-53-sunset-blue-color-mix.jpg)\n\nAfter you're satisfied with the red coat, mix a dull and dark blue gray to paint the other half of the sunset. Use the same zig zag painting pattern, only this time start in the upper left corner and work your way down. As you approach the faded red, paint faster to fade into the background just before it, leaving about an inch of background between.\n\n{% figure caption:\"Don't be afraid to rewind and redo your gradations. I usually don't get the shape and fade right on the first try.\" %}\n![screenshot background color between blue and red](/assets/images/paper-53-sunset-red-blue-washes.jpg)\n{% endfigure %}\n\nYou could leave the sunset washes as is and proceed to drawing clouds, but if you want to add even more drama to the sunset, apply a thin wash of yellow. I like to mix a creamy color like so:\n\n![screenshot sunset yellow cream color mix](/assets/images/paper-53-yellow-cream-color-mix.jpg)\n\nAnd paint a light coat over the red, background area in the middle, and gradually fade into the blue.\n\n![screenshot sunset yellow cream wash](/assets/images/paper-53-sunset-yellow-cream-wash.jpg) \n\n{% notice %}\n#### ProTip: speed matters\n\nPaint faster as you approach the blue wash to avoid turning it into a green color. Yellow and blue make...\n{% endnotice %}\n\n### Sunset clouds\n\nTo add clouds to our sunset let's start by mixing a red into white. You want a pink color that has just enough white in it to lighten while you paint --- some trial and error may be necessary to get the mix right. Once you successfully mixed a pink, fluff in a few clouds using short circular strokes (same technique used in the blue sky).\n\n![screenshot of pink fluffed clouds](/assets/images/paper-53-sunset-pink-fluff-clouds.jpg)\n\nGiving these clouds depth and dimension can be achieved by adding a little more red to the mix. You're looking to add just enough to make the color translucent instead of opaque. A few strokes is all that's needed when applying red tinted shadows to the clouds. \n\n{% figure caption:\"Adding pink to the clouds for extra fluffiness.\" %}\n![screenshot add red shadows to clouds](/assets/images/paper-53-sunset-red-clouds-wash.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: find the right mix\n\nIf you don't add enough red to the color mix, the watercolor brush will lighten the cloud instead of darkening it.\n{% endnotice %}\n\nA pencil filled with a pinkish red is also perfect for refining clouds edges or drawing in long wispy clouds.\n\n{% figure caption:\"Color mix and end result of drawing pink wispy clouds with the pencil tool.\" class:\"gallery-2-col\" %}\n![screenshot sunset red cloud shadow color mix](/assets/images/paper-53-sunset-red-cloud-mix.jpg)\n![screenshot pink wispy clouds](/assets/images/paper-53-sunset-pink-wispy-clouds.jpg)\n{% endfigure %}\n\nAn added benefit of painting a sunset, is how it reacts with objects that are placed in silhouette. You can draw or paint almost anything and fill it with a dark color to add drama to your creation. The outline of a figure in the foreground, hills and mountain tops, or a half circle at the horizon to represent an eclipsed sun are all appropriate choices.\n\n![screenshot of sun and hills in silhouette](/assets/images/paper-53-sunset-finished.jpg)\n\n## Variations on a theme\n\nUsing all of these techniques I was able to create a variety of backdrops for the portraits in my [PaperFaces Project](/paperfaces/). Below are a few finished skies and clouds to show what is possible just by varying the color and composition.\n\n<ul class=\"gallery-thumbnails\">\n  <li><a href=\"{% post_url /paperfaces/2013-08-22-laramulady-portrait %}\"><img src=\"/assets/images/paperfaces-laramulady-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-08-22-tipican-portrait %}\"><img src=\"/assets/images/paperfaces-tipican-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-07-29-sbrolins-portrait %}\"><img src=\"/assets/images/paperfaces-sbrolins-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-07-22-technacity-portrait %}\"><img src=\"/assets/images/paperfaces-technacity-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-06-19-dismanntled-portrait %}\"><img src=\"/assets/images/paperfaces-dismanntled-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-05-28-suhairykz-portrait %}\"><img src=\"/assets/images/paperfaces-suhairykz-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-02-01-nick-aylward-portrait %}\"><img src=\"/assets/images/paperfaces-nick-aylward-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-01-17-shinfu-portrait %}\"><img src=\"/assets/images/paperfaces-shinfu-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n</ul>\n\n---\n\nNext up --- the perfect landscape compliment to happy trees and clouds, crashing waves and water.\n\n[^1]: Watching Bob Ross paint on his PBS show, [**The Joy of Painting**](http://en.wikipedia.org/wiki/The_Joy_of_Painting) was a huge influence on me during my high school years. Many of the techniques I use to paint with Paper by 53 have been adapted from him. RIP in you silly son of a gun.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-09-29-drawing-water.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: drawing water and waves\"\nexcerpt: \"Methods for drawing water and waves using the iPad app Paper for iOS.\"\nlast_modified_at: 2018-11-06T11:58:07-05:00\nimage: \n  path: &image /assets/images/paper-53-water-guide-feature.jpg\n  width: 1280\n  height: 500\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\nHopefully parts 2 and 3 of my [Mastering Paper by FiftyThree Guide](/mastering-paper/) demonstrated just how easy drawing trees and skies on an iPad can be. Building on the techniques in those tutorials, I'm going to walk you through my process for drawing water and waves --- perfect for beach and coastline illustrations! If you enjoyed how I draw clouds, the following should be familiar territory since I use similar techniques.\n\n## Mixing the water\n\nWhen choosing a color for the water, I like to mix it dull and gray by knocking the saturation down[^mixer]. I find this helps arrive at a better base color and contrasts nicely against a bright blue sky. But don't let this mix limit your creative vision, make it any color you want.\n\n{% figure caption:\"One of my favorite color mixes for painting water and waves.\" %}\n![screenshot of blue-gray water mix](/assets/images/paper-53-water-color-mix.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: start light\n\nDon't make the mix too dark. You'll achieve better results by applying multiple lighter coats instead of going at it with one. Mix the desired color[^mixer] you'd like to end up with and then lower the saturation and luminosity about 25% each.\n{% endnotice %}\n\n[^mixer]: In Part 1 of my Mastering Paper Guide I explain [how to use the color mixer]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#color-mixer) and what the various sliders mean and do.\n\nMuch like drawing skies, you can choose to mark a horizon line in pencil to act as a guide --- or go commando if you're confident in your watercolor skills. If you decide to draw the horizon, remember to keep it light so it doesn't bleed through the watercolor we'll be applying next.\n\n{% figure caption:\"**ProTip:** An iPad smart cover placed on the screen can be used as a straight edge for drawing lines if you don't have a ruler handy.\" %}\n![using an iPad smart cover as a ruler](/assets/images/paper-53-smart-cover-rule.jpg)\n{% endfigure %}\n\n### Base coat for the water\n\nWith our blue-gray mixed and ready, select the watercolor brush and paint a slow and even stroke to make up this first layer of water. Just like painting skies, you're trying for an even application of watercolor without lifting your stylus or finger off the iPad's screen. Work your stroke from top to bottom, left to right, overlapping the previously painted portion slightly. A slow stroke with a slight zig zag to it will aid in painting an even and homogeneous tone quickly.\n\n{% figure caption:\"The slower the stroke the more evenly paint is distributed --- yielding a smooth and even tone.\" %}\n![screenshot of water with a layer base coat](/assets/images/paper-53-water-base-coat.jpg)\n{% endfigure %}\n\nStart with 2--3 even coats filling in the water with as smooth a tone as you can. Depending on how many wave troughs there will be, you may have to gradually fade the tone as you move down. The water I'm painting in this example is fairly flat, so keeping the tone smooth throughout is the goal here.\n\n{% figure caption:\"In the photo reference to the right you'll notice the water is darkest at the horizon and gradually fades down --- that's the effect you're looking to replicate by increasing the speed of your stroke as you approach the bottom.\" %}\n![screenshot faded blue water with two coats](/assets/images/paper-53-water-fade-reference.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: dark to light\n\nApplying multiple coats adjacent to the horizon line and lightening as you work down will add dimension to the painting. Fading into the paper will also give you more flexibility later if you decide to add a beach or coastline.\n{% endnotice %}\n\n### Adding wave chop\n\nFor the sake of this tutorial I'm going to draw small waves using quick and choppy watercolor brush strokes. The technique is very similar to painting clouds using white, only in this case we're using the same color we painted the water's base with. The waves I'm painting are fairly flat so there's no need to go overboard with the chop.\n\n{% figure caption:\"Short, quick strokes to add hints of small waves and break up the space.\" %}\n![screenshot of watercolor wave chop technique](/assets/images/paper-53-wave-chop-dark.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: use tints to lighten\n\nIf you go too dark, just mix white into your base coat color. Continue adding white until you get a color that has a hint of the base and lightens the water as you paint. It might take trial and error to find this \"sweet spot.\"\n{% endnotice %}\n\n{% figure caption:\"And here's an example of lighter wave chops for those areas you may have painted too dark.\" %}\n![screenshot of watercolor wave chop lighten technique](/assets/images/paper-53-wave-chop-light.jpg)\n{% endfigure %}\n\n### Under painting large waves\n\nDepending on the intensity of the waves this next step can be omitted. For larger waves with a lot of white foam, I like to paint a few more layers of blue anywhere these waves appear. The more layers, the darker the blue --- the darker the blue, the higher the contrast there will be between the white wave foam we'll be adding next…\n\n{% figure caption:\"Using the photo on the left as a reference, look for the large white areas of a wave and underpaint there. The finished result is on the right.\" class:\"gallery-2-col\" %}\n![wave photo reference photo](/assets/images/paper-53-waves-photo.jpg) [![screenshot of underpainted waves in dark blue](/assets/images/paper-53-waves-underpainting.jpg)](/assets/images/paper-53-waves-underpainting-lg.jpg)\n{% endfigure %}\n\n## Waves, it's in the details\n\nWith a solid foundation set, it's time to add the finishing spit and polish to our waves. Select the pencil tool and fill it with the same blue we used to base coat the water. It doesn't have to be an exact match if you didn't save the color in your palette, just something close is all that's needed.\n\nStarting at the top of the water lightly sketch strokes from left to right. The severity of each wave will determine the direction and angle of these pencil lines --- the larger the wave, the greater the angle.\n\n{% figure caption:\"Use a blue-gray base color to draw in the smaller wave shapes.\" %}\n![screenshot of wave lines using the base color](/assets/images/paper-53-wave-lines-blue.jpg)\n{% endfigure %}\n\nA [Pogo Connect Smart Pen]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) works great for this step. It allows you to draw lightly and avoid going too heavy in an area. If you're finger painting or using a normal capacitive stylus, remember to move quickly with your pencil strokes --- the quicker you draw the lighter the mark.\n\n### White wave crests and foam\n\nCrests or areas where waves might be crashing against land I go heavy with a white pencil and try to make it textured and scratchy. Criss-crossing or hatching my strokes is one way of doing this quickly. If you remember my [guide on painting clouds]({% post_url /mastering-paper/2013-09-05-drawing-clouds %}), the technique is the same.\n\n{% figure caption:\"Draw wave crests and foam using a white pencil.\" class:\"gallery-2-col\" %}\n[![screenshot of wave foam zoomed in](/assets/images/paper-53-white-foam-detail.jpg)](/assets/images/paper-53-white-foam-detail-lg.jpg) [![screenshot of finished wave foam](/assets/images/paper-53-white-foam.jpg)](/assets/images/paper-53-white-foam-lg.jpg)\n{% endfigure %}\n\nDepending on the size of the wave crests it's usually easier to lightly paint in some highlights using a watercolor brush filled with white. Quickly dabbing or painting in short circular bursts will allow you to gradually lighten an area, without destroying the blue base coat beneath.\n\n{% figure caption:\"Dabs of white can cover an area much faster than the pencil tool when filling in large shapes.\" %}\n![screenshot of crashing wave white areas using watercolor and white](/assets/images/paper-53-wave-foam-brush.jpg)\n{% endfigure %}\n\n### Adding shadows to the waves\n\nTo add in shadows use a variation of the water's base color, mixed with 20--40% black. Apply the same technique used above but with this darker color instead of white. Focus on putting a few pencil strokes of dark adjacent to the white strokes which will add depth to the waves. As always, if you over work an area just rewind or draw over it using white if it's a shadow, and a shadow color if it's white.\n\n{% figure caption:\"Color mixture used to draw and paint shadows and wave lines.\" %}\n![screenshot of wave shadow color mix](/assets/images/paper-53-wave-shadow-mix.jpg)\n{% endfigure %}\n\n{% figure caption:\"A pencil mixed with a dark blue-gray is perfect for refining edges and adding definition to smaller waves.\" class:\"gallery-2-col\" %}\n[![screenshot of wave shadows drawn in pencil](/assets/images/paper-53-wave-shadows-zoom.jpg)](/assets/images/paper-53-wave-shadows-zoom-lg.jpg) [![screenshot of wave shadows drawn in pencil](/assets/images/paper-53-wave-shadows.jpg)](/assets/images/paper-53-wave-shadows-lg.jpg)\n{% endfigure %}\n\nBoom! And we're done. Combined with a blue sky from my previous guide and you'll have a landscape that looks like you drew it with traditional art supplies. Shhhhh...your secret is safe with me.\n\n## Variations on a theme\n\nUsing all of these techniques I was able to create a variety of backdrops for the portraits in my [PaperFaces Project](/paperfaces/). Below are a few finished waterscapes to show what is possible just by varying the color and composition.\n\n<ul class=\"gallery-thumbnails\">\n  <li><a href=\"{% post_url /paperfaces/2013-09-03-andrewbrewer-portrait %}\"><img src=\"/assets/images/paperfaces-andrewbrewer-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-07-29-sbrolins-portrait %}\"><img src=\"/assets/images/paperfaces-sbrolins-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-05-31-bradersk8r-portrait %}\"><img src=\"/assets/images/paperfaces-bradersk8r-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-05-08-iron-man-portrait %}\"><img src=\"/assets/images/paperfaces-iron-man-3-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-03-15-agentkyle-portrait %}\"><img src=\"/assets/images/paperfaces-agentkyle-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-01-25-jamesonroot-portrait %}\"><img src=\"/assets/images/paperfaces-jamesonroot-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n</ul>\n\n---\n\nThe next part will include techniques for drawing various textures with Paper's tools. Things like wood grain, brick, asphalt, and concrete will all be covered to round out the landscape portion of this guide.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-11-08-moleskine-book.md",
    "content": "---\ntitle: \"Printing a Moleskine book with Paper for iOS\"\nexcerpt: \"Impressions of a handmade Moleskine book printed with the iPad app Paper for iOS.\"\nlast_modified_at: 2018-11-06T11:58:28-05:00\nimage: \n  path: &image /assets/images/paper-53-book-feature.jpg\n  width: 1280\n  height: 500\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, design, review]\ntoc: true\ncomments_locked: true\n---\n\nAbout a month ago FiftyThree added a highly requested feature to their award winning app Paper --- the ability to print a book. Being a graphic designer I was curious to see the quality of these custom printed Moleskine books first hand. Using a small sampling of my PaperFaces portraits I ordered[^book-disclosure] my first book two weeks ago along with a Mastering Paper book I'm still waiting on.\n\n[^book-disclosure]: In the spirit of full disclosure --- I was reimbursed the cost of two Books (plus shipping) created with Paper in exchange for sharing them through a short video and photographs. I was not compensated in any other way and all opinions and bad grammar are my own.\n\n## Journal to custom printed book\n\nBefore I get into my impressions of the physical books, I wanted to quickly discuss the book making process. As expected it was utilitarian in design and fully integrated into the iOS app. The only problem I had was whittling down hundreds of [PaperFaces portraits](/paperfaces/) into a collection of 15 favorites to make up my book.\n\n{% figure caption:\"A few pages from my PaperFaces journal.\" %}\n![Screenshot of PaperFaces journal pages](/assets/images/paper-53-book-journal-pages.jpg)\n{% endfigure %}\n\nIf you haven't watched any of the [Book videos](https://vimeo.com/75045142) or seen this [lovely set of drawings](http://madewithpaper.fiftythree.com/post/64391384887/how-to-make-a-book-earlier-this-month-we) describing how to make a Book in 5 steps, then here's how the process unfolds --- pun intended.\n\n### Select your journal\n\nTaking a few of my favorite [**PaperFaces**](/paperfaces/) portraits and consolidating them down into a smaller journal became the basis of my first Paper book. I'm still waiting on the second book to arrive that features some unpublished [**Mastering Paper**](/mastering-paper/) cheat sheets from upcoming tutorials…\n\n{% figure caption:\"Deciding which journal to print was a huge challenge for me. I'm so indecisive.\" %}\n![Screenshot of my journals in Paper](/assets/images/paper-53-book-all-journals.jpg)\n{% endfigure %}\n\n### Choose fifteen pages\n\nAs noted earlier, I struggled with selecting 15 pages to turn into a book. I suppose when you have over 550 pages of portraits, narrowing them down to 15 is no easy feat. Maybe next time I'll organize them all into 40 volumes[^40-volumes] and print my own encyclopedia set of PaperFaces to line a bookshelf.\n\n[^40-volumes]: I better start saving my pennies because it would cost me around $1,600 to produce 40 Books with Paper.\n\n{% figure caption:\"Selecting your pages is as easy as tapping on them.\" %}\n![Screenshot of selecting 15 Book pages](/assets/images/paper-53-book-select-pages.jpg)\n{% endfigure %}\n\n{% notice %}\n#### Maximum page count\n\nIt's worth noting that if you select less than 15 pages for your book, you'll receive blanks filling the balance. Something I'd like to eventually see would be the option to create books with a higher page count. Maybe at larger predefined increments to keep the spine size fixed as not to mess with the cover's alignment and wrap. Printing pages ala cart would be nice as well.\n{% endnotice %}\n\n### Cover image\n\nI think the best option is to go fully custom with a cover. What I did was create a sketch for each of my books, and then assign them as journal covers. When you choose to *Print a Book* from the share button, Paper pulls in this cover by default. You also have the option of selecting a black leather texture that mimics the Classic Moleskine notebook.\n\n{% figure caption:\"Swatches saved in any of your palettes are available for use as a back cover and spine color.\" %}\n![Screenshot of selecting a cover image](/assets/images/paper-53-book-select-cover-color.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: custom colored cover wraps\n\nThe custom option affords you the opportunity of selecting a color for the back cover and spine. As far as I can tell you can't use the color mixer here to pick a color, so be sure to save one in your custom palettes if you don't like the defaults.\n{% endnotice %}\n\n### Order the book\n\nIf you don't have an account you'll be prompted to create one and then verify via a link sent to your email. The ordering process is what you'd expect if you've ever shopped online before --- enter your name, shipping and billing addresses, and payment information. \n\nAfter ordering you can easily check a book's status by tapping **Order Status** from within the *Print a Book* option. Doing so opens a tab in Safari displaying your order number, status, and shipping method. I would assume selecting one of the expedited options provides you with a tracking number for the package, but I went with Standard Shipping so I can't verify that.\n\n## Printed book and packaging\n\nTwo weeks later your book(s) will arrive in a small cardboard parcel with a pull tab. Tugging on this rips through the protective packaging to reveal a book wrapped in a protective sheet of paper.\n\n{% figure caption:\"A sticker seals the sleeve and the inside back is adorned with a handmade stamp and signature.\" class:\"gallery-2-col\" %}\n[![Photograph of book wrap](/assets/images/paper-53-book-wrap.jpg)](/assets/images/paper-53-book-wrap-lg.jpg) [![Photograph of the handmade seal](/assets/images/paper-53-book-seal.jpg)](/assets/images/paper-53-book-seal-lg.jpg)\n{% endfigure %}\n\nIf you've ever owned a Classic Moleskine notebook a few of the details printed on the inside front cover and first page should be familiar.\n\n{% figure caption:\"I've seen this *reward* page somewhere else before haven't I...\" class:\"gallery-2-col\" %}\n[![Photograph of book wrap](/assets/images/paper-53-book-heart-moleskine.jpg)](/assets/images/paper-53-book-heart-moleskine-lg.jpg) [![Photograph of the handmade seal](/assets/images/paper-53-book-reward.jpg)](/assets/images/paper-53-book-reward-lg.jpg)\n{% endfigure %}\n\n### Color faithfulness\n\nSo the real question is how well have my Paper drawings been reproduced in printed form? Pretty damn good if you ask me. To my eye the color is almost an exact match to what I see on the iPad's screen. It's not as bright because the paper stock printed on is warmer, but for the most part it's faithful.\n\n{% figure caption:\"Prints are not as crisp as what you see on screen, but I like that. Makes my drawings look more watercolory.\" %}\n[![Photograph of a PaperFaces drawing](/assets/images/paper-53-book-wendy.jpg)](/assets/images/paper-53-book-wendy-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"I really like how the pencil work printed --- drawings look super professional.\" %}\n[![Photograph of a Star Wars drawing](/assets/images/paper-53-book-yoda-luke.jpg)](/assets/images/paper-53-book-yoda-luke-lg.jpg)\n{% endfigure %}\n\n### Paper quality\n\nThe paper stock printed on is thinner than what I was expecting, which is a slight bummer. I suppose it's hard to gauge from the promotional videos alone just how thick they'd be. By no means a deal breaker, but something to be aware of if you were expecting something more.\n\n{% figure caption:\"Some bleed-through is present when viewing the pages from behind --- who's really going to do that though?\" %}\n[![Photograph of a paper bleed-through](/assets/images/paper-53-book-bleed-through.jpg)](/assets/images/paper-53-book-bleed-through-lg.jpg)\n{% endfigure %}\n\n### Accordion fold\n\nI personally like the accordion fold and how each of the pages are glued together into one continuous strip. If you're using a Book to tell a story in 15 pages, this style of binding helps enhance that. It also mimics the way you interact with pages from within Paper, which is a nice touch.\n\n{% figure caption:\"Some may prefer a perfect bound or saddle-stitched book, but I like the story-telling nature of an accordion fold.\" %}\n[![Photograph of the accordion fold](/assets/images/paper-53-book-accordion-fold.jpg)](/assets/images/paper-53-book-accordion-fold-lg.jpg)\n{% endfigure %}\n\n### Cover and spine\n\nAs noted before, the cover isn't as thick as I had hoped for, but it's not super thin either. To further protect it from scratches and stains, I'll be leaving it in the paper sleeve it shipped with. I'm crazy like that…\n\n{% figure caption:\"Custom cover option.\" %}\n[![Photograph of the book cover](/assets/images/paper-53-book-paperfaces-cover.jpg)](/assets/images/paper-53-book-paperfaces-cover-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"I selected black for the spine and back cover color.\" class:\"gallery-2-col\" %}\n[![Photograph of book wrap](/assets/images/paper-53-book-spine.jpg)](/assets/images/paper-53-book-spine-lg.jpg) [![Photograph of the handmade seal](/assets/images/paper-53-book-back-cover.jpg)](/assets/images/paper-53-book-back-cover-lg.jpg)\n{% endfigure %}\n\n## Justifying the price\n\nYes, $40 for a 15 page book[^page-cost] is bit on the expensive side. Especially when you can easily print a book from any local drugstore for half the price. But what you won't be getting for that price is a custom, handmade, accordion folded book, all within two weeks time.\n\nNot to mention the finished books share the same 4:3 proportion as your Paper creations so there won't be any funny bleeds or crops. What you see in Paper is what you get in real life, straight down to the elastic band and rounded edges. The fact that these little books come baring the Moleskine name, instantly adds +100 hipster cred points to your work.\n\n[^page-cost]: Not including shipping costs a Paper Book ends up costing about $2.67 per page.\n\n{% figure caption:\"Size comparison between a Classic Moleskine notebook and a Paper Book.\" %}\n![Photograph comparing a classic Moleskine Notebook to a Paper Book](/assets/images/paper-53-book-moleskine-comparison.jpg)\n{% endfigure %}\n\n{% figure caption:\"Digital journal compared to the printed version --- same accordion fold, same rounded corners, same elastic band cover.\" %}\n![Photograph comparing a digital journal to a Paper Book](/assets/images/paper-53-journal-comparison.jpg)\n{% endfigure %}\n\nIf you've been holding out printing a book with Paper, I'd encourage you to give it a try at least once. I believe they're most effective as gifts to share with friends and family. Why not get a jump on the upcoming holiday season and create a book now. If they're as popular as I predict them to be, it might be a good idea to get an order in early to beat the rush.\n\n{% figure caption:\"Flipping through a book of PaperFaces\" %}\n{% youtube ibG41djH_Nk %}\n{% endfigure %}\n\n---\n\n## Mastering Paper reference book\n\nWhen my second book didn't show up at the same time as the PaperFaces one, I started to worry that it was lost in the mail. I had ordered them at the same time and received shipping notices within seconds of each other notifying me they were on the way. But all is well and the other book finally showed up.\n\nFor this book I took a few of my Paper \"cheat sheets\" and adapted drawings from my **Mastering Paper** series to fill all 15 pages. If you look closely you'll notice a few teases from upcoming tutorials I'm in the process of writing now. I've also embedded a video flip-through for your viewing pleasure.\n\n{% figure caption:\"Assorted pages from my **Paper Reference Guide** book.\" class:\"gallery-3-col\" %}\n[![Photograph of the cover](/assets/images/paper-53-ref-book-1.jpg)](/assets/images/paper-53-ref-book-1-lg.jpg) [![Page showing strokes made with each tool](/assets/images/paper-53-ref-book-2.jpg)](/assets/images/paper-53-ref-book-2-lg.jpg) [![Page showing stroke layering effects](/assets/images/paper-53-ref-book-3.jpg)](/assets/images/paper-53-ref-book-3-lg.jpg) [![Page showing skin tone reference](/assets/images/paper-53-ref-book-4.jpg)](/assets/images/paper-53-ref-book-4-lg.jpg) [![Page showing hair references](/assets/images/paper-53-ref-book-5.jpg)](/assets/images/paper-53-ref-book-5-lg.jpg) [![Page showing how to draw an eye](/assets/images/paper-53-ref-book-6.jpg)](/assets/images/paper-53-ref-book-6-lg.jpg) [![Page showing how to draw a tree](/assets/images/paper-53-ref-book-7.jpg)](/assets/images/paper-53-ref-book-7-lg.jpg) [![Page showing how to draw grass](/assets/images/paper-53-ref-book-8.jpg)](/assets/images/paper-53-ref-book-8-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Flipping through another book\" %}\n{% youtube BW8czjeiNzw %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-11-20-pencil-first-look.md",
    "content": "---\ntitle: \"First look at blending with Pencil by FiftyThree\"\nexcerpt: \"FiftyThree's Pencil stylus and new Blend feature is full of promise. Here’s a taste of what is possible using them.\"\nlast_modified_at: 2018-11-06T11:58:50-05:00\nimage:\n  path: &image /assets/images/paper-53-blend-first-look-feature.jpg\n  width: 1920\n  height: 900\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Pencil by 53, Paper for iOS, Apple]\ncomments_locked: true\n---\n\nIn case you missed the announcement yesterday, FiftyThree took the wraps off their first hardware product --- [Pencil](http://fiftythree.com/pencil). For the last month I've had the privilege of wielding beta versions of this amazing tool to play with and test out. As soon as I purchase my own Pencil I'll follow up with a [full review]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}), but for now here's a small [sample of drawings](/tag/blend/) I've created using the new Blend feature.\n\n## But does it blend?\n\nFor me Blend is the most interesting aspect of Pencil. Being trained as a traditional artist, it works exactly how one would expect, you draw with Pencil and smudge with your finger to blend. Sure a ton of other *art* applications have blurring and blending tools, but they all break the creative flow by forcing you open tool palettes or push buttons. FiftyThree has made this action fun and true to life by seamlessly enabling drawing and blending in a natural and intuitive way.\n\n{% figure caption:\"Mountain scene painted with Paper\" class:\"gallery-2-col\" %}\n![Moutainscape painted with Paper](/assets/images/paper-53-blend-moutain.jpg)\n![Blended moutainscape reflection with Paper](/assets/images/paper-53-blend-moutain-reflection.jpg)\n{% endfigure %}\n\nLike all good things Blend is best used in moderation. I've found that it works great for blurring backgrounds to create a bokeh[^bokeh] like effect which in turn makes foreground subjects pop. Starting with a drawing I completed months ago, I was able to give it new life by simply running my finger over the watercolor painted background.\n\n[^bokeh]: In photography, bokeh is the blur, or the aesthetic quality of the blur, in out-of-focus areas of an image.\n\n{% figure caption:\"A little before and after for your eyeballs.\" class:\"gallery-2-col\" %}\n[![Drawing of Wendy pre-Pencil](/assets/images/paper-53-wendy-forest.jpg)](/assets/images/paper-53-wendy-forest-lg.jpg)\n[![Drawing of Wendy blended](/assets/images/paper-53-wendy-forest-blend.jpg)](/assets/images/paper-53-wendy-forest-blend-lg.jpg)\n{% endfigure %}\n\nPortraiture is an area I've tried to focus on when creating with Paper. In my initial experiments I can see Blend playing a contributing role in my [PaperFaces project](/paperfaces/). Until now it has been a challenge achieving realistic and smooth skin tones at the size that I draw --- Blend changes all that.\n\nMy favorite use of this new feature has been to create dreamy and surreal illustrations. This following piece is still a work in progress but I think it conveys a romantic quality that wouldn't have been possible without Blend.\n\n{% figure caption:\"Illustration needs more highlights, but really happy with the blends.\" %}\n[![Work in progress blended drawing of a girl underwater](/assets/images/paper-53-girl-underwater-wip.jpg)](/assets/images/paper-53-girl-underwater-wip-lg.jpg)\n{% endfigure %}\n\nThe next couple of months should be fun. I've learned a lot from the Paper community of creators, and I can't wait to see what inspiring works come when more Pencils are out in the wild!\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-11-25-drawing-textures.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: drawing textures\"\nexcerpt: \"Techniques for drawing bricks, wood, and rock textures using the iPad app Paper for iOS.\"\nlast_modified_at: 2018-11-06T11:59:09-05:00\nimage: \n  path: &image /assets/images/paper-53-texture-guide-feature.jpg\n  width: 1280\n  height: 500\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\nIf you've been following along you now know all my Paper techniques[^techniques] and tricks for painting basic landscapes. Trees, grass, skies, clouds, water, and waves --- all the parts for building a solid landscape foundation. This next tutorial in my Mastering Paper series will cover techniques for creating textures like bricks, wood grain, concrete, and rocks.\n\n[^techniques]: I like to draw loose and quick, and avoid anything that takes the fun and energy from the experience. My techniques focus more on getting the best results in the least amount of time, because who really wants to spend more than an hour on a drawing?\n\n## Drawing bricks\n\nBricks can be quite the monotonous subject to draw because of their repetitive shape. Getting the perspective right can also be quite challenging if you're trying to capture a brick road or wall that isn't perfectly flat.\n\nI'm not going to try and explain perspective or how to set a vanishing point because it's beyond the scope of this guide. Instead, the approach I like to take is to sketch lightly with the pencil --- creating guidelines to paint around. An easy way to do this is follow along where the cement is between the bricks and sketch your lines there. A photo reference is a big help here.\n\n{% figure caption:\"Depending on the orientation of the bricks you may end up with guides resembling this.\" %}\n![Screenshot of brick guide](/assets/images/paper-53-bricks-guide.jpg)\n{% endfigure %}\n\n### Sketching guidelines\n\nThe color of pencil doesn't really matter, just make it something light (a gray perhaps). A [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) stylus comes in handy allowing you can to produce lighter lines by gently applying pressure as you draw.\n\n{% notice %}\n#### ProTip: drawing straight lines\n\nAn iPad smart cover, piece of cardboard, or a book placed on the screen can all be used to help draw straight lines if you don't have a ruler nearby.\n{% endnotice %}\n\nWith a few guidelines placed, use the color mixer to create a base for the bricks. The mixture I decided on was a brown with some red and orange thrown in. Remember to mix a color about 25% lighter than what you'd like to end up with. We'll be applying several layers of color to the bricks --- if you mix it too dark you'll end up with bricks that are almost black and lack dimension.\n\n{% figure caption:\"To determine if you mixed the color light enough, paint a few layers of watercolor to the side and check the results.\" %}\n![Screenshot of rusty brown color](/assets/images/paper-53-bricks-brick-base-mix.jpg)\n{% endfigure %}\n\n### Laying bricks with watercolor\n\nWhen blocking out bricks, I prefer using the watercolor brush versus the marker. Simply put, it leaves you with a jagged edge that's closer to real life. Painting small bricks is next to impossible if you don't use a styli like [FiftyThree's Pencil]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}) or a Pogo Connect Smart Pen. Without one of them you're limited to one brush size --- which is quite wide for this sort of detail work.\n\n{% figure caption:\"Marker bricks vs. watercolor bricks\" %}\n![Screenshot comparing bricks](/assets/images/paper-53-bricks-comparison.jpg)\n{% endfigure %}\n\nAs you paint each brick, work a row at a time, using the lines to guide you. For each row, take care to stagger bricks depending on the [bonding pattern](http://en.wikipedia.org/wiki/Brickwork#Load_bearing_brick_bonds) you're going for and avoid stacking them vertically --- doing so will look unnatural.\n\n{% figure caption:\"Example of a [Stretcher bond](http://en.wikipedia.org/wiki/File:Brickwork_in_stretching_bond.svg). Notice how each successive brick is staggered?\" %}\n![Screenshot of brick placement painted with the brush](/assets/images/paper-53-bricks-watercolor-base.jpg)\n{% endfigure %}\n\nOnce all the bricks have been laid, err painted --- apply a second coat of watercolor to each. Painting fast and messy will add texture and a more natural look to the bricks.\n\n{% figure caption:\"Layers of watercolor don't need to be exact. Apply until you reach a color to your liking.\" %}\n![Screenshot of additional brick layers](/assets/images/paper-53-bricks-watercolor-2.jpg)\n{% endfigure %}\n\n### Cement lines\n\nWhen coloring the cement between the bricks I usually handle it in three different ways.\n\n1. Don't do anything and leave it blank so the background color shows through.\n2. Mix a light gray and paint with the brush over all of the bricks, covering the spaces between them.\n3. Mix a light gray and use the marker tool to cover the bricks and spaces between them. Unlike the watercolor brush, a gray marker won't mess with the brick color --- unless it's really dark.\n\n{% figure caption:\"Blank cement vs. cement and brick painted with gray\" %}\n![Screenshot of cement styles](/assets/images/paper-53-bricks-cement-styles.jpg)\n{% endfigure %}\n\nAt this point you could call it a day and consider the bricks finished. If you want to add some additional detail here are a few areas to focus on.\n\n{% notice %}\n#### ProTip: uniformity is the enemy\n\nVarying brick color is a nice way to add visual interest and break up the space. Painting random bricks with a red or orange mix usually produces favorable results.\n{% endnotice %}\n\n### Adding detail to the bricks\n\nAdd shadows to each of the bricks. Using a darker mix of the rusty brown from before (or a dark gray), paint shadow shapes on the bricks. You don't want to cover the entire brick, just one of the corners depending on where the light is positioned in the scene.\n\n![Screenshot of adding shadows to bricks](/assets/images/paper-53-bricks-brush-shadows.jpg)\n\nUsing this same color (possibly with more black mixed in), a stroke of pencil below each brick is used to add small shadows. It can also be used to draw in cracks or add texture to the bricks.\n\n![Screenshot of adding cracks to bricks](/assets/images/paper-53-bricks-pencil-shadows.jpg)\n\nI use the same technique but with a light orange color to draw in brick highlights and accentuate the cracks.\n\n{% figure caption:\"Drawing subtle highlights on each brick using a light orange color.\" class:\"gallery-2-col\" %}\n![Screenshot of brick highlight color](/assets/images/paper-53-bricks-highlight-mix.jpg) ![Screenshot of adding brick highlights](/assets/images/paper-53-bricks-pencil-highlight.jpg)\n{% endfigure %}\n\nTo finish off the bricks I'll use a mixture of gray to further refine the spaces between the bricks and correct any shapes I don't like. This step is completely optional and really depends on how crisp you want your edges to look.\n\n{% figure caption:\"Refine brick edges using the pencil tool and a color that matches the cement.\" %}\n![Screenshot of refining brick edges with gray](/assets/images/paper-53-bricks-refine-edges.jpg)\n{% endfigure %}\n\n---\n\n## Drawing wood grain\n\nWood color varies quite a bit so I'm going to focus more on the process and less on the color. The basic idea is to lay down a medium base coat and then work lighter colors on top of it.\n\n### Selecting a base color\n\nDetermine what the mid-tone color of the wood is. Using the following photograph of wood as a reference, we can determine that it's somewhere around a medium brown.\n\n{% figure caption:\"Mix your mid-tone color to match the photo, then reduce the brightness about 10%, and increase the saturation a bit.\" class:\"gallery-2-col\" %}\n![Wood reference photograph](/assets/images/paper-53-wood-reference.jpg)\n[![Screenshot of medium brown color mix](/assets/images/paper-53-wood-base-mix.jpg)](/assets/images/paper-53-wood-base-mix-lg.jpg)\n{% endfigure %}\n\nThis becomes the base color and will be used to paint the wood's shape with watercolor. For this first coat of watercolor, paint slowly to create an even and continuous tone. The idea with this base is to set the overall tone of the wood. We don't want to go too dark or too light because we'll be applying shadows and highlights and need enough contrast for the grain effect to work.\n\n{% figure caption:\"After a few more applications of watercolor you should have something that looks like this, matching the reference photo.\" %}\n![Screenshot of wood base layer](/assets/images/paper-53-wood-base-coat.jpg)\n{% endfigure %}\n\n### Penciling in grain texture\n\nNow begins the fun of penciling in wood grain textures. Start by selecting the medium brown from before and mixing it about 10% darker. Depending on the temperature of the wood's color it might be better to mix in a dark red to warm it, or a bluish green to cool it. Color is fairly subjective so you might have to play with the hue if the color shifts out of harmony from the base.\n\nUsing the pencil tool, begin sketching in *fuzzy* lines to represent wood grain. If you look back at our photo reference the grains go up and down --- that's the direction to follow.\n\n{% figure caption:\"Keep the strokes loose and light to create a fuzzy and incomplete line. It helps to enhance the wood grain effect.\" %}\n![Screenshot of wood grain strokes](/assets/images/paper-53-wood-fuzzy-lines.jpg)\n{% endfigure %}\n\nWithout changing the color switch to the brush and splash in the wood's darker spots. You may have to lighten the color some if it goes black too fast. Ideally you'll build up the dark with several layers versus just to create richer tones. \n\n{% notice %}\n#### ProTip: more layers = smoother gradients\n\nDon't try and take the fast way out by painting with darker tones. Start light and build them up with multiple glazes. The results always look better and more natural.\n{% endnotice %}\n\n![Screenshot of adding darkness to the wood](/assets/images/paper-53-wood-shadow-mix.jpg)\n\n### Adding details\n\nBlack or an appropriate dark color can be used to draw in deeper cracks using the same *fuzzy* line technique from before. If wood knots exist, use this color to create oval shapes and fill them. If you keep these pencil strokes loose and sketchy they'll match the other textures and unite visually.\n\n{% figure caption:\"Using the pencil tool and a dark color like black, draw in deeper cracks and knots in the wood.\" %}\n[![Screenshot of wood cracks](/assets/images/paper-53-wood-black-cracks.jpg)](/assets/images/paper-53-wood-black-cracks-lg.jpg)\n{% endfigure %}\n\nFor a final pass, mix a lighter variation of our base color. With this color and the pencil tool selected, sketch in a few highlights to add subtle texture to the wood. Keeping these strokes loose and *fuzzy* will help avoid over-powering the wood grain lines we drew earlier.\n\n{% figure caption:\"Enhancing the wood grain effect by adding highlights using *fuzzy* pencil strokes.\" class:\"gallery-2-col\" %}\n[![Screenshot of wood highlight color](/assets/images/paper-53-wood-highlight-mix.jpg)](/assets/images/paper-53-wood-highlight-mix-lg.jpg)\n[![Screenshot of wood highlights](/assets/images/paper-53-wood-highlight.jpg)](/assets/images/paper-53-wood-highlight-lg.jpg)\n{% endfigure %}\n---\n\n## Drawing asphalt, gravel, and rocks\n\nWhen drawing sidewalks, roads, or any sort of rocky terrain I adapt the following process to fit most situations. \n\n1. Decide on a base color for the rocks.\n2. Paint several layers on top of each other using this base color and the paint brush tool.\n3. Mix up a darker variant of the base color.\n4. Sketch in random pencil strokes to add texture.\n\n### Painting a base\n\nHere's how it boils down in visual form. First mix up a base color to paint with. For the purpose of this guide let's go with a gray blue.\n\n![Screenshot of asphalt base color mix](/assets/images/paper-53-asphalt-color-mix.jpg)\n\nUsing the watercolor brush, paint a slow and even base layer. Keep adding layers until you're happy with the color. You want it to make up the mid tone of your gravel, rocks, asphalt, or pebbles, so don't go too dark or light because we want an adequate contrast between the shadows and highlights we'll be adding next.\n\n![Screenshot of asphalt base](/assets/images/paper-53-asphalt-base.jpg)\n\n### Applying texture\n\nGoing back to the color mixer, add in black or darken it with the sliders. You're looking to reproduce a dark variation of the base we just painted. Next select the pencil tool, zoom in, and begin sketching *specks* of dirt and cracks. Keep these strokes loose and fairly random by moving around quickly --- the *fuzzier* the better.\n\n![Screenshot of adding dirt and shadow](/assets/images/paper-53-asphalt-dark-texture.jpg)\n\n{% notice %}\n#### ProTip: Bluetooth styli to the rescue\n\nHate to sound like a broken record, but using FiftyThree's Pencil or a Pogo Connect Smart Pen really does make using the pencil tool better. Building up tones becomes gradual and efficient by giving you more control over a stroke by varying the direction or amount of pressure applied.\n{% endnotice %}\n\nUsing the exact same technique, mix a lighter color of the base and speckle in dirt and asphalt highlights.\n\n![Screenshot of adding dirt highlights](/assets/images/paper-53-asphalt-light-texture.jpg)\n\n### Painting large rocks\n\nWhen drawing pebbles and large rocks, use the watercolor brush to create oval shapes instead. Don't linger in a spot too long, the goal is to keep these shapes irregular and loose.\n\n{% figure caption:\"For more variation feel free to vary the color of the rocks by adding red or blue to the mix.\" class:\"gallery-2-col\" %}\n[![Screenshot of pebble shapes](/assets/images/paper-53-pebbles-base.jpg)](/assets/images/paper-53-pebbles-base-lg.jpg)\n[![Screenshot of pebble shapes with color variations](/assets/images/paper-53-pebbles-color.jpg)](/assets/images/paper-53-pebbles-color-lg.jpg)\n{% endfigure %}\n\nUsing the pencil tool, draw in shadow lines along the bottom of each rock paying attention to where light is positioned. If the light is on the left, apply a shadow line to the bottom and right edges. If the light is coming from the right, add your shadows to the left. A reference photo will help you accurately determine their placement.\n\n![Screenshot of rock shadows in pencil](/assets/images/paper-53-pebbles-shadows.jpg)\n\n### Harmonizing the rocks\n\nTo harmonize the rock's color I'll apply a layer or two of light gray (or variation of the base) over them all. This helps tie the shadow, highlight, and base colors together by tinting them.\n\n![Screenshot of harmonizing color](/assets/images/paper-53-pebbles-highlights.jpg)\n\nDepending on the color of this *harmonizing layer*, the highlights and shadows from before may have flattened out. To counter this, feel free to freshen them up using the pencil tool and color mixes from before.\n\n---\n\n## Variations on a theme\n\nUsing all of these techniques I was able to create a variety of backdrops for the portraits in my [PaperFaces Project]({% post_url /notes/2012-08-31-paperfaces-ipad-portrait-project %}). Below are a few finished pieces to show what is possible just by varying the color and composition.\n\n<ul class=\"gallery-thumbnails\">\n  <li><a href=\"{% post_url /paperfaces/2013-10-16-rob-jayne-portrait %}\"><img src=\"/assets/images/paperfaces-rob-jayne-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-02-06-padulantonio-portrait %}\"><img src=\"/assets/images/paperfaces-padulantonio-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-06-17-idpro-portrait %}\"><img src=\"/assets/images/paperfaces-idpro-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-09-17-imhobson-portrait %}\"><img src=\"/assets/images/paperfaces-imhobson-twitter-150.jpg\" alt=\"thumb\" /></a></li>  \n  <li><a href=\"{% post_url /paperfaces/2013-10-28-thebrendanbrown-portrait %}\"><img src=\"/assets/images/paperfaces-thebrendanbrown-twitter-150.jpg\" alt=\"thumb\" /></a></li>  \n  <li><a href=\"{% post_url /paperfaces/2013-10-28-annekoehler-portrait %}\"><img src=\"/assets/images/paperfaces-annekoehler-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-09-09-seanblezard-portrait %}\"><img src=\"/assets/images/paperfaces-seanblezard-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-08-02-thatmiddleway-portrait %}\"><img src=\"/assets/images/paperfaces-thatmiddleway-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-08-22-talksinmath-portrait %}\"><img src=\"/assets/images/paperfaces-talksinmath-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-02-06-rt44man-portrait %}\"><img src=\"/assets/images/paperfaces-rt44man-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-09-30-chappers-ma-portrait %}\"><img src=\"/assets/images/paperfaces-chappers-ma-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n  <li><a href=\"{% post_url /paperfaces/2013-09-03-andrewbrewer-portrait %}\"><img src=\"/assets/images/paperfaces-andrewbrewer-twitter-150.jpg\" alt=\"thumb\" /></a></li>\n</ul>\n\n---\n\nIn the next part I'll share all of my skin tone cheat sheets that serve as a starting point for my PaperFaces portraits. Learn how I use shape, color, and the watercolor brush to enhance the realism of a portrait with little effort.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2013-12-18-pogo-connect-sensitivity.md",
    "content": "---\ntitle: \"Pogo Connect stylus sensitivity fix\"\nexcerpt: \"How to adjust the pressure sensitivity of a Pogo Connect's tip with firmware v1.1.0.\"\nlast_modified_at: 2018-11-06T11:59:22-05:00\ncategories: [mastering-paper]\ntags: [Pogo Connect, Paper for iOS, Apple]\ncomments_locked: true\n---\n\nAbout a month ago I received a replacement [Pogo Connect Smart Pen]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) due to a defect that caused it to stop working. Using this replacement for a few days it was clear to me that something was different about this newer model.\n\nI use Paper by FiftyThree almost exclusively for drawing with the occasional Procreate experiment. When using either app I noticed that the sensitivity of the Pogo's tip seemed off. To get the full range of stroke sizes I now had to press extremely hard to register a wide stroke (see screenshot below), which really started to screw with how I draw.\n\n![Calibrated Pogo Connect line comparison](/assets/images/pogo-connect-sensitivity-lines.jpg)\n\nIsolating the cause is hard because so many factors had changed around the same time.\n\n* Apple released iOS 7, a major rewrite and update to the iPad's operating system.\n* TenOne Design updated the Pogo Connect's firmware to 1.1.0 --- needed for some of the [new tips](http://tenonedesign.com/connect.php) they recently released.\n* Design changes were made to the Pogo Connect to reinforce the internals and tip.\n\nFrom my tests it seems to be related to the 1.1.0 firmware or the extra solder being used to keep the tip from busting off. Older Pogo's with the 1.0.6 firmware worked just fine with iOS 7 and updated apps.\n\n## But how do you fix it?\n\nTo begin, open **Paper by FiftyThree**[^pogo-paper] or your Pogo Connect supported app of choice, and press the button on the stylus to establish a connection.\n\n[^pogo-paper]: As of version 2.5 FiftyThree has dropped support for the Pogo Connect Smart Pen.\n\nNext you'll need to open (or download) the free [**Pogo Connect app**](https://itunes.apple.com/us/app/pogo-connect/id566688179?mt=8&at=11l5Vp&ct=website). With it you can do fun stuff like locate your Pogo if it's lost somewhere in your house, update the firmware, rename your Pogo, draw, or adjust the tip's pressure sensitivity.\n\n![Connected](/assets/images/pogo-connect-app-connecting.jpg)\n\nUpon opening the app you should notice it trying to connect to the stylus. When that completes, tap the **Configuration** tab at the very bottom to customize the stylus to your liking. The two settings I altered to make it behave how it used to were **Locator Beacon** and **Pressure Amount**.\n\n{% figure caption:\"I turned off the Locator Beacon, set Pressure Amount to +6, and selected the R3 tip to profile.\" %}\n![Pogo Connect app settings screen](/assets/images/pogo-connect-app-settings.jpg)\n{% endfigure %}\n\nAfter making these changes you can doodle around in the space below to verify the sensitivity settings are to you liking. You can then switch back to Paper and the new settings should be noticeable in the app.\n\n![Pogo Connect app doodle test](/assets/images/pogo-connect-app-doodle.jpg)\n\n{% notice %}\n#### ProTip: sensitivity settings\n\nAny sensitivity settings you made in the Pogo Connect app don't appear to \"stick\" if the apps go to sleep or you lose a connection with the stylus. Following these steps seems to work at restoring them when using Paper by FiftyThree:\n\n1. Unscrew the cap on the Pogo Connect and take out the battery.\n2. Wait a few seconds and then place the battery back in and screw the top on to power cycle the Pogo.\n3. Reconnect the stylus to Paper. You may have to force quit[^force-quit] the app if it doesn't connect.\n4. After establishing a connection reopen the Pogo Connect app, wait for it to connect to the stylus, and then tap the **Configuration** tab again.\n5. Check that the **Pressure Amount** slider is set properly and make a few test strokes in the space below to verify it is receiving input from the tip.\n6. Switch back to Paper and you're good to go...for now.\n{% endnotice %}\n\n[^force-quit]: To force quit an app press the home button twice in rapid succession. Doing so will bring up a screen showing your recently used apps. Swipe left or right to find the app you want to quit and then swipe it up to remove it from view.\n\nIt's sort of a pain having to open another app each time I sit down to work on an illustration, but what can you do? I'm not entirely sure why the sensitivity settings don't persist when the stylus or app goes to sleep.\n\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-01-13-contour-drawing.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: contour line drawing\"\nexcerpt: \"How to use blind contour line drawing and the iPad app Paper for iOS, to improve hand eye coordination and observation skills.\"\nlast_modified_at: 2018-11-06T11:59:47-05:00\nimage: \n  path: &image /assets/images/paper-53-contour-drawing-feature.jpg\n  width: 1920\n  height: 848\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\nOne of the first things I drew on my iPad with Paper by FiftyThree was a blind contour line drawing. It has always been an interest of mine and Paper's expressive ink tools are a great fit for the technique.\n\n## Drawing contour lines\n\nWorking in a loose and gestural manner is an excellent way to warm-up and sharpen your observation skills. I like to draw with the [fountain pen (draw)]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#fountain-pen) because it has a greater range than some of the other tools, but feel free to use the [ink pen (write)]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#ink-pen) or even the [pencil]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#pencil). I think you'll find this exercise to be very cathartic, especially when compared against the technical and time consuming nature of photo realistic drawing.\n\nThe ideal way to practice this technique is by drawing a *real* object (hands are good to start with) --- avoiding photographs if you can. To begin, fix your eyes on the subject in front of you. As your eyes track across the subject's shape, draw a slow continuous line in sync with what you are viewing. \n\n### Getting sensitive\n\nPay close attention to how the form's contour and shape relate to each other making sure to keep your stylus or finger firmly placed on the iPad's screen at all times. The line should remain solid and confident, this isn't an exercise in sketching or shading.\n\nWhen you observe a shadow or a dark division, move your stylus faster to produce a thicker line. For highlights and lighter areas move slowly to draw a thinner line.\n\n{% figure caption:\"I find drawing with a Pogo Connect allows for greater control over the line's weight.\" class:\"gallery-2-col\" %}\n[![blind contour drawing of a hand drawn with a Pogo Connect](/assets/images/paper-53-contour-hand-pogo.jpg)](/assets/images/paper-53-contour-hand-pogo-lg.jpg) [![blind contour drawing of a hand drawn with a Pencil by 53](/assets/images/paper-53-contour-hand-pencil.jpg)](/assets/images/paper-53-contour-hand-pencil-lg.jpg)\n{% endfigure %}\n\nProducing sensitive lines becomes infinitely easier with a [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) since you can varying their thickness by pressing harder. This added complexity isn't for everyone, but for someone with a background in the fine arts or illustration, it can feel more natural.  \n\n{% figure caption:\"Drawing a blind contour line drawing of my hand in real time.\" %}\n{% youtube OHpPRwXvVLQ %}\n{% endfigure %}\n\nI also find that it helps to think of this line as a piece of string --- pretending that I'm wrapping it around the object as I follow along with my stylus. Don't worry if your drawing ends up looking like a ball of yarn --- that's part of the charm. As the link between hand and eye builds, so will the accuracy of your lines.\n\n## Variations and enhancements\n\nThere's a world of possibilities to explore with this technique. For example, you can stick with black ink on white paper and add splashes of color with the [brush tool]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#watercolor-brush), emulate a scratch board drawing, or layer multiple lines on top of each other. \n\n### A splash of color\n\nWhen applying color to a contour line drawing start by looking for the shadows in your subject and brush those in first. If you work from the outside edge in, it is easier to fade your strokes using a sweeping motion. When done right this feathering of color can mimic the *wet on wet* look of traditional watercolors.\n\n![Blind contour drawing of a face](/assets/images/paper-53-contour-face-color.jpg)\n\nIf you're feeling overwhelmed by color, try working with just black and white. Limiting the selection simplifies the process and causes you to focus more on contour and line quality before tackling advanced color theory principles. I experienced the most learning by being limited to the 9 colors Paper originally shipped with. This led to many hours of mistakes and experimentation, ending with a higher understanding of how the tools and colors behaved.\n\n{% notice %}\n#### Paper paint brush techniques\n\nFor a refresher on watercolor brush techniques take a look at my set of [Mastering Paper Guides](/mastering-paper/). If you can get the hang of making [smooth continuous tones with the brush]({% post_url /mastering-paper/2014-09-16-watercolor-brush-update %}), there isn't much else you can't do with the app.\n{% endnotice %}\n\n### White on black\n\nAnother variation to try is drawing in white ink over a black background. To start you would select black from the palette and then drag it onto the canvas to fill it in. This color inversion gives the lines new qualities that closely resemble scratch board drawings.\n\n![Scratch board blind contour of a cat](/assets/images/paper-53-contour-cat-inverse.jpg)\n\n### Adding lines\n\nThere is no hard fast rule that says the drawing has to be made up of a single line. Breaking it up into multiple lines, made up of different colors and values can produce nice results. Just be mindful of the lines' starts and stops when switching tools or colors, you don't want to kill the free form nature of the drawing.\n\n![Multiple line blind contour](/assets/images/paper-53-contour-drawing-fashion-show.jpg)\n\n---\n\nIf you end up trying out this technique I'd love to see what you've created. Leave a link or attach an image of your work below in the comments.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-02-09-basics.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: back to the basics\"\nexcerpt: \"A refresher tutorial on Paper for iOS drawing and painting techniques, along with color theory principles for good measure.\"\nlast_modified_at: 2018-11-06T12:00:23-05:00\nimage: \n  path: &image /assets/images/paper-53-basics-feature.jpg\n  width: 1280\n  height: 500\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\ntoc: true\n---\n\nReading through my earlier guides I came to the realization that I glossed over many basic drawing and painting techniques. Since I refer to the same techniques over and over again it would probably be helpful if I actually explained them. So here is my attempt at remedying that.\n\n## Pencil techniques\n\nI once described Paper's pencil tool as *versatile and perfect in almost any situation*. When used in conjunction with a [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) or [FiftyThree's Pencil stylus]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}), those sentiments ring even truer. So what exactly can you do with the tool?\n\n### Painting with Pencil\n\nLearning how to produce a continuous tone with the pencil tool is a worthwhile endeavor that I encourage you to practice. Once mastered you will have the skill needed to fade values into one another and model forms three dimensionally.\n\nA couple of points to keep in mind for creating an even tone.\n\n1. Work in one direction moving parallel (example: up/down, left/right).\n2. Don't be tempted to overwork and area --- keep moving at a steady pace.\n3. If you are using a stylus with a sensitive tip (e.g. a Pogo Connect), don't vary the amount of pressure you apply --- keep it constant and light unless you're trying to fade the tone.\n\n{% figure caption:\"Examples of shading using the pencil tool\" %}\n![Pencil shading samples](/assets/images/paper-53-pencil-shading-samples.jpg)\n{% endfigure %}\n\nOnce you've gotten the hang of producing a range of smooth values, it can be fun to introduce additional colors to the mix. Colors can be dry blended by overlapping pencil strokes directly on canvas, giving the impression that they've been mixed. \n\n{% notice %}\n#### ProTip: dry mixing\n\nAvoid overlapping one color with the other too much. Doing so will kill the translucency of the pencil strokes and any mixing that might have occurred.\n{% endnotice %}\n\n{% figure caption:\"Dry mixing colored pencils\" %}\n![Colored pencil mixes](/assets/images/paper-53-colored-pencil-mixes.jpg)\n{% endfigure %}\n\n## Ink techniques\n\nOut of the two ink tools that Paper comes with, the [pen]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#ink-pen) (or *Write* as FiftyThree calls it) is much easier to produce consistent results with. Stroke speed and pressure do little to modify the line quality which allows you to focus more on accuracy and placement. The [fountain pen]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#fountain-pen) on the other hand can make drawing a line without weight fluctuations incredibly challenging --- as shown below.\n\n{% figure caption:\"Comparing ink tools and the lines they make\" %}\n![Comparing straight lines made with the ink tools](/assets/images/paper-53-ink-tools-comparison.jpg)\n{% endfigure %}\n\nBy all means use whatever tool you're most comfortable with. If you're new to drawing on an iPad and just want to practice the following techniques, do yourself a solid and stick with the ink pen.\n\nThere are many techniques for suggesting light and shadow when drawing with ink but they all follow the same general principle. *Draw marks* where there are shadows, and *leave the canvas blank* where there are highlights.\n\n### Parallel hatching\n\nAs the name implies, the lines you will be making should run parallel to each other. These lines can be vertical, horizontal, or at an angle --- pick one and stick with it throughout the drawing. By drawing lines closer together they will appear to blend and create the illusion of being darker.\n\n{% figure caption:\"Examples of parallel hatching\" %}\n![Parallel hatching examples](/assets/images/paper-53-parallel-ink-lines.jpg)\n{% endfigure %}\n\nAnother way to modify the overall tone created by these lines is to vary their thickness. This can be achieved by using the fountain pen and drawing thicker lines by pressing harder (if you use a Pogo Connect stylus) or making quick swipes (if you're using a normal stylus or your finger).\n\n{% figure caption:\"Varying the line width using the fountain pen\" %}\n![Parallel hatching thicker line example](/assets/images/paper-53-parallel-ink-lines-vary.jpg)\n{% endfigure %}\n\n### Contour hatching\n\nIf you're feeling confident and have honed your powers of observation by drawing [blind contours]({% post_url /mastering-paper/2014-01-13-contour-drawing %}), you should be all set for contour hatching. Instead of making straight marks like we did with parallel hatching, you will draw lines that follow the curved contours of your subject.\n\n{% figure caption:\"Examples of contour hatching\" %}\n![Contour hatching examples](/assets/images/paper-53-ink-contour-hatching.jpg)\n{% endfigure %}\n\nPersonally I don't often have the patience required to create an accurate drawing using this technique. When done well contour hatching will enhance the form of your subject and make it appear more three dimensional.\n\n### Cross hatching\n\nCross hatching is exactly what you'd expect, hatch marks that cross one another. It's an effective way to quickly darken or *shade* a subject. I like to use the parallel hatching technique and build on that by crossing the lines at a slight angle. Contour lines can also be crossed for more life like results.\n\n{% figure caption:\"Examples of cross hatching\" %}\n![Cross hatching examples](/assets/images/paper-53-ink-cross-hatching.jpg)\n{% endfigure %}\n\n### Stippling\n\nInstead of using lines to create tone and texture, you can use small marks. Much like the hatching techniques described above you vary the tone by increasing the density of these marks --- the higher the concentration the darker it will appear.\n\n{% figure caption:\"Examples of stippling techniques\" %}\n![Stippling examples](/assets/images/paper-53-ink-stippling.jpg)\n{% endfigure %}\n\nThe placement of these marks can be as expressive or mathematically as you want. I prefer to be free and loose, but don't let that limit what feels right to you. Stippling marks can be anything you want --- short ticks, dots, crosses, circles. And they can even be combined with hatching to add detail and enhance the effect.\n\n{% notice %}\n#### ProTip: hatching --- not just for inking\n\nMost of the ink techniques above can be adapted to the pencil tool and used to shade and create gradations of tone --- specifically parallel, contour, and cross hatching.\n{% endnotice %}\n\n### Ink blobs and drips\n\nUsing both ink pens and the pencil you can simulate ink splatter, blobs, and dribs. The idea here is to recreate those happy accidents in a natural and random way. To start create a grouping of small circles and dots using the fountain pen.\n\n{% figure caption:\"Creating ink blobs, splatter, and drips\" class:\"gallery-2-col\" %}\n![Ink circles and a few dots](/assets/images/paper-53-ink-blobs.jpg)\n![Adding variation to the circles](/assets/images/paper-53-ink-blobs-irregular.jpg)\n{% endfigure %}\n\nTo make these shapes more irregular, zoom in and distort their shape by adding bumps and points along the edges. You don't have to overdo this step --- small variations here and there will do the trick.\n\n{% figure caption:\"Adding detail to ink blobs\" %}\n![Adding detail to ink blobs](/assets/images/paper-53-ink-blobs-detail.jpg)\n{% endfigure %}\n\nApplying a few shadows and highlights with the pencil tool can make these shapes pop off the canvas. Draw a few dark strokes on one side of the blob, and then using a light color draw a highlight on the opposite side. Depending on how thick of a blob you are going for you may need to add a cast shadow using the pencil or watercolor brush filled with a light gray.\n\n{% figure caption:\"Ink splatter variations\" %}\n![Adding shadows and highlights to blobs](/assets/images/paper-53-ink-blobs-variation.jpg)\n{% endfigure %}\n\n## Watercolor brush techniques\n\nI'm going to go ahead and assume you've already read my [Paper by 53 Introduction and Tool Guide]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#watercolor-brush), where I explain how the brush works and some of its nuances. With this understanding the following four techniques should make more sense. \n\n### Painting smooth\n\nThe question that hits my inbox the most is \"how do you paint so smoothly?\" Well here's my secret. Paint a **continuous stroke**, **without lifting** your finger or stylus. If you lift and dab an area multiple times it will darken and turn bumpy --- don't do that!\n\n{% figure caption:\"A choppy painted shape vs. one painted smoothly\" %}\n![Choppy and smoothly painted shapes](/assets/images/paper-53-choppy-smooth-paint.jpg)\n{% endfigure %}\n\nThe other important variable to consider is moving your finger (or stylus) across the screen at a slow pace. If you rub in a circle motion on an area that is light it will eventually darken to its maximum point. As long as you **don't lift** as you circle over these lighter spots, everything will even out.\n\n{% figure caption:\"Here's how I paint a shape smoothly.\" %}\n{% youtube AjJVrFFaCck %}\n{% endfigure %}\n\n### Feathering edges\n\nReliably producing a painted edge that is soft and blurry becomes important when blending shapes into each other. To achieve this effect you need to gradually increase the speed of your stroke as you approach the edge you want to feather. \n\n{% figure caption:\"Feathering an edge with the watercolor brush\" %}\n{% youtube RrFlav38uZw %}\n{% endfigure %}\n\nA wet-on-wet effect can be simulated by feathering brush strokes into each other. Getting the perfect fade can be tricky, so don't be afraid to rewind and trying again. *I almost never get it right the first time.*\n\n{% figure caption:\"Shapes blended into each other by feathering the edges\" %}\n![Blended shapes](/assets/images/paper-53-paint-feathered-colors.jpg)\n{% endfigure %}\n\n### Lightening with white\n\nThe watercolor brush has the unique ability of lightening previously painted or drawn areas when filled with white. This can be an effective way of pulling highlights out of your subject or to erase mistakes. \n\n{% figure caption:\"Various tints made by mixing colors with white\" %}\n![Range of white tints](/assets/images/paper-53-paint-white-range.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: paint with tints\n\nLightening with colors tinted[^tint] with white often yield better results and are easier to control than a solid white.\n{% endnotice %}\n\n[^tint]: Adding white to a color raises it to a tint or a *pastel* color and increases it's saturation some --- adjust accordingly to keep harmony with your color palette.\n\n{% figure caption:\"Lightening an area with white\" %}\n![Lightening an area with white](/assets/images/paper-53-paint-white-lightening.jpg)\n{% endfigure %}\n\nWhite paint behaves slightly different from the other colors available in the mixer and default palettes. Much like painting with pure black it fills in quickly. Which means if you use it to paint, you have to move fast or risk completely covering up anything you paint over with white.\n\n{% notice %}\n#### ProTip: dab fast\n\nQuick, short strokes in a dabbing motion work great for lightening an area gradually. \n{% endnotice %}\n\n### Glazing\n\nWhen painting with the brush you are essentially spreading layers of transparent paint (or a glaze[^glazing]) on top of each other. These glazes don't actually mix with one another, but because they are translucent, colors can appear to combine when layered. Glazes also have the benefit of increasing the depth and brightness (luminosity) of a color with each successive layer.\n\n[^glazing]: Glazing is a watercolor technique that uses a thin, transparent pigment applied over dry existing washes. Its purpose is to adjust the color and tone of the underlying wash.\n\n{% figure caption:\"Layering glazes makes for a richer and more deep color\" %}\n![Glazes created with the watercolor brush](/assets/images/paper-53-watercolor-layers.jpg)\n{% endfigure %}\n\nI like to think of glazes as my *color harmonizers* that tint everything with a similar hue. A great way to tie a piece together if your colors aren't quite working together.\n\n{% figure caption:\"Applying a glaze to harmonize a color palette\" %}\n![Glaze harmonizing before image](/assets/images/paper-53-paint-harmony-1.jpg)\n![Glaze harmonizing after image](/assets/images/paper-53-paint-harmony-2.jpg)\n{% endfigure %}\n\n### Underpainting\n\nIf glazes are applied on top of a painting or drawing, underpaintings are the layers applied below. They are most often used to pre-tone the canvas by removing white from it. The color(s) you choose can have a profound effect on digital pigments and strokes applied on top of them.\n\n{% figure caption:\"Naked canvas on the left, pre-toned on the right to increase vibrancy.\" %}\n![Red underpainting with green tree comparison](/assets/images/paper-53-red-underpainting-foliage.jpg)\n{% endfigure %}\n\nFor example, contrasting colors can create some vibrancy in the scene. A lush landscape filled with a cool sky and green trees, pre-toned with a reddish glaze will cause the space around the leaves to shine through. Much more than if the canvas was left white.\n\nOr you can tone the canvas with the composition's dominant color. When doing detail work you won't have to worrying about covering up the bits of white canvas that show through. The background will roughly match what you are painting as your main subject, saving you precious time.\n\n{% figure caption:\"Working out the shapes and values of a composition before adding detail\" %}\n![Blocking out shapes with watercolor](/assets/images/paper-53-underpainting-value-shapes.jpg)\n{% endfigure %}\n\nAn underpainting layer can also be used to establish the correct values and confirm the composition of your subject. Think of it as *sketching* with the brush, but instead of making contour lines you are blocking out rough shapes of value to capture your subject.\n\n## Color theory basics\n\n### Primary colors\n\nThinking back to elementary school you probably heard the term **primary color** thrown around. The idea of a primary color is that it should be possible to mix every other color out of these three. Traditionally these three primary colors have been red, yellow, and blue.\n\nNow I wouldn't go as far as suggesting you mix primary colors on canvas[^on-canvas] to produce secondary and tertiary colors, but it's worth understanding how they're made.\n\n[^on-canvas]: Visually mixing colors directly on canvas can be fun, but the results aren't always the best. I suggest using the Color Mixer instead since you'll achieve more vibrant hues.\n\n{% figure caption:\"Traditional color wheel\" %}\n  <img src=\"/assets/images/paper-53-traditional-color-wheel.jpg\" alt=\"Traditional color wheel\">\n\n{% endfigure %}\n\n### Complementary colors and grays\n\nOn the traditional color wheel complementary colors are across from each other (red and green, blue and orange, yellow and violet). When complements are mixed together, they should result in a neutral gray.\n\n{% figure caption:\"As you can see, in Paper complementary colors that are mixed on canvas don't exactly turn to a neutral gray.\" %}\n![Mixing complementary colors together](/assets/images/paper-53-layering-complements.jpg)\n{% endfigure %}\n\nSince mixing complements visually on canvas doesn't result in a neutral gray in Paper, we can mix them another way. The results aren't quite the same as if you were mixing oil paints on a real palette, but they get the job done. Here's how to do it:\n\n1. Select the two complementary colors you wish to mix and put one in the Color Mixer by dragging it over, and the other in one of your open palette slots.\n2. To neutralize them, do one full rotation of the Color Mixer with both complementary colors selected.\n3. Finally tap the color in the Mixer and slide the saturation (middle bar) down somewhere between 10--20% to dull it.\n\n{% figure caption:\"Neutralizing complementary colors using the Color Mixer\" class:\"gallery-3-col\" %}\n![Mixing a neutral gray step 1](/assets/images/paper-53-mixing-complementary-gray-1.jpg)\n![Mixing a neutral gray step 2](/assets/images/paper-53-mixing-complementary-gray-2.jpg)\n![Mixing a neutral gray step 3](/assets/images/paper-53-mixing-complementary-gray-3.jpg)\n{% endfigure %}\n\nI've found that instead of mixing grays from white and black, it is more pleasing to mix them from pairs of complementary colors. This gives you a limitless amount of \"grays\" to pull from for your palettes.\n\n{% figure caption:\"Range of grays made by mixing complementary colors and desaturating them\" %}\n![Range of grays from mixing complements](/assets/images/paper-53-paint-range-grays.jpg)\n{% endfigure %}\n\nMixing complements also helps to unify your composition's palette. Using these \"neutral grays\" as glazes and layering them on top of each other is a useful way for making shadows.\n\n### Atmospheric perspective\n\nAtmospheric perspective is the phenomenon where intense foreground colors gradually change until they match the sky. As you travel back objects generally lose saturation in color, becoming grayer. For example warm colors like red and orange will dull and cool off.\n\nThe amount of contrast in the subject also changes. The illuminated and shadowed sides of an object lower in contrast and flatten as you move further into the background. These objects also begin to loss clarity and will blur and become fuzzy --- a perfect subject for the [Blend tool]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}).\n\n{% figure caption:\"An example of atmospheric perspective in this mountain background\" %}\n![Atmospheric perspective example](/assets/images/paper-53-atmospheric-perspective.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: color temperature\n\nIf you learn one thing about working with color make it this: *Warm colors advance, and cool colors recede.* The reverse is also true but much more rare in nature.\n{% endnotice %}\n\n---\n\nWell there you have it. With this crash course in pencil shading, ink techniques, watercolor glazes, and the basics of color theory my other guides should hopefully make more sense now. And if they don't just hit up the comments below with questions and feedback.\n\nOh, and I just finished writing a first draft of the next Mastering Paper by FiftyThree installment all about painting skin and faces. Should be ready just as soon as I finish illustrating it in the coming week...\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-04-21-drawing-faces.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: drawing portraits and faces\"\nexcerpt: \"Advanced techniques for drawing and painting portraits using the iPad app Paper for iOS.\"\nlast_modified_at: 2018-11-06T12:00:40-05:00\nimage: \n  path: &image /assets/images/paper-53-faces-feature.jpg\n  width: 1280\n  height: 500\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, portrait, Apple]\ntoc: true\n---\n\nPortraiture is at the heart of what I use Paper by FiftyThree to create with. After drawing over 700 faces some might think it would be easy for me to share my process and techniques --- they would be wrong. After struggling writing this guide for the last month, I think I finally shaped it in a way that makes sense.\n\nLike the other parts of my [Mastering Paper for iOS Guide](/mastering-paper/), this one will explain my techniques and how I use them. My drawing style has evolved from the abstract to the more realistic since starting the [PaperFaces]({% post_url /notes/2012-08-31-paperfaces-ipad-portrait-project %}) portrait project almost 2 years ago. It only seems fitting to organize the guide in a way that mimics this same evolution.\n\n[![PaperFaces evolution](/assets/images/paper-53-face-evolution.jpg)](/assets/images/paper-53-face-evolution-lg.jpg)\n\nWhat this guide won't be is a lesson in human anatomy. You'd be better served [reading a book](http://www.amazon.com/gp/product/0399507914/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=0399507914&linkCode=as2&tag=mademist-20) on the matter instead of me paraphrasing it for you. What I will do is explain the basics of drawing a face with Paper and how to get the most out of the app.\n\n## Color palettes for skin\n\nBefore getting into any specific technique, I'd like to share my favorite palette. With this set of seven custom mixes I can pretty much reproduce any skin tone I want. Below I've painted a color wheel with each to show how they appear when layered, darkened, and lightened. Tapping the circles below will open into larger views allowing you to save[^saving-images] a copy to use as reference.\n\n[^saving-images]: If viewing on a mobile device like an iPad or iPhone, tap and hold on the image to save to your Camera Roll. On desktop browsers, right click and select *Save image as…*\n\n<figure>\n  <div class=\"palette\">\n    <div class=\"palette__row\">\n      <a href=\"/assets/images/paper-53-skin-color-1.jpg\"><img class=\"palette__swatch\" src=\"/assets/images/paper-53-skin-swatch-1.png\" alt=\"skin swatch 1\"></a>\n      <a href=\"/assets/images/paper-53-skin-color-2.jpg\"><img class=\"palette__swatch\" src=\"/assets/images/paper-53-skin-swatch-2.png\" alt=\"skin swatch 2\"></a>\n      <a href=\"/assets/images/paper-53-skin-color-3.jpg\"><img class=\"palette__swatch\" src=\"/assets/images/paper-53-skin-swatch-3.png\" alt=\"skin swatch 3\"></a>\n    </div>\n    <div class=\"palette__row\">\n      <a href=\"/assets/images/paper-53-skin-color-4.jpg\"><img class=\"palette__swatch\" src=\"/assets/images/paper-53-skin-swatch-4.png\" alt=\"skin swatch 4\"></a>\n      <a href=\"/assets/images/paper-53-skin-color-5.jpg\"><img class=\"palette__swatch\" src=\"/assets/images/paper-53-skin-swatch-5.png\" alt=\"skin swatch 5\"></a>\n      <a href=\"/assets/images/paper-53-skin-color-6.jpg\"><img class=\"palette__swatch\" src=\"/assets/images/paper-53-skin-swatch-6.png\" alt=\"skin swatch 6\"></a>\n      <a href=\"/assets/images/paper-53-skin-color-7.jpg\"><img class=\"palette__swatch\" src=\"/assets/images/paper-53-skin-swatch-7.png\" alt=\"skin swatch 7\"></a>\n    </div>\n  </div>\n  <figcaption>Select the color you want to view and save.</figcaption>\n</figure>\n\nPaper by 53 currently doesn't have a way of exporting or sharing color palettes. To recreate these on your iPad you will need to follow these steps:\n\n1. Buy the Color Mixer tool if you haven't already.\n2. Tap the small circle within the Color Mixer and move the 3 sliders to match the color you are looking to copy.\n3. Tap the small circle again and drag it into a vacant spot in your palette to the right.\n4. Repeat the process for each color you wish to copy and use.\n\n{% notice %}\n#### ProTip: organize your color palettes\n\nYou can move colors in the palettes by dragging them around into an order that works for you. For example I group all my skin tone colors together for easier access.\n{% endnotice %}\n\n## Choosing colors\n\nIn my previous guide I went over a few [color theory basics]({% post_url /mastering-paper/2014-02-09-basics %}#color-theory-basics) that can help guide you to make more informed color selections. Building on top of those guidelines here are a few more that are specific to painting portraits.\n\nWhen I'm having trouble getting a mix just right I focus more on whether it is warm or cool and adjust accordingly. With regards to the face, you can roughly divide it into three sections. Lighting has an important role in this and variations will occur, but for the most part you can divide a face with fair complexion like so.\n\n### Forehead\n\nYour forehead is free of surface capillaries and muscles leaving it white or a golden yellow. Along the hairline you'll notice a darker tone that I like to use as a way of blending hair follicles into the scalp. But I'm getting ahead of myself, more on painting hair in a future guide.\n\n{% figure caption:\"Golden yellows and oranges are frequently used to glaze the forehead.\" class:\"gallery-2-col\" %}\n[![Colors used to paint a forehead](/assets/images/paper-53-face-forehead-glaze-1.jpg)](/assets/images/paper-53-face-forehead-glaze-1-lg.jpg) [![Applying more glazes to the forehead](/assets/images/paper-53-face-forehead-glaze-2.jpg)](/assets/images/paper-53-face-forehead-glaze-2-lg.jpg)\n{% endfigure %}\n\n### Mid-face (cheeks/ears/nose)\n\nTraveling down the face just below the eyes and above the mouth is an area comprised of capillaries filled with *blood*. All this blood causes the ears, nose, and cheeks to turn a reddish color. A simple thing like glazing cheeks with warm mixes of orange and red can liven a face up, especially in females.\n\n{% figure caption:\"A few glazes of pink or a dull red to liven up the cheeks, earlobes, and nose.\" %}\n[![Color used to paint cheeks and ears](/assets/images/paper-53-face-cheek-glaze.jpg)](/assets/images/paper-53-face-cheek-glaze-lg.jpg)\n{% endfigure %}\n\n### Chin\n\nThe third section of the face with a noticeable color tone is the area below the nose to the chin. In men this section tends to be a blue, green, or even gray in color. Depending on the amount of facial hair present this color will be more pronounced.\n\n{% figure caption:\"Dull greens and blues or grays work great for darkening facial hair and adding shadows beneath the chin.\" %}\n[![Colors used to paint facial hair](/assets/images/paper-53-face-facial-hair-glaze.jpg)](/assets/images/paper-53-face-facial-hair-glaze-lg.jpg)\n{% endfigure %}\n\nIf you remember back to my previous guide, green and red are complementary colors. One way of accentuating a color is by surrounding it with its complement. I use this trick often when painting female faces, when I want to call out their lips by painting the shadows with glazes of blue or green.\n\n{% figure caption:\"Surrounding the lips with a complimentary color can really make them pop. In this case I applied green around the edges to contrast against the reds.\" %}\n[![Colors used to enhance lips](/assets/images/paper-53-face-lips.jpg)](/assets/images/paper-53-face-lips-lg.jpg)\n{% endfigure %}\n\n## Painting skin\n\nTo some, the watercolor brush is magical while others find it extremely confusing and frustrating --- I completely understand that. To master the brush you have to be mindful of a few things:\n\n### Speed controls opacity\n\nThe brush produces a range of values by varying the speed at which they're painted. If you move your finger (or stylus) slowly across the iPad's screen, the mark will darken --- moving fast, the mark will fade into the canvas and appear lighter. \n\nSpeed is the single most important variable for creating smooth tones or glazes. The second is never lifting the tip off the screen until you've filled a shape.\n\n{% figure caption:\"Here's how I paint a shape smoothly.\" %}\n{% youtube AjJVrFFaCck %}\n{% endfigure %}\n\n{% notice %}\n#### ProTip: smoothening out splotches of color\n\nTo even out stubborn light spots, keep rubbing until they turn dark. You can't overwork an area as long as don't lift to make another stroke.\n{% endnotice %}\n\nNew to Paper or drawing in general? Make your life easier and work large, filling up the entire page. The smaller the composition the harder all this becomes since the brush has a fixed size. Well that's [not completely true]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}), but for those of you who don't use Bluetooth stylus like FiftyThree's Pencil or a Pogo Connect --- it is.\n\n{% notice %}\n#### Update: Paper 2.0\n\nPainting with the watercolor brush has been greatly improved in the new version of Paper by FiftyThree. [Learn all about the new brush tool]({% post_url /mastering-paper/2014-09-16-watercolor-brush-update %}) in my post that includes videos of it in action.\n{% endnotice %}\n\n### Whites to erase\n\nA *cheat* I used in my early Paper portraits was to omit facial features by not drawing them. I'd spend my time adding detail to the background elements instead of a person's face just because they were easier for me.\n\nTo paint in this style, start by lightly sketching out the figure to act as your guide. To simplify things I'm going to *pull a face* out of a bland background. I've found that it is much easier to drop in a background first, because you don't have to be as precise. It also helps reduce hard edges or gaps in color that may appear around the face's edge.\n\n{% figure caption:\"The color you choose to sketch with isn't super important, but a lighter one is much easier to cover-up.\" %}\n[![outline sketch of a face](/assets/images/paper-53-faceless-sketch.jpg)](/assets/images/paper-53-faceless-sketch-lg.jpg)\n{% endfigure %}\n\nWith your background dropped in, select the pencil tool, a light color, and sketch out the general outline of the figure. Drawing [sensitive lines]({% post_url /mastering-paper/2014-01-13-contour-drawing %}) will convey more meaning in your drawing and guide how you paint. For example, I place heavier lines in my sketches to show shadows or areas I will want to darken with watercolor later.\n\n{% notice %}\n#### ProTip: skin color selection\n\nWhen choosing a pencil color pick a flesh tone that is predominant in the face. This will make it easier to hide the lines later when you paint with white.\n{% endnotice %}\n\nWith a rough sketch complete, it is time to put those skin tone palettes from before to work. For this example I'm going to choose the light red mix to start with. If you were to paint with this in its current state it wouldn't be effective at *pulling the face* out of the background. What we need to do is mix white into it to make it opaque[^opaque] and act like an eraser.\n\n[^opaque]: Not transparent or translucent; impenetrable to light; not allowing light to pass through.\n\n{% figure caption:\"If you add just the right amount of white to a color it will allow you to lighten anything you paint over. This is how I **pull a face** out of the background.\" class:\"gallery-2-col\" %}\n[![red mix not lightening](/assets/images/paper-53-faceless-red-mix-1.jpg)](/assets/images/paper-53-faceless-red-mix-1-lg.jpg)\n[![red mix lightening](/assets/images/paper-53-faceless-red-mix-2.jpg)](/assets/images/paper-53-faceless-red-mix-2-lg.jpg)\n{% endfigure %}\n\nOf course you could just use the eraser tool to remove the background, but it will produce a harsher edge --- which I like to avoid. Used as a lightener, the brush gives greater control over the amount of background you remove.\n\n### Building the face with glazes\n\nWith the face's shape *pulled out from the background*, we can start the process of rebuilding it. Referencing my custom skin tone colors, choose the light red again and apply an even glaze over the entire face. Don't worry if you overlap into the background, we'll fix that later.\n\n{% figure caption:\"With this abstract style don't try to paint everything. Focus on a few heavy shadows on the side of the face or eye sockets to give the impression of a face.\" %}\n[![watercolor face layer 1](/assets/images/paper-53-faceless-red-glaze.jpg)](/assets/images/paper-53-faceless-red-glaze-lg.jpg)\n{% endfigure %}\n\nIf you decide to use your own color mix I suggest one that is light --- the less intense the color the better. Take your time to carefully observe the shapes you are painting. Drawing is as much of seeing as it is putting a mark on the canvas.\n\nDon't be afraid to [Rewind]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#rewind) a stroke and redo it. I've been known to repeat this action over 20 times until I feel a stroke captures the form's essence. Be deliberate with your brush movements and try to convey more with less (if that makes any sort of sense).\n\nWith practice you'll become more confident in the shapes you are painting. I would urge you to avoid brushing with small choppy strokes to keep the skin smooth --- unless you intend for it to look textured.\n\n{% figure caption:\"Try to avoid this at all costs. You're looking to produce smooth tones by making long sweeping strokes.\" %}\n[![watercolor textured skin](/assets/images/paper-53-faceless-textured.jpg)](/assets/images/paper-53-faceless-textured-lg.jpg)\n{% endfigure %}\n\n### Adding shadows\n\nA complimentary color works great as a shadow, especially when dialing down the lightness of your glazes. A heavy and more opaque color is harder to control because it will darken painted areas way too fast.\n\n{% figure caption:\"Range of grays made by mixing complementary colors and de-saturating them.\" %}\n![Range of grays from mixing complements](/assets/images/paper-53-paint-range-grays.jpg)\n{% endfigure %}\n\nA variation of gray can also be effective for darkening areas. The important consideration here is to match the temperature of the gray to the area you want to darken. Tint your gray with reds and oranges for warmer tones, and blues and greens for cools.\n\n{% notice %}\n#### ProTip: paint inwards\n\nWork your glazes from the outside in, moving faster to produce soft transitions --- **speed and direction matter!**\n{% endnotice %}\n\n{% figure caption:\"To build up a realistic skin tone it may take numerous layers of varying colors. It's not uncommon to mix in blue and green.\" class:\"gallery-2-col\" %}\n[![painting shadows on a face](/assets/images/paper-53-faceless-shadows-1.jpg)](/assets/images/paper-53-faceless-shadows-1-lg.jpg)\n[![painting shadows on a face](/assets/images/paper-53-faceless-shadows-2.jpg)](/assets/images/paper-53-faceless-shadows-2-lg.jpg)\n{% endfigure %}\n\n### Cleanup and refinement\n\nDepending on how accurate of a painter you are, your glazes may have bled outside of the face and into the background. To clean up these rough edges, use the pencil tool mixed with a color that matches the background. Then use it to cover up blotches or stray marks by drawing over them. Variations to the color may be necessary if your background is more complex than a single tone.\n\n{% figure caption:\"Depending on the complexity of the background you may need to adjust the pencil's color as you cleanup the face's edge.\" class:\"gallery-2-col\" %}\n[![pencil edge cleanup](/assets/images/paper-53-faceless-clean-edge.jpg)](/assets/images/paper-53-faceless-clean-edge-lg.jpg)\n[![finished face with edges refined](/assets/images/paper-53-faceless-finished.jpg)](/assets/images/paper-53-faceless-finished-lg.jpg)\n{% endfigure %}\n\nDon't be afraid to use one of the ink pens for cleanup instead. For stylistic reasons I prefer the softness of a pencil, but either tool is acceptable.\n\n{% figure caption:\"A quick video example of all the techniques in real time to show the basic workflow.\" %}\n{% youtube cxeaeQAtIxQ %}\n{% endfigure %}\n\n## Creating realism with colored pencils\n\nAfter almost two years of drawing and painting hundreds of blank faces, I had a break through when I started applying pencil strokes on top of my glazes. I found that this extra layer of texture added depth and complexity to the drawings which ultimately made them appear more realistic.\n\nLike before we start with a loose sketch of the subject to rough out our composition. The pencil's color doesn't matter too much, just make it something light and easy to cover up.\n\n{% figure caption:\"The face can be divided in half horizontally and vertically to help with placing features. **Note:** Depending on the orientation of the face these divisions may not be as obvious as a face viewed directly in front.\" %}\n[![loose pencil sketch](/assets/images/paper-53-face-pencil-sketch.jpg)](/assets/images/paper-53-face-pencil-sketch-lg.jpg)\n{% endfigure %}\n\nTo really capture an accurate likeness the placement of the eyes, nose, and mouth are very important. The use of lightly sketched guidelines across the face can help with their placement. While not true 100% of the time the width of the eyes can be used to accurately measure the distance between each of the face's features.\n\n**Generally Speaking:**\n\n1. Pupils are placed just above the center line.\n2. An average face is approximately five eyes wide.\n3. The bottom of the ears align with the bottom of the nose.\n\n### Refining the contours\n\nInstead of switching to the brush, we're going to stick with the pencil tool and begin refining the drawing. Color is going to play an important role in this step, if you're not comfortable with that yet, I suggest working in black and white.\n\nBouncing between the eraser and pencil tools, remove stray lines from the initial sketch and sharpen up lines. Build up tones as you work and avoid using black. Refer to the [face color guidelines](#choosing-colors) from earlier to help make smart color choices.\n\n{% figure caption:\"To remove the guidelines I either partially erase them or lighten the sketch by blending it with my finger.\" class:\"gallery-2-col\" %}\n[![partially erasing guidelines](/assets/images/paper-53-face-erase-refine.jpg)](/assets/images/paper-53-face-erase-refine-lg.jpg)\n[![blending guidelines away](/assets/images/paper-53-face-erase-refine-blend.jpg)](/assets/images/paper-53-face-erase-refine-blend-lg.jpg)\n{% endfigure %}\n\nWith the rough sketch cleaned up you want to begin darkening some contour lines. Start with the eyes first and focus your efforts on getting their shape as accurate as possible. A detailed eye will help draw the viewer in and can take emphasis off of the other features if you happen to screw them up.\n\nThe basic idea here is to sketch in all the dark spots around the eyes, nose, and mouth. If you're using my skin color palette from earlier you'll want to select one of the darks in the second row. \n\n{% figure caption:\"The areas you'll want to focus on first are the pupils, upper eyelids, nostrils, and the crevices found around the lips.\" class:\"gallery-2-col\" %}\n[![refining facial features](/assets/images/paper-53-face-contour-refine.jpg)](/assets/images/paper-53-face-contour-refine-lg.jpg)\n[![refining facial features](/assets/images/paper-53-face-contour-refine-2.jpg)](/assets/images/paper-53-face-contour-refine-2-lg.jpg)\n{% endfigure %}\n\n### Shaping skin with hatching\n\nOnce you've finished darkening and refining contour lines you'll want to begin shaping the skin. The primary way to do this is with [hatching techniques]({% post_url /mastering-paper/2014-02-09-basics %}/#parallel-hatching) and dry mixing colored pencils on the canvas.\n\n{% figure caption:\"Starting with the eyes again, apply subtle shadows around them using the pencil tool. I use a Pogo Connect stylus to make even lighter strokes, but it can be pulled off without one.\" %}\n[![hatching lightly around the eyes](/assets/images/paper-53-face-hatching.jpg)](/assets/images/paper-53-face-hatching-lg.jpg)\n{% endfigure %}\n\nThe idea is to build up tones from light to dark by overlapping pencil strokes and varying the distance between them. The amount of lines and the distance between them both effect how dark the tone will appear. I like to work from dark to light and use a combination of contour and cross-contour hatching to build up tones.\n\n{% figure caption:\"The red arrows indicate the pencil stroke directions I used to round the skin's shape.\" %}\n[![pencil stroke direction](/assets/images/paper-53-face-contour-hatching-direction.jpg)](/assets/images/paper-53-face-contour-hatching-direction-lg.jpg)\n{% endfigure %}\n\nI've said this before in my [Back to Basics guide]({% post_url /mastering-paper/2014-02-09-basics %}), but it's worth repeating. Be mindful of the direction of the strokes you are making when hatching to enhance the form. Observe how the skin bends and curves, and make pencil strokes that follow those same paths.\n\nDon't feel the need to *shade* all surfaces! Focus your attention on the darkest values and build up those gradations first. Keep in mind that we will be covering these pencil strokes with watercolor so don't go too dark. I suggest making your tones about 50% lighter than how they appear --- you can always darken things up later.\n\n{% notice %}\n#### ProTip: up your game with a fancy pressure sensitive stylus\n\nA Pogo Connect makes shading and using the pencil tool way easier. By varying the amount of pressure applied to the tip, you can make a darker line in a way that mimics a real pencil.\n{% endnotice %}\n\n{% figure caption:\"Pressing harder on the Pogo Connect's tip will darken a line.\" %}\n![pencil line](/assets/images/paper-53-pogo-connect-pencil-line.jpg)\n{% endfigure %}\n\nTo make the face appear more real you'll want to use a wide range of colors. By applying washes of color pencil on top of each other, you can build up the skin in a more believable way. Don't be afraid to dry mix blues and greens into pale oranges and tans.\n\n{% figure caption:\"Washes of colored pencil can be blended into one another by lightly overlapping. It is crucial that these tones are applied smoothly to create a more pleasing effect.\" %}\n[![dry mixing colored pencils](/assets/images/paper-53-face-pencil-dry-mixing.jpg)](/assets/images/paper-53-face-pencil-dry-mixing-lg.jpg)\n{% endfigure %}\n \n{% notice %}\n#### ProTip: one color at a time\n\nStick with one color and bounce around the face with it. It'll save you from constantly opening and closing the tool tray to select different colors.\n{% endnotice %}\n\nContinue hatching and coloring your way through the rest of the drawing. At this point you could call this a finished piece, but I'm going to take it a few steps further if you don't mind.\n\n### Building the face with glazes, again\n\nBy applying a thin layer or glaze of watercolor on top, this colored pencil drawing will take on new properties. The colors will intensify with each layer of glaze, and pull everything together.\n\n{% figure caption:\"Try to get your glaze color as close to white without it actually lightening the pencil strokes beneath. This will allow you to paint more layers without going too dark and ultimately produce better results.\" class:\"gallery-2-col\" %}\n[![glazing the face layer 1](/assets/images/paper-53-face-glaze-1.jpg)](/assets/images/paper-53-face-glaze-1-lg.jpg)\n[![glazing the face layer 2](/assets/images/paper-53-face-glaze-2.jpg)](/assets/images/paper-53-face-glaze-2-lg.jpg)\n{% endfigure %}\n\nA few well placed brush strokes will go a long way in achieving a realistic look. The steps for applying these glazes are almost identical to before. You won't be *erasing the face* here so you can forgo that step unless you're correcting mistakes or adding highlights.\n\n{% figure caption:\"Using the color zone basics from earlier, apply red glazes around the cheeks and greens around the neck or where shadows appear.\" class:\"gallery-2-col\" %}\n[![glazing the face layer 3](/assets/images/paper-53-face-glaze-3.jpg)](/assets/images/paper-53-face-glaze-3-lg.jpg)\n[![glazing the face layer 4](/assets/images/paper-53-face-glaze-4.jpg)](/assets/images/paper-53-face-glaze-4-lg.jpg)\n{% endfigure %}\n\nMany of the techniques used to *erase a face* from earlier also apply here. Variations of white can be used to apply highlights and lighten the skin. It can also be used to correct spots that you might have gotten too dark, but be careful not destroy the smooth tones.\n\n{% figure caption:\"When used sparingly the watercolor brush filled with white is great for larger highlights found on the forehead or cheekbones.\" %}\n[![lightening the face](/assets/images/paper-53-face-glaze-5.jpg)](/assets/images/paper-53-face-glaze-5-lg.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: use Blend to correct mistakes\n\nIf when using white you produce tones that are no longer smooth, use Blend to even them out. Don't go overboard with it because you can quickly make a face look unnatural.\n{% endnotice %}\n\nWith our glazes looking pretty good, now is the time to switch back to the pencil tool do some cleanup. I start by using black or another dark color to add contrast around the eyes or anywhere else that is looking flat.\n\n{% figure caption:\"To add dimension to the face apply pencil strokes on top of the watercolor glazes, following similar hatching patterns from before.\" %}\n[![adding detail to the face](/assets/images/paper-53-face-pencil-detail.jpg)](/assets/images/paper-53-face-pencil-detail-lg.jpg)\n{% endfigure %}\n\nDepending on the subject I'll often apply a layer of contour hatching on top of the glazes. I tend to do this more with males who have facial hair, to roughen things up and add texture. This is also a good time to apply any finishing touches like catch lights in the pupils or gloss on the lips.\n\n---\n\nMy plan for the next guide was to [reboot a hair tutorial]({% post_url /mastering-paper/2013-05-10-drawing-hair %}) I wrote a year ago, expanding on it to show more hair styles and facial hair techniques. But after finishing this lengthly tutorial it became clear to me there is still a lot I have to say with regards to #MadeWithPaper portrait techniques.\n\nSo how about this? Let me know in the comments below what you want to see next: **hair tutorials** or more portrait goodness like **how to draw realistic eyes, mouths, and more**.\n\n<ul class=\"gallery-thumbnails\">\n{% for post in site.categories.paperfaces limit:12 %}\n  <li>\n    <a href=\"{{ post.url }}\" title=\"{{ post.title }}\"><img src=\"{{ post.image.thumbnail }}\" alt=\"\"></a>\n  </li>\n{% endfor %}\n</ul>\n\nAnd if you're looking to further learn from some of the Paper techniques I use, check out my [PaperFaces Project]({% link _work/paperfaces.md %}) or [follow me on Twitter](https://twitter.com/mmistakes). I draw a new portrait Paper every day and make a point to include in process images to reveal my processes.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-07-03-moving-the-loupe.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: how zoom while painting\"\nlast_modified_at: 2018-11-06T12:01:20-05:00\nexcerpt: \"Learn how to reposition Paper's zoom loupe mid-stroke to help add detail to your drawings.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\nimage:\n  path: &image /assets/images/paper-53-zoom-loupe-feature.jpg\n  width: 1280\n  height: 727\n  feature: *image\ntwitter:\n  card: summary_large_image\ntoc: true\ncomments_locked: true\n---\n\nI'm a bit ashamed to admit that up until a few weeks ago I had no clue you could move Paper's zoom loupe simultaneously as you drew.\n\nMaybe this is something super obvious and I just missed it --- I'm willing to bet a few of you out there missed it to. If that's the case, help is on the way!\n\n{% notice %}\n#### Full screen zoom and grid indicator\n\nThe loupe shown below has been retired and replaced with a more traditional zoom tool in Paper v3. Pinching the screen now magnifies the entire canvas allowing for more room to work. As you magnify, a grid of dots appear on the screen to indicate how far you've zoomed in.\n{% endnotice %}\n\n## Why is this important?\n\nThe [1.6 update](http://news.fiftythree.com/post/79379441335/the-paper-ios-7-update-is-here-brighter-fresher) for **Paper by FiftyThree** introduced refinements to each of the tools and their behavior inside of the loupe. The tools now scale appropriately when in zoom --- giving you finer control over line weights. The ability to paint thin strokes without the use of a [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) stylus was now possible.\n\n{% figure caption:\"Drawing in the loupe with FiftyThree's Pencil stylus.\" %}\n![drawing in the loupe](/assets/images/paper-53-zoom-loupe-pencil-ev.jpg)\n{% endfigure %}\n\nAn important characteristic of the watercolor brush is its ability to [apply glazes]({% post_url /mastering-paper/2014-02-09-basics %}#glazing) on top of each other to build 3-dimensional forms. To pull off this effect, [smooth tones]({% post_url /mastering-paper/2014-02-09-basics %}#painting-smooth) are a must and the only way to paint them is by not lifting off the canvas until you've filled the shape.\n\n{% figure caption:\"Moving the loupe while glazing is necessary to cover larger shapes evenly.\" %}\n![glazing in the loupe](/assets/images/paper-53-zoom-glaze-face.jpg)\n{% endfigure %}\n\nI think you can see where I'm going with this. If you're painting a shape that falls outside of the Zoom loupe it becomes necessary to move it around. The problem is, if you begin painting and then try to move the loupe it won't budge. For it to move you need to interrupt your watercolor stroke to reposition it, which will leave you with a uneven glaze if you try to continue painting where you left off.\n\nI'm a heavy user of the watercolor brush so I had to sacrifice zooming in when painting large shapes because of this. Requiring extra time with the pencil to [clean up contours and mistakes]({% post_url /mastering-paper/2014-04-21-drawing-faces %}#refining-the-contours).\n\n## Moving the loupe\n\nSorry for the long winded exposition, but I think it helps contextualize why being able to simultaneously move the loupe with one hand and paint with the other is important. So without further ado here's how to do it.\n\n1. Pinch to zoom in and stretch the loupe to a size you're comfortable with.\n2. Place one finger on the edge of the black circle and **hold it on the screen**.\n3. Draw or paint as you normally would with your other hand.\n4. Move the loupe around as you paint.\n\n## Video demonstration\n\n{% figure caption:\"A video demonstrating how to use Zoom while painting a smooth glaze.\" %}\n{% youtube gpz8aPXwd18 %}\n{% endfigure %}\n\nThe key to making this work is placing your finger on the circle **before you begin** drawing or painting. If you lift your finger off of the loupe's edge and begin drawing, you won't be able to move it until you stop touching the iPad's screen.\n\n{% notice %}\n#### ProTip: two handed zoom --- only when you need it\n\nSave this two handed zoom technique for painting large shapes that require extra precision. It can be somewhat disorienting working this way and could cause you to lose perspective on the overall piece. Sometimes it's good to step back for a *larger* view.\n{% endnotice %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-07-06-grid-method.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: the grid method\"\nlast_modified_at: 2018-11-06T12:02:06-05:00\nexcerpt: \"How to use the grid method with Paper for iOS to create accurate line drawings and improve your work.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\nimage:\n  path: &image /assets/images/paper-53-grid-feature.jpg\n  width: 1280\n  height: 634\n  feature: *image\ntoc: true\n---\n\nA question I receive often is \"how do you create such accurate line drawings in your Paper portraits.\" The short answer is practice... about 1,460 hours of practice. The longer and more helpful answer is, there are several techniques I use to achieve life-like drawings --- one of which I'm going to share with you now.\n\n## Why use the grid method?\n\nIf you've ever taken a basic drawing class there's a good chance you were introduced to the **grid method**. Teachers use it as a way to strengthen observation skills and help overcome left brain roadblocks beginners often fight against. It may not be the ideal tool to use with **Paper by FiftyThree**, but for those who struggle with drawing it can build a solid foundation for you creations.\n\n## Drawing the grids\n\nDrawing grids is boring and tedious work that can easily add a few hours to prep time. A fact that I experienced when I first made the jump to drawing realistic portraits with Paper by FiftyThree. I'm not trying to scare you off from using this method, just be prepared to invest time into creating straight and evenly spaced lines. \n\n{% figure caption:\"A T-square, a stylus, and a straight-edge walked into a bar...\" %}\n![tools for making grids](/assets/images/paper-53-grid-tools.jpg)\n{% endfigure %}\n\nTo start you'll need a ruler and a stylus[^pencil] to measure and draw straight on the iPad's screen. Next you'll want to determine the size of your grid. If you plan to use the entire iPad's screen and cover the canvas, a grid in ½ or 1″ increments[^increments] works out well.\n\n[^pencil]: I like to use [FiftyThree's Pencil](http://www.amazon.com/gp/product/B00JP12300/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00JP12300&linkCode=as2&tag=mademist-20&linkId=UNODSZKNUHXZJBE4) for drawing lines with a ruler. The rubber tip is thinner than some other styli and has the added benefit of palm rejection to avoid leaving stray marks on the canvas.\n\n[^straightedge]: You could use a ruler as your straight-edge, but I find that something like a book is thicker and makes lining up the stylus easier. If you do use a ruler avoid the ones with a cork backing, it can interfere with multi-touch and make triggering *touches* with the stylus' tip difficult.\n\n[^increments]: A full-size iPad's screen is a little over 7.5″ x 5.5″, so working in 1/2″ increments divides up nicely with room to spare if you want to label the grid in the margins.\n\nUsing a T-square can really speed up the grid making process, just be careful not to press too hard on the ruler so it touches the screen while you draw. Doing so can interfere with the iPad's touch sensors and you'll struggle to register a mark.\n\nIf you don't have a T-square you can use a ruler to help place a dot every inch (or whatever increment you deem appropriate). Next you'll want to slide the ruler down parallel to where you drew the first row off dots and make another set.\n\n{% figure caption:\"Two rows of dots should suffice, but if you want to go the extra mile make three.\" %}\n![three rows of dots](/assets/images/paper-53-grid-dots.jpg)\n{% endfigure %}\n\nSwitching to a straight-edge[^straightedge] you'll use the dots as guides to draw straight lines parallel to each other. Because iPad styli aren't that precise, it can take some practice placing a line where you want.\n\n{% figure caption:\"Drawing lines with a stylus on the iPad takes some getting used to.\" class:\"gallery-2-col\" %}\n[![drawing a line with Pencil and a T-square](/assets/images/paper-53-grid-t-square-600.jpg)](/assets/images/paper-53-grid-t-square-lg.jpg)\n[![drawing a line with Pencil and a straight-edge](/assets/images/paper-53-grid-book-edge-600.jpg)](/assets/images/paper-53-grid-book-edge-lg.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: straight-edge placement\n\nPlace your straight-edge directly on top of the reference dots, then slide it to the left or right ¼″ depending on what hand you are. This extra space gives the fat rubber tip of your stylus room to move and will hopefully fall exactly on the dots. If not move it some more until it does.\n{% endnotice %}\n\nTake your time drawing lines as accurate as and as light as possible, it'll make your life easier later --- trust me. Once you've drawn all the horizontal lines repeat the process for the vertical lines, intersecting them as you go.\n\n{% figure caption:\"Example of a finished grid drawn in pencil.\" %}\n![finished grid](/assets/images/paper-53-grid-finished.jpg)\n{% endfigure %}\n\nWith the hardest grid complete you'll do the same thing to your reference photograph. The size of the grids don't have to match, just make sure they are proportional and share the same amount of lines.\n\n## Grid making shortcuts\n\nIn case you didn't know, Paper by 53 has the ability to duplicate pages. If you took your time drawing a perfect grid you can use it as a template of sorts and copy it each time you need it.\n\nTo duplicate a page, pinch it to zoom out to journal view, and then press and hold on the <i class=\"fa fa-plus-circle\"></i> button until the **Duplicate** option appears.\n\n{% figure caption:\"Not all of the options in Paper are obvious, quite a few are hidden behind gestures or holding down various buttons.\" %}\n![duplicate a page screenshot](/assets/images/paper-53-grid-duplicate-page.jpg)\n{% endfigure %}\n\nYou can cut the amount of time spent drawing grids on your reference photographs as well. You can use grid apps[^apps] found in the *App Store*, use something like Adobe Photoshop or Illustrator to overlay a precise grid, or draw it once on a sheet of transparent [acetate](http://www.amazon.com/gp/product/B002544NHA/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B002544NHA&linkCode=as2&tag=mademist-20&linkId=Y2BDW34WIVVBAZGF) to place on top of your photos without having to draw a grid each time.\n\n[^apps]: [**Drawing Grid**](https://itunes.apple.com/us/app/drawing-grid/id500885379?mt=8) is a free iOS app that gets the job done if you can get past the awful and confusing UI. A couple others I found but didn't test where [**Artists Grid Tool**](https://itunes.apple.com/us/app/artists-grid-tool/id402430398?mt=8) and [**CopyIt**](https://itunes.apple.com/us/app/copyit-grid-drawing-method/id377185812?mt=8).\n\n{% figure caption:\"Grid making apps available for iOS in the App Store.\" %}\n![grid apps for iOS](/assets/images/paper-53-grid-apps.jpg)\n{% endfigure %}\n\n## Drawing with the grid\n\nWith the finished grids you're ready to begin creating your line drawing. Pick a box to start with and focus on drawing just the shapes and contour lines you see. Keep it light and use the pencil tool to mark the edges.\n\n{% figure caption:\"Using the **Drawing Grid** app to zoom in and view one box at a time.\" %}\n![drawing with the grid](/assets/images/paper-53-grid-method-drawing.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: focus on one grid box at a time\n\nIf you're having trouble focusing, cover up any neighboring boxes with a sheet of paper to reveal just the box you're working on.\n{% endnotice %}\n\nYou can certainly shade and paint each box as you go, but it's pretty hard to keep everything looking harmonious --- especially with the watercolor brush. Matching colors becomes really difficult as you bounce around the grid, so I suggest working in grays if you plan to use this method to create a finished drawing.\n\n## Removing the grid\n\nSo here comes another drawback to the grid method. If you thought it was time intensive making the grids, wait till you try and remove them from around your drawing.\n\nMy preferred method of getting rid of the lines is by dabbing the eraser over them. *Remember, the quicker you tap, the smaller the dot.*\n\n{% figure caption:\"Dabbing the eraser to create a dotted line looks more organic and is less likely to leave *ghost line* residue.\" %}\n[![erasing the grid](/assets/images/paper-53-grid-removing-lines-900.jpg)](/assets/images/paper-53-grid-removing-lines-lg.jpg)\n{% endfigure %}\n\nDepending on the complexity of your subject, using your finger to [Blend]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}) away lines can produce nice results. It works best on lines that don't have a lot going on around them, just in case you smudge too much --- less you have to redraw later.\n\n## Next steps\n\nYou'll most likely have to redraw a few lines depending on where the grids fell. Just use a matching color and lightly pencil in any lines you partially erased. For those areas that have *ghost lines* you can cover-up or lighten them using [hatch strokes]({% post_url /mastering-paper/2014-02-09-basics %}#painting-with-pencil) and an appropriately colored pencil.\n\n{% figure caption:\"Completed line drawing with touch-ups and shading applied.\" %}\n![finished line drawing](/assets/images/paper-53-grid-finished-line-drawing.jpg)\n{% endfigure %}\n\nUsing this outline you can proceed to draw, ink, or paint on top of it. In my [Drawing Skin and Faces guide]({% post_url /mastering-paper/2014-04-21-drawing-faces %}) I cover all the ways I use pencil and watercolor to achieve realistic results. \n\nWith practice you'll eventually find that you won't need the grid anymore and can rely on simple freehand sketches instead. Just take a look at my [PaperFaces drawings](/paperfaces/) from beginning to end if you want proof of what practice and determination can achieve.\n\n{% figure caption:\"Here's how the drawing turned out after I painted layers of watercolor and added details with the pencil tool.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-makenna-s-process-3-600.jpg)](/assets/images/paperfaces-makenna-s-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-makenna-s-process-4-600.jpg)](/assets/images/paperfaces-makenna-s-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-makenna-s-600.jpg)](/assets/images/paperfaces-makenna-s.jpg)\n{% endfigure %}\n\nAs always, hit me up on [Twitter](https://twitter.com/mmistakes) or in the comments below if you have a question or need further clarification.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-09-16-mix-with-me.md",
    "content": "---\ntitle: \"Paper creators, join me in the Mix\"\nlast_modified_at: 2018-11-06T12:02:21-05:00\nexcerpt: \"Mix by FiftyThree makes finding, sharing, and learning from inspiring Paper creators easy and fun.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, Apple]\ncomments_locked: true\n---\n\nI'm the type of person that learns how something is made by dissecting and examining its every nook and cranny. Obsessively digging through #MadeWithPaper streams on [Tumblr](https://www.tumblr.com/search/madewithpaper), [Twitter](https://twitter.com/search?q=%23MadeWithPaper&src=typd), and Instagram I've become frustrated with the lack of fidelity of those posts.\n\n![Mix heart](/assets/images/paper-53-mix-heart.jpg)\n\n{% notice %}\n#### FiftyThree Has Shut Down the Public Stream / Mix\n\nAs of August 15th, 2017 [the Public Stream](https://support.fiftythree.com/hc/en-us/articles/115004639749-The-Public-Stream) is no longer in service. Any links out to **mix.fiftythree.com** or **paper.fiftythree.com** will cease to work.\n{% endnotice %}\n\nOn Tumblr images max out at 1280 × 960 pixels, on Twitter it's 1024 × 768, and Instagram a wimpy 640 × 640. None of these sizes come close to the iPad's native resolution of 2048 × 1536, which is a real problem for someone like me. Ha!\n\nWith the release of [Mix](http://mix.fiftythree.com) today, FiftyThree is making nuts like me very happy. I can now easily:\n\n- Flip through a never ending stream of inspiration.\n- Save said inspiration to my local journals.\n- Learn from other creators by examining their original works in the medium they were created in.\n- Share what I've learned as *starter* sketches, tutorials, and guides to be remixed on.\n\nSo if you're one of the lucky Paper creators to get an invite to Mix (or soon will be) feel free to join me in the Mix. If you've followed my [Mastering Paper by 53](/mastering-paper/) series of tutorials or [PaperFaces portraits](/paperfaces/) then you'll probably enjoy what I'm sharing.\n\n{% figure caption:\"Examples of the types of content I’m sharing on Mix.\" class:\"gallery-3-col\" %}\n[![How to draw a face](/assets/images/paper-53-mix-faces.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/42082) [![How to draw a mountainscape](/assets/images/paper-53-mix-mountain.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/35882) [![The twins illustrated](/assets/images/paper-53-mix-twins.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/42074)\n{% endfigure %}\n\nEasiest way to follow me is by [visiting my Mix profile](https://mix.fiftythree.com/11098-Michael-Rose) and clicking on the **i** icon. You can also try searching for me in Paper by swiping down while *in the Mix* and typing \"Michael Rose.\"\n\n{% figure caption:\"Search Mix for Michael and you should find me.\" %}\n[![Search Mix for Michael](/assets/images/paper-53-mix-search-michael.jpg)](https://mix.fiftythree.com/11098-Michael-Rose)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-09-16-watercolor-brush-update.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: watercolor brush improvements\"\nmodified:\nexcerpt: \"Discover the secrets of Paper's newly updated watercolor brush in this short tutorial and video.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\nimage:\n  path: &image /assets/images/paper-53-watercolor-brush-feature.jpg\n  width: 1280\n  height: 508\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments_locked: true\nlast_modified_at: 2018-11-06T12:02:42-05:00\n---\n\nIf you've struggled painting smooth tones with Paper's watercolor brush, power on your iPad and download the 2.0 update right now! FiftyThree just pushed out a set of changes that improves the tool in every way.\n\n## What exactly has changed?\n\nIf you've spent anytime using the brush tool you probably already discovered that each new wash of watercolor multiplies as they're layered. This allows you to create some nice gradient effects to add depth and dimension to your sketches.\n\n![Purple gradient](/assets/images/paper-53-watercolor-gradient.jpg)\n\nOn the flip side, the brush can be difficult to control when trying to maintain a continuous tone (especially when painting large shapes). If your hand isn't steady and you accidentally lift off the iPad's screen, the next stroke will be a splotch that will stick out noticeably.\n\n{% figure caption:\"A choppy painted shape versus one painted smoothly\" %}\n![Choppy and smoothly painted shapes](/assets/images/paper-53-choppy-smooth-paint-2.jpg)\n{% endfigure %}\n\nIn Paper version 2.0, the watercolor brush is way more forgiving and lets you lift off the screen without ruining the \"wet on wet\" effect. Now if you're quick you can start painting a shape, lift your finger/stylus, and then go back into the shape to continue working its contours. The days of having to paint a large shape perfectly in one stroke are over --- hooray!\n\nTo better visualize how the new brush works I shot a quick video that you can view below. As far as I can tell there is about a 1 second delay on how long you can lift off the screen before Paper decides to overlay the strokes.\n\n{% figure caption:\"Comparison video showing the enhancements made to the watercolor brush.\" %}\n{% youtube Lt1oIsH4wHo %}\n{% endfigure %}\n\nFor those of you who have tried out the new watercolor brush, how's it treating you? Found any other undocumented improvements with the rest of the tools?\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-09-29-paper-2-0.md",
    "content": "---\ntitle: \"Paper 2.0.0 bugs and other strange behaviors\"\ndate: 2014-09-28T14:59:29-04:00\nlast_modified_at: 2018-11-06T12:02:59-05:00\nexcerpt: \"Documented bugs and other strange behaviors found in Paper for iOS version 2.0.0 when using Pencil.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, Pencil by 53, Pogo Connect, Apple]\nimage:\n  path: &image /assets/images/paper-2-0-0-feature.jpg\n  width: 1280\n  height: 441\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments_locked: true\ntoc: true\n---\n\nWith *FiftyThree's Paper* hitting 2.0 and Apple's iOS 8 system update dropping recently we've seen some noticeable [improvements in the software]({% post_url /mastering-paper/2014-09-16-watercolor-brush-update %}) along with brand new features like [Mix]({% post_url /mastering-paper/2014-09-16-mix-with-me %}) and **Surface Pressure**.\n\nWith such a substantially upgrade to both Paper and iOS, a few bugs were bound to slip through. My goal with this post is to document these \"bugs\" and what conditions they occur under. If you've experienced any of these know that you're not alone and hopefully a fix or official workaround from FiftyThree is on the way.\n\n## Using a stylus to Blend is unreliable\n\nI've always used Paper's Blend feature as designed: draw with Pencil and smudge with one of my fingers. Because I'm a finger blender I learned about this next bit from [Edwin over on Tumblr](http://mademistakes.tumblr.com/post/98571965783/paper-2-0-0-193). For those of you who prefer using a capacitive stylus like [Wacom's Bamboo](http://www.amazon.com/gp/product/B004VM0SE6/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B004VM0SE6&linkCode=as2&tag=mademist-20&linkId=OBWZLIM4PI3OCGYE) to smudge, you may need to change your work-flow after updating Paper to version 2.0.0...\n\nIn my tests this appears to be limited to styli with smaller nibs. In *Paper 2.0.0 (193)*, smudging with these sorts of nibs no longer works... well not 100% of the time. If you press hard enough to \"squish\" the tip it might register as a touch and smudge but at the cost of wearing out faster.\n\nI tried several styli with rubber nibs to see if it was indeed the tip's size or some other quality. As long as the tip is fat enough Paper will interpret it as a finger touch and Blend --- and sometimes draw ([see bug below](#pencil-nothing-bug)). Anything smaller it ignores as a way of filtering out touches to avoid making errant smudges.\n\n{% notice %}\n#### Dumb stylus woes\n\nI've also observed Paper getting confused when pressing lightly with a capacitive styli. I'd expect it to Blend or not do anything, but instead it begins drawing marks.\n{% endnotice %}\n\n{% figure caption:\"Paper 2.0.0 Pencil and capacitive styli bugs.\" %}\n{% youtube cleK43E6M6o %}\n{% endfigure %}\n\nWhile I believe only activating Blend with finger sized touch targets is the intended behavior. I do see how it could be bothersome for those who prefer using a stylus (that falls under the size threshold[^small-tip]) to Blend. If you want to test it out here are the steps I followed:\n\n[^small-tip]: Known small tip styli with Blend problems: Wacom Bamboo, ZEN 3-in-1, Universal Touch Screen Pen.\n\n1. Tap Settings in the upper right corner.\n2. Choose Pencil.\n3. Set Finger to **Blend**.\n4. Draw something with Pencil.\n5. Attempt to smudge something with another stylus.\n6. Lightly drag this same stylus' tip across the screen.\n\n## Pencil \"nothing\" bug\n\nUnder ideal conditions, a Pencil stylus paired to Paper should only draw/paint/erase with it's tip and Blend with a finger. I've found that a stylus used in place of your finger will *draw* even if you've turned off the Blend feature. Here's how to reproduce the bug:\n\n1. Tap Settings in the upper right corner.\n2. Choose Pencil.\n3. Set Finger to **Nothing**.\n4. Make a stroke with Pencil.\n5. Switch to another stylus and make another stroke.\n\nIt doesn't always draw and it doesn't happen with every stylus. Capacitive tip styli with smaller tips exhibit it more often than those that are fat and squishy --- but not always.\n\n{% notice %}\n#### Be mindful of how you hold Pencil\n\nIf your palm or another finger accidentally depresses the Eraser end of Pencil as you draw it will begin erasing instead.\n{% endnotice %}\n\n## Pogo Connect bug\n\nI've been using my Pogo Connect less and less these days so this bug hasn't been that troubling for me. But for those of you who rely on it (especially pre-iPad air users), you may want to take extra care when using a Pogo Connect until this bug is fixed.\n\nThis is a really weird one and I'm not entirely sure why it's happening, but it certainly feels like it has something to do with the [new watercolor brush behavior]({% post_url /mastering-paper/2014-09-16-watercolor-brush-update %}). Here's how to reproduce it:\n\n1. Draw something with one of the ink tools.\n2. Switch to the watercolor brush and paint.\n3. Invoke the Rewind gesture.\n\nHere's a video to better show what's going on, but the gist of it is this. \n\n{% figure caption:\"Paper 2.0.0 and Pogo Connect Rewind bug.\" %}\n{% youtube 2BJerajpehQ %}\n{% endfigure %}\n\nIf you paint something after drawing and then invoke Rewind, it undoes the drawing strokes instead of the painted strokes with no way or restoring them. They're simply removed from Rewind's history of undoes.\n\n### How to avoid the bug\n\nTo get around this bug take extra care when using the fountain pen, pencil, and watercolor brush tools. As far as I can tell if you make strokes with the fountain pen or pencil tools and then paint with the brush, you could potentially lose parts of your artwork after Rewinding. It doesn't happen all the time but is more prevalent when switching tools quickly.\n\n## iOS accessibility zoom and Pencil\n\nBack before Paper had the Loupe tool, many of us resorted to the *Accessibility Zoom hack* as a crude way of zooming in and doing detail work. By going into the **Settings app**, selecting *General > Accessibility*, you could turn on a 3 finger tap gesture to magnify the screen.\n\n{% figure caption:\"Accessibility Zoom enabled in the Settings app.\" %}\n![iOS 8 Settings app screenshot](/assets/images/ios-8-accessibility-zoom.jpg)\n{% endfigure %}\n\nIf you use FiftyThree's Pencil, have the 2.0.0 version of Paper, and the zoom accessibility feature enabled, you're in for a rude awakening. When you launch Paper you won't be able to flip pages, draw, open the tool tray, or pretty much anything else. I'm sure there is a good reason for all of this, but for now you need to *disable Zoom* in the Settings app to use Paper properly.\n\n{% figure caption:\"Enabling iOS 8's Accessibility Zoom feature renders Paper useless.\" %}\n{% youtube 6_n1eWpZlV8 %}\n{% endfigure %}\n\nFor those of you that don't use Pencil, the 3 finger tap accessibility zoom gesture works perfectly fine in Paper 2.0.0.\n\n### Other bugs\n\nHave you noticed any other bugs since updating to Paper 2.0.0 or iOS 8? Let me know in the comments section below so I can include them in the list.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-10-25-erasing.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: erasing and how to undo\"\nlast_modified_at: 2018-11-06T12:03:31-05:00\nexcerpt: \"Learn how to use Paper's eraser tool to correct and cover-up mistakes.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, Pencil by 53, tutorial, Apple]\nimage:\n  path: &image /assets/images/paper-53-erasing-feature.jpg\n  width: 1280\n  height: 526\n  feature: *image\ntwitter:\n  card: summary_large_image\ntoc: true\n---\n\nOne of those tools that is easily forgotten about is the eraser --- the utensils used to make marks tend to get more attention than those that undo them. At first blush, erasing in an app like [Paper by FiftyThree](http://www.fiftythree.com/paper) may appear limiting and simplistic. Paired with [FiftyThree's Pencil stylus](http://www.amazon.com/gp/product/B00JP12300/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00JP12300&linkCode=as2&tag=mademist-20&linkId=X4XZAPOX4S2GLXA2) and a little creativity do the possibilities really begin to fly.\n\n## Eraser tool 101\n\nOpening Paper's tool tray you will find that the eraser is the first tool on the left.\n\n{% figure caption:\"The eraser tool is located on the far left.\" %}\n![screenshot of the tool tray in Paper](/assets/images/paper-53-eraser-tool-tray.jpg)\n{% endfigure %}\n\nOwners of [**FiftyThree's Pencil**](http://www.amazon.com/gp/product/B00JP12300/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00JP12300&linkCode=as2&tag=mademist-20&linkId=X4XZAPOX4S2GLXA2) have the added benefit of a dedicated eraser on the top of the stylus. Now you can flow between drawing and erasing by simply flipping Pencil around as you would a *real pencil*. Of course you can still select the eraser from the tool try and use Pencil's pointed tip to erase --- but who does that?\n\n{% figure caption:\"Just like the tip, Pencil's eraser is user replaceable.\" %}\n![detail of Pencil's eraser and replacement](/assets/images/paper-53-eraser-replacement.jpg)\n{% endfigure %}\n\n### How speed affects erasing\n\nAll of the tools in Paper react to the speed at which you use them --- the eraser is no different. When dragging your finger or stylus across the iPad slowly, the eraser will be at its thinnest width. As you increase the speed at which you move, the wider the eraser's size becomes.\n\n{% figure caption:\"The faster the stroke, the larger the eraser.\" %}\n![erasing from thin to thick](/assets/images/paper-53-eraser-thick-thin.jpg)\n{% endfigure %}\n\n### How Surface Pressure affects erasing\n\nIn [my review of Pencil]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}#what-about-the-eraser) I dinged the dedicated eraser as a missed opportunity by not adding any new capabilities to the tool. Well when FiftyThree updated Paper to include the new **Surface Pressure**[^pencil-only] feature, Pencil's eraser got a serious upgrade.\n\n{% figure caption:\"Erasing with the corner versus the entire width of Pencil's eraser.\" class:\"gallery-2-col\" %}\n![erasing with the corner](/assets/images/paper-53-erasing-corner.jpg)\n![erasing with the entire edge](/assets/images/paper-53-erasing-wide.jpg)\n{% endfigure %}\n\nPencil's eraser now changes size depending on how much of it makes contact with the iPad's screen. Touching the corner of the eraser to the screen will remove a small portion of your drawing. While swipes with the wider edge erase in broader strokes.\n\n{% figure caption:\"Pencil's eraser offers way more flexibility in size than the default eraser.\" %}\n![eraser sizes](/assets/images/paper-53-eraser-sizes.jpg)\n{% endfigure %}\n\nA Surface Pressure enabled eraser can be made quite small, allowing you to sneak into tighter spaces. A trick the normal eraser tool wishes it could pull off.\n\n### How pressure sensitivity affects erasing\n\nCurrently the [Pogo Connect]({{ site.url}}{% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) is the only pressure sensitive stylus Paper supports. When paired to Paper you can vary the size of the eraser (and the other tools) by applying  pressure to the tip as you drag it across the screen.\n\n{% figure caption:\"The harder you press the larger the eraser becomes.\" %}\n![Pogo Connect erasing](/assets/images/paper-53-eraser-pogo-connect.jpg)\n{% endfigure %}\n\nErasing tends to be one of those modes where you want precise control for fixing mistakes. The Pogo Connect is not a good tool for this unless you have a steady hand. I can't even count the amount of times I'd press too hard on the tip and remove a large chunk of my drawing by mistake.\n\n### How to erase everything quickly\n\nSometimes you just want to clear an entire page and start over. Of course you could manually swipe over everything with the eraser, delete and create a new page, or Rewind back to blank canvas. \n\nBut the quickest way to clear a page and undo everything is by press and holding on the eraser tool icon. After a few seconds you will be prompted to \"**Clear Page**\". Easy peasy.\n\n{% figure caption:\"Press and hold on the eraser tool to wipe the entire page.\" %}\n[![animation showing how to erase the entire page](/assets/images/paper-53-clear-page.gif)](https://www.youtube.com/watch?v=pABqPEzHlsQ)\n{% endfigure %}\n\n---\n\n## Edge characteristics of Paper's eraser\n\nI like to compare the line qualities of the eraser to the marker (outline) and fountain pen (draw) tools. Unlike the watercolor brush or pencil tools, the eraser has a smooth and clean edge and is very binary in its application. It either completely removes what it touches right down to the egg shell colored background, or it doesn't --- there is no granularity.\n\n### Harsh edges are good for\n\nThe harsh edges produced by the eraser are great for bold illustrations, comics/cartoons, wire-framing, diagrams, and lettering. Basically anything you want to retain smooth edges and keep your line work crisp. \n\n{% figure caption:\"Cartoons and doodles are complemented by the eraser tool's rigid edge.\" %}\n![examples of crisp line work](/assets/images/paper-53-erasing-crisp-edge.jpg)\n{% endfigure %}\n\n### Harsh edges are bad for\n\nCall me biased, but I don't think the eraser tool works well when trying to achieve a degree of *softness* in your work. I create a lot of work in the [photo-realistic camp](/paperfaces/) and find that a swipe of the eraser can destroy the textured quality of watercolor and pencil strokes. \n\nIf the eraser removed strokes in a more granular way it might be a different story, but for the most part I avoid the tool like the plague. I've found it much easier to paint with variations of white to \"erase\" strokes gradually. More on that below...\n\n{% figure caption:\"Notice how erasing the fur strokes creates an abrupt edge making it harder to cover-up?\" %}\n![erasing fur and hair can ruin the effect](/assets/images/paper-53-eraser-fur-coverup.jpg)\n{% endfigure %}\n\n## Erasing techniques\n\nIf you're like me and lust after a tool that functions like a traditional gum eraser you're in luck. There are three *eraser hacks* I use to achieve similar results:\n\n### Partially erase a line\n\nInstead of completely erasing a stroke you can partially remove it. By leaving fragments of the original, you retain the spirit of its texture and form. There will still be some \"crispness\" along the erased edges, but they won't be as harsh.\n\nThe easiest way to pull this off is by dabbing your finger or stylus repeatedly while using the eraser. This will lift bits and pieces of the original drawing away with each dab.\n\n{% figure caption:\"Dabbing the eraser to partially erase a sketch.\" %}\n![partially erased sketched](/assets/images/paper-53-eraser-dab-method.jpg)\n{% endfigure %}\n\nThis is especially effective during the sketching phase of creation. By leaving part of the drawing on the canvas it allows you to use it as a guide as you continually refine it.\n\n### Paint with white to erase\n\nMy preferred method of \"erasing\" is to use the watercolor brush loaded with white. With any other color, the brush works as a multiplier building up each layer like panes of colored glass. But when you mix a pure white or tint, it becomes more opaque and acts as a cover-up tool.\n\nBy taking advantage of this property, white can be used to emulate a gum eraser. By dabbing the brush on the canvas, previously painted colors will begin to lighten. The longer you linger the whiter the area will become --- speed matters so work quick!\n\n{% figure caption:\"A video demonstrating how to *erase* by painting with white.\" %}\n{% youtube -BLKj1xww6w %}\n{% endfigure %}\n\nI've found that using the fat side of Pencil's tip to swipe in white allows for greater control and smoother transitions. It takes some practice and is definitely a more advanced technique.\n\n{% notice %}\n#### White to \"erase\" gotcha\n\nThis method does have a drawback. Using white to \"erase\" can create more work for yourself if you have a detailed background. The white might bleed into it forcing you to spend a lot of time color matching to clean-up edges. For this reason I tend to work on areas that need lightening first and cover up any messy edges later.\n{% endnotice %}\n\n### Blend (smudge) to erase\n\nAnother effective way of softening a sketch, is to smudge it with Blend[^pencil-only]. The slower you glide your finger across the screen the more intense the blur. When done correctly lines can be partially blended away leaving small traces you can more easily draw over --- using them as guides.\n\n{% figure caption:\"[Blending away guides](/mastering-paper/grid-method/#removing-the-grid) and rough sketches is great way to disguise them for inking or painting over.\" %}\n![blending away a sketch](/assets/images/paper-53-eraser-blend-guides.jpg)\n{% endfigure %}\n\nThere's also the option of using the eraser as you normally would followed with carefully placed Blends. You'll want to be quick with your smudge strokes to avoid pushing pixels too far and ruining any built up textures. But with some practice you can cover-up any ill effects from the eraser.\n\nOnce you get into a rhythm --- bouncing between sketching, erasing, and smudging can begin to feel very natural.\n\n[^pencil-only]: Surface Pressure and Blend features require a Pencil stylus paired to Paper to enable.\n\n---\n\n## Additional resources\n\nIn case you scrolled through all those words up there I put together an erasing cheat sheet and shared it to Mix. Feel free to [download and remix it](https://mix.fiftythree.com/11098-Michael-Rose/624712) directly in Paper for iOS.\n\n{% figure caption:\"Paper for iOS How to Erase cheat sheet.\" %}\n[![Paper for iOS How to Erase cheat sheet](/assets/images/mastering-paper-erasing-cheatsheet-900.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/624712)\n{% endfigure %}\n\n## How do you use the eraser tool?\n\nDoes the way that the eraser tool behave in *Paper by FiftyThree* work as you'd expect? Do you find it convenient having the tool integrated directly into Pencil? Feel free to share your thoughts, sketches, links to Mixes, and techniques in the comments below.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-11-25-mix.md",
    "content": "---\ntitle: \"Mastering Mix by FiftyThree\"\nlast_modified_at: 2018-11-06T12:03:41-05:00\nexcerpt: \"Download templates for Paper and discover how to use Mix to Learn, Sketch, Play, Write, Design, and Think.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\nimage:\n  path: &image /assets/images/mix-53-feature.jpg\n  width: 1280\n  height: 526\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments_locked: true\ntoc: true\n---\n\nAs an avid Paper creator, sharing my sketches and \"ideas\" has felt a bit like I was in an empty room talking to myself. Sure I could ask for feedback in the form of a 140 character Tweet or reblog on Tumblr, but the ability to collaborate was missing. With the [release of Mix](http://news.fiftythree.com/post/97645975008/mix-create-together-the-english-inventor-sir), that void has been filled.\n\n{% notice %}\n#### FiftyThree has shut down the Public Stream / Mix\n\nAs of August 15th, 2017 [the Public Stream](https://support.fiftythree.com/hc/en-us/articles/115004639749-The-Public-Stream) is no longer in service. Any links out to **mix.fiftythree.com** or **paper.fiftythree.com** will cease to work.\n{% endnotice %}\n\nPaper + Mix enhances a solo creative process by augmenting it into a social experience. Sketches, doodles, paintings, ideas, and more can now be shared in the Mix making them available for download or remix by anyone with an iPad and Paper.\n\n## How do you use Mix?\n\nMix can be accessed directly in the Paper app or [viewed on any device](https://mix.fiftythree.com) with a web browser (I like to browse ideas on my iPhone while on the go).\n\n![Mix stream in Paper by 53](/assets/images/mix-53-stream.jpg)\n\nWithin Paper, you can enter Mix by swiping down from the top edge of the screen while in the journal view. In Mix you have access to three stacks:\n\n1. **Me**: All of the ideas you've shared to Mix.\n2. **Stream**: Ideas from those you follow along with recommended and featured ones from FiftyThree.\n3. **Stars**: Ideas you've starred, more on below.\n\n---\n\n## What is Mix good for? \n\nAt its heart Mix is a place for ideas to begin, nurture, and grow. That's not to say it can't be used in other ways, but one gets the feeling from the six categories Mix is divided into ([see below](#types-of-mixes)) that is its primary purpose.\n\n{% notice %}\n#### ProTip: encourage feedback and discussion\n\nTo get the most value out of Mix I recommend posting \"ideas\" that encourage participation (share templates, purposely leave sketches unfinished, leave blanks, ask questions, etc.)\n{% endnotice %}\n\nMix isn't just for those who doodle and sketch. By following one of the curated categories or influential Mixers, it becomes a great tool for inspiration collection (think Pinterest or similar social bookmarking apps). For those who may fear a blank page or enjoy hoarding ideas for a rainy day, Mix has you covered with a never ending supply of ideas to remix.\n\n{% figure caption:\"Favorite any idea on Mix by tapping the star button.\" %}\n![Star button in Mix](/assets/images/mix-53-star-button.jpg)\n{% endfigure %}\n\nEach idea shared to Mix can be \"favorited\" by tapping the star button below it. Starred ideas, sketches, templates or doodles are grouped in a journal named Stars that works like any other journal you create in Paper (move, duplicate, share, and delete pages).\n\n{% figure caption:\"Your *starred* ideas can be found in the Stars journal to the far right.\" %}\n![Stars journal in Paper](/assets/images/mix-53-stars-journal.jpg)\n{% endfigure %}\n\n---\n\n## Types of mixes\n\nAs I hinted at before there are six Mix categories ([**Learn**](#learning), [**Sketch**](#sketching), [**Play**](#playing), [**Write**](#writing), [**Design**](#designing), and [**Think**](#thinking)) that are curated by the FiftyThree team. If your creative juices are running on empty, looking for inspiration here is a great place to get inspired.\n\nWithin the app you can find them by swiping down from the top edge of the screen while in the Mix. On the web they're arranged across the top of the screen and can be scrolled through horizontally.\n\n![Mix categories](/assets/images/mix-53-categories.jpg)\n\n{% notice %}\n#### ProTip: follow curated categories\n\nYou can follow any or all of these categories to keep your stream fresh with ideas. There's even a Popular category to see what Paper taste makers are creating and remixing.\n{% endnotice %}\n\n---\n\n## Learning\n\nPaper is an app that rewards you the more you use it and experiment with the tools. Most of the little tricks, gestures, and various techniques I've learned were uncovered through exploration (and sometimes by mistake). As a seasoned user of Paper I find this act of discovery somewhat magical, but to those who are new to the app I can see how it could be frustrating. This is where Mix comes in to play...\n\n### Asking for help\n\nLeveraging the collaborative power of Mix is an excellent way to learn from others. When flipping through your stream you may come across a sketch that pulls off an effect you like. One way to learn how it was created is to open the page, write a note asking \"how did you do this?\", and post it back to Mix. The original creator will be notified of your remix (if they have notifications turned on) and can respond to your inquiry directly with another Mix.\n\n{% figure caption:\"Ask questions by writing notes directly on a sketch and then sharing it back to Mix.\" %}\n![hair girl sketch on Mix](/assets/images/mix-53-hair-girl-question.jpg)\n{% endfigure %}\n\n### Tutorials\n\nWith the prevalence of GitHub and open source methodologies, being able to \"view source\" on Mixes and examine them in the medium they were created is very useful. Especially for someone like me who sometimes finds it hard to ask for help and would rather figure it out on his own.\n\nI've been known to [write up lengthy tutorials](/mastering-paper/) explaining how to achieve specific effects and techniques with Paper's tools. Mix affords me the option to supplement these written tutorials with bit-sized \"cheat sheets\" I can share with a wider audience. The feedback I get back is much more useful too. All I have to do is look at the remixes on an idea to see how they're being interpreted and if they've been of use to anyone.\n\n{% figure caption:\"Practice Blending techniques with these two mixes.\" class:\"gallery-2-col\" %}\n[![Insterstellar Blend practice on Mix](/assets/images/mix-53-interstellar-blend-practice.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/899070)\n[![Aurora Borealis Blend practice on Mix](/assets/images/mix-53-aurora-borealis-blend-practice.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/915375)\n{% endfigure %}\n\n### Some other great uses for Mix that fit in with the \"Learning\" theme:\n\n* Create or find templates to build off of. \n* Use as a framework to jump start your creativity. \n* [Sketchnoting](http://de.wikipedia.org/wiki/Sketchnotes) and collaborative note taking during conferences to help visualize concepts and keep a record of what was discussed.\n* Post word, math, science related problems for your students to work on and promote discussion by flipping through their remixes.\n\n---\n\n## Sketching\n\nI don't have any numbers to back this up, but my gut tells me doodles and sketches are the most popular types of ideas being posted to Mix. At first glance the [Sketch category](https://mix.fiftythree.com/sketch) could be mistaken as a self promotion dumping ground, but it's actually something much more useful.\n\nThe best finds here are those that are partially completed: rough line drawings, the start of a beautiful landscape, or a half painted figure just waiting for you to give it a face. That's not to say finished works of art don't have their place on Mix --- they do, but the heart of Mix is leaving a few doors open for others to close.\n\nMy approach to sketching on Paper has been to add \"behind the scenes footage\" whenever possible. Whether it was by recording [time lapse videos](https://www.youtube.com/playlist?list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao) to show how I draw or by sharing in-process screenshots on social media. With Mix there's now a clean and seamless way of exposing a drawing's evolution directly in Paper.\n\n[![Draw a cat tutorial on Mix](/assets/images/mix-53-draw-a-cat-1.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/899124)\n\n{% figure caption:\"**Draw a Cat.** An example of how to show process and teach at the same time.\" class:\"gallery-2-col\" %}\n[![Draw a cat tutorial on Mix](/assets/images/mix-53-draw-a-cat-2.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/899421) [![Draw a cat tutorial on Mix](/assets/images/mix-53-draw-a-cat-3.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/899676)\n{% endfigure %}\n\nIt may not be obvious at first but remixing yourself is a great way to chain together a series of sketches to show a progression.\n\n{% notice %}\n#### ProTip: share works in progress\n\nSharing often as you work on an idea is a great way of saving its history. Of course you can still duplicate pages as a means of backup, but remixing often removes some of the local clutter from your journals. It also encourages others to remix your unfinished ideas as they have more opportunity to build off of than the \"finished\" mix.\n{% endnotice %}\n\n---\n\n## Playing\n\nThere's so much quality work circulating on Mix that it's easy to feel intimidated by it. I don't mind admitting that I've felt inadequate quite a few times flipping through my stream and being blown away by what others are doing with Paper. I suppose that's why I rarely remix other's work out of fear of ruining what they've done.\n\nIf this sounds like you, fear not! There's a whole chunk of Mix dedicated to keeping things light and airy. Poke around the [Play category](https://mix.fiftythree.com/play) and you'll see what I mean. Mixes encouraging others to create, come up with inventive twists on old pen & paper games, and community building challenges.\n\n[![Draw your favorite movie Mix challenge](/assets/images/mix-53-movie-sketch-challenge.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/924506)\n\n{% figure caption:\"**Sketch Challenge:** Draw a Scene from your favorite movie (bonus points for obscure flicks)\" class:\"gallery-2-col\" %}\n[![Troll 2 sketch on Mix](/assets/images/mix-53-sketch-troll-2.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/924538)\n[![Darth Vader sketch on Mix](/assets/images/mix-53-sketch-darth-vader.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/929687)\n{% endfigure %}\n\n### Some of the many ways you can have fun on Mix:\n\n* Organize a \"Ask Me Anything\" session through remixes.\n* \"A Day in the Life\" doodles showing the events of your day.\n* Coloring book themed ideas that start with just an outline for the community to complete.\n* Remix an idea and turn it into something new and unexpected (e.g. a drawing of an apple remixed with \"goggly\" eyes and a mustache).\n* Game templates (Tic-Tac-Toe, mazes, dots and boxes, etc).\n\n{% figure caption:\"Mix your own snowman creation\" %}\n[![Build a snowman on Mix](/assets/images/mix-53-build-a-snowman.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/914704)\n{% endfigure %}\n\n---\n\n## Writing\n\nI'll be the first to admit that words and writing aren't my strong suit. As a formally trained graphic designer I've learned the importance that a typeface can have in communicating the right tone.\n\nThere is no rule that says you have to draw pictures with Paper and post those to Mix. Let the [Write category](https://mix.fiftythree.com/write) be an example of the beauty of words in the hand's of typographers, letterers, designers, and word-smiths.\n\n![Write category on Mix](/assets/images/mix-53-write-category.jpg)\n\nMaybe you're thinking this whole \"art\" thing isn't really your cup of tea. If that's the case there's still a lot Mix can offer you. \n\n### Write ideas:\n\n* Download a calendar or \"ruled\" page template to capture daily happenings and thoughts.\n* Start writing a story and let someone remix it and come up with the ending. Or go all out and sporadically leave blanks to be filled in by other community members *Mad Lib* style!\n* Convey an emotion or sentiment with one illustrated word --- there are many prompts and themes on Mix to get your started (e.g. \"Thanksgiving\").\n\n---\n\n## Designing\n\nAs a designer I've found that Paper is a great tool for working out ideas quickly before they're refined into a higher fidelity comp to be shared with clients and colleagues. Prior to Mix the burden was on me to create various \"frames\" and templates I might need for wireframes and prototypes.\n\n![iPhone template on Mix](/assets/images/mix-53-design-iphone-hand.jpg)\n\nMix gives designers looking for a place to iterate and refine ideas an assortment of starter templates that can be used for all sorts of things.\n\n* Developing a mobile app or website? Download one of Mixes many blank templates.\n* Remodeling or looking for decorating ideas? Remix floor plans and architectural renderings.\n* Remix your own garments (clothing and accessories) using one of the many templates shared by fashion lovers and designers.\n\nMost of the design work I do isn't something that can be openly discussed or shown. Because of that I avoid sharing any confidential or sensitive sketches and work to Mix. But that's not to say I won't favorite and share back templates that I find useful to help others jump start a project.\n\n---\n\n## Thinking\n\nThe [Think category](https://mix.fiftythree.com/think) on Mix features ideas that encourage thought and conversation. I'm mostly a \"one man show\" and don't have a lot of experience using Paper in group settings, but here's a few ways I think Mix can help facilitate conversation.\n\n![Think category on Mix](/assets/images/mix-53-think-category.jpg)\n\nWhite boarding and team brainstorm sessions can be made more interactive and fun by adding Mix to the... umm... mix. A nice feature in Paper that has gotten little attention is **Presentation Mode**. With an AppleTV and Presentation Mode enabled, the toolbar becomes hidden turning the projected screen into a digital white board.\n\n{% figure caption:\"Presentation Mode can be enabled under Settings > Paper > Presentation Mode\" %}\n![Enable Presentation Mode under Settings](/assets/images/paper-53-presentation-mode.jpg)\n{% endfigure %}\n\nBy designating a facilitator to \"drive\" the projected iPad, the other participates are available to freely remix and collaborate on their own device(s). As discussions occur the facilitator can bounce between the team's mixes and add notes in real time. Because Mix runs in \"the cloud\" remote team members have the ability to contribute and follow along as well.\n\n---\n\n## Additional resources\n\nI hope this article has inspired you to check out Mix and become a part of the great community of Paper creators. Feel free to [follow me on Mix](https://mix.fiftythree.com/11098-Michael-Rose), remix my ideas, or ask questions below in the comments. If you're looking for additional Mix information the [FiftyThree support forum](https://support.fiftythree.com/hc/en-us) is a great place to start.\n\n* [Sharing and Exporting](https://support.fiftythree.com/hc/en-us/articles/201713541-Sharing-and-Export)\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-11-28-pencil-53-review.md",
    "content": "---\ntitle: \"Pencil by FiftyThree is still the best stylus for Paper\"\nexcerpt: \"Impressions of FiftyThree's Pencil stylus from the perspective of an avid Paper creator.\"\ncategories: [mastering-paper]\ntags: [Pencil by 53, Paper for iOS, Apple, review]\nlast_modified_at: 2018-11-06T12:04:05-05:00\nimage:\n  path: &image /assets/images/pencil-53-feature.jpg\n  width: 1920\n  height: 673\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments_locked: true\ntoc: true\n---\n\nFor the last year I've been using FiftyThree's [first hardware product]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}), **Pencil**. A Bluetooth stylus that was designed to work seamlessly with Paper for iPad by delivering an experience that feels closer to \"the real thing\" than any other styli.\n\n## Look and feel\n\nThe *Walnut* and *Graphite* finishes both look beautiful. If pressed to pick a favorite, I would probably choose Graphite, just because it feels heavier and more solid to me. But there is something nostalgic and comforting about Walnut's wooden texture that makes it a close second.\n\n{% figure caption:\"Walnut and Graphite models side by side.\" %}\n![Walnut and Graphite models](/assets/images/pencil-53-walnut-graphite.jpg)\n{% endfigure %}\n\nIf you haven't noticed, Pencil is flat like a [carpenter pencil](http://en.wikipedia.org/wiki/Carpenter_pencil), which keeps it from rolling about and getting lost[^magnet]. Because of the wide and flat shape, I did find it uncomfortable to hold at first. Although after a few more drawing sessions it was hardly a concern as my hand quickly adapted to Pencil's contour.\n\n[^magnet]: The Walnut model has a built in clip that allows it to stick to an iPad Smart Cover magnetically --- magnets, how do they work? Cool party trick but not something I don't use all that often.\n\nBetween the two finishes, Walnut is lighter and softer to the touch with a wood texture allowing for more grip. Because of Graphite's slick finish I occasionally had to readjust how I held it. When trying to fill in large continuous tones of watercolor I noticed it slipping the most. Slightly annoying sure, but not a deal breaker by any means.\n\nSimilar to Paper, Pencil shares the same minimally designed aesthetic --- that means no buttons, no battery indicator lights[^led-light], and no on/off switches. I love how the UI in Paper doesn't get in your way, and it's refreshing that Pencil's design echoes this theme. Common tasks like erasing or [blending]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}) become more natural, without the need to open the tool tray or press buttons. Want to erase something? Flip Pencil upside down and erase a mistake like you would \"in real life.\" Need to soften pencil strokes? Use your finger to smudge the pixels. \n\n{% figure caption:\"So I lied. There is one LED light hidden inside, only visible when charging Pencil via USB.\" %}\n![Pencil's battery charging in USB port](/assets/images/pencil-53-usb-charging.jpg)\n{% endfigure %}\n\n[^led-light]: A LED light does exist, but it is not visible during normal use. When the battery is plugged into a USB port an amber light can be observed as it charges. If you do need to check how much charge is left on your Pencil you can find them under Settings > Pencil in the Paper app along with a Serial Number and Firmware Version.\n\n## Just the tip\n\nTo be honest I was a little disappointed when I discovered Pencil's tip wouldn't be pressure sensitive like the one in a [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}). It took some time but with the recent addition of **Surface Pressure** to Pencil + Paper, my desire to use a Pogo Connect has completely disappeared.\n\n{% figure caption:\"Close-up of Pencil’s tip and replacement packaging\" %}\n![replacement packaging](/assets/images/pencil-53-spare-parts.jpg)\n{% endfigure %}\n\nThe tip is responsive and as accurate as one can expect from the limitations the iPad's digitizer imposes on stylus makers. It is wedge shaped and offers a slightly finer point than the rubber nibs found on AluPens, Bamboos, and their capacitive tipped peers. Pencil's tip does a great job of repelling any finger grease that may accumulate on the iPad's screen --- unlike some cheap styli that simply push it around obscuring your drawing.\n\nWhen Pencil by FiftyThree originally launched drawing with the broadside of the tip had zero affect on the marks you made. That all changed when iOS and Paper grew up to versions 8 and 2.0 respectively.\n\n{% figure caption:\"This video shows Surface Pressure in all its expressiveness glory.\" %}\n{% vimeo 98146708 %}\n{% endfigure %}\n\n### Is the tip durable?\n\nPencil's tip is by no means the most durable I've used. The longevity of the rubber that encases the 14kt gold plated tip is affected by the amount of pressure you apply and how it is held. Press hard as you draw or use the tip's point more and you're going to wear it out faster. I've had tips begin to show signs of tearing in under 5 hours and others last much much longer.\n\nThese numbers are relative to the user, which makes locking in a specific number hard. Using the longer side of the tip without a doubt prolongs its age. I suggest to use that whenever filling in larger areas of color. Even if you do manage to tear through the rubber, the tips are still completely usable, albeit with some black streaking[^streaking] across the screen.\n\n{% notice %}\n#### Replacement tips\n\nThe good news is FiftyThree now offers replacement tips and erasers [in their shop](http://shop.fiftythree.com/). For $7.95 USD (+ shipping) you get two tips and an eraser for Pencil, which isn't too bad if you do a lot of drawing like me.\n{% endnotice %}\n\n[^streaking]: Black rubber streaking from the tip taring was easily cleaned off the iPad's screen by wiping with a cloth.\n\n{% figure caption:\"Close-up of drawing with Pencil’s broad side\" %}\n![drawing with Pencil's broadside](/assets/images/pencil-53-drawing-tip.jpg)\n{% endfigure %}\n\n## Will it blend?\n\nFor me [Blend]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}) is the most exciting thing about Pencil. Sure a ton of other *art* apps have smudging and blending tools, but they all break the creative flow in their implementations. FiftyThree has made this valuable tool fun and more true to *real* drawing by allowing you to switch between smudging and drawing in a fluid and natural way.\n\n{% figure caption:\"How speed affects the smudges you make.\" %}\n![Blend speed comparison](/assets/images/pencil-53-blend-comparison.jpg)\n{% endfigure %}\n\nIf you take the time to experiment with Blend I think you'll [find it fairly sophisticated](http://making.fiftythree.com/the-precision-behind-blend/). Moving your finger slowly allows the pixels beneath to be pulled and pushed around like finger-paints. Moving your finger fast over an area slightly blurs which I've found useful in creating [depth of field effects]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}) and simulating a bokeh.\n\n### Constant pressure is the key\n\nIf you're too soft with the amount of pressure you apply to the tip while drawing, Blend may trigger inadvertently. The software is usually pretty good at figuring out when you want to Blend and corrects itself before blurring something. But if you're trying to draw lightly to preserve your Pencil tips then you and *Mr. Rewind* are going to become close friends because of it.\n\nI'm curious to learn about the experiences of others using Pencil and Blend. As my tips have broken in I've noticed a loss of springiness when pressing down, which appears to decrease Pencil's overall sensitivity --- causing smudges mid-stroke. Not sure if this is a common occurrence or a symptom of me pressing too hard on the tip. Let me know your observations below in the comments section.\n\n## What about the eraser?\n\nI'm not one for erasing all that much and instead rely heavily on the Rewind gesture to undo mistakes. But for those of you who do employ the eraser tool often, you're going to love Pencil. Instead of stopping to open the tool tray, selecting the eraser, removing your mistake, and going back to a drawing tool --- you now can flip Pencil on its head and erase instantly. In combination with Surface Pressure you can get into tight to erase spots with ease --- something that is impossible to do without Pencil.\n\n{% figure caption:\"Vary the size of the eraser by using just the corner or go larger with the entire width.\" class:\"gallery-2-col\" %}\n[![erasing with the corner](/assets/images/paper-53-erasing-corner.jpg)]({% post_url /mastering-paper/2014-10-25-erasing %})\n[![erasing with the entire edge](/assets/images/paper-53-erasing-wide.jpg)]({% post_url /mastering-paper/2014-10-25-erasing %})\n{% endfigure %}\n\n{% notice %}\n#### Erasing and undoing techniques\n\nIf you're looking for more erasing techniques you're in luck. I wrote an entire guide dedicated to [correcting and covering-up mistakes]({% post_url /mastering-paper/2014-10-25-erasing %}).\n{% endnotice %}\n\n## Palm resters of the world rejoice\n\nBack in art school I trained my wrists to avoid resting on the canvas so I wouldn't smudge my work as I drew. For those new to using an iPad stylus --- resting your palms on the screen usually feels more natural. The problem is most apps don't do a good job of discerning between those resting touches and the ones being made with your stylus or finger. I'm happy to say FiftyThree delivers on the following promise:\n\n> Rest your hand on the screen, write from any angle. No calibration or setup.\n\nIn my tests I had no issues drawing with my palms resting on the iPad's screen. All of the gestures worked just fine without causing stray marks: opening the zoom loupe, rewinding mistakes, flipping through pages, and closing the tool tray.\n\n## App compatibility\n\nFiftyThree has made available a [SDK for Pencil](http://www.fiftythree.com/sdk) that other apps[^sdk-apps] can take advantage of. The first app to use the SDK was Procreate, which just so happens to be my second in command behind Paper. The current version of Procreate supports all of the same features as Paper with the exception of Surface Pressure.\n\n{% figure caption:\"Look familiar? The same Kiss to Pair interface from Paper makes its way into Procreate.\" %}\n![Connect Pencil to Procreate](/assets/images/pencil-53-procreate-connect.jpg)\n{% endfigure %}\n\nPalm rejection works to eliminate stray marks, but I did notice that you will sometimes rotate the canvas by mistake. Both smudging and erasing worked flawlessly for me.\n\n[^sdk-apps]: The following iOS apps are compatible with Pencil's unique set of features: [Procreate](https://itunes.apple.com/us/app/procreate/id425073498?mt=8&ign-mpt=uo%3D4&at=1l3v9Qw&ct=sdk-procreate), [Noteshelf](https://itunes.apple.com/us/app/noteshelf-notes-pdf/id392188745?mt=8&at=1l3v9Qw&ct=sdk-noteshelf), and Squiggle (coming soon).\n\n## Final thoughts on Pencil\n\nI'm interested to see where FiftyThree continues to take Pencil as it and Paper evolve. I'd really like to see Blend get some additional love and offer even more variation in the way that it smudges. So many possibilities...\n\n<div itemscope=\"\" itemtype=\"http://schema.org/Review\" id=\"review\" class=\"review__wrapper\">\n  <h5 itemprop=\"itemReviewed\" itemscope=\"\" itemtype=\"http://schema.org/Thing\" class=\"review__title\"><span itemprop=\"name\">Pencil by FiftyThree Review</span></h5>\n  <ul class=\"review__list\">\n    <li>\n      <span>Design</span>\n      <div class=\"review__rating\">5/5</div>\n    </li>\n    <li>\n      <span>Durability</span>\n      <div class=\"review__rating\">4/5</div>\n    </li>\n    <li>\n      <span>Value</span>\n      <div class=\"review__rating\">4/5</div>\n    </li>\n    <li>\n      <span>Overall</span>\n      <div class=\"review__rating\" itemprop=\"reviewRating\" itemscope=\"\" itemtype=\"http://schema.org/Rating\">\n        <span class=\"review-total-box\" itemprop=\"ratingValue\" content=\"4\">4/5</span>\n        <meta itemprop=\"bestRating\" content=\"5\">\n        <meta itemprop=\"worstRating\" content=\"1\">\n      </div>\n    </li>\n  </ul>\n  <div class=\"review__description\">\n    <p class=\"review__title-summary\">Summary</p>\n    <p itemprop=\"reviewBody\">If you're a casual doodler looking for a well built stylus that mimics traditional drawing utensils and have a need for palm rejection, then Pencil should be your number one choice. On the other hand if you're a pro-user who relies on pressure sensitivity to work in other iOS apps, you may be left wanting more.</p>\n    <p><small><span itemprop=\"author\" itemscope=\"\" itemtype=\"http://schema.org/Person\">Reviewed by: <span itemprop=\"name\">Michael Rose</span> </span> on <meta itemprop=\"datePublished\" content=\"{{ page.date | date: \"%Y-%m-%dT%H:%M:%SZ\" }}\"> {{ page.date | date: \"%B %d, %Y\" }}</small></p>\n    <p><a href=\"http://www.amazon.com/gp/product/B00JP12300/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00JP12300&linkCode=as2&tag=mademist-20&linkId=X4XZAPOX4S2GLXA2\" class=\"btn btn--inverse\">Buy Now</a></p>\n  </div>\n</div>\n\n## Additional resources\n\n- [Mastering Pencil by FiftyThree Guide]({% post_url /mastering-paper/2015-06-24-pencil %})\n- [My iPad stylus recommendations](/faqs/stylus-recommendations/)\n\n## Questions\n\nWant to know more about Pencil or the new features it enables --- ask away in the comments below and I'll do my best to answer.\n\n{% figure caption:\"Curious to see Pencil in action? In the back half of this time lapse video I use it to paint and smudge a portrait.\" %}\n{% youtube K2dgaV9_rCI %}\n{% endfigure %}\n\n{% include_cached affiliate-disclosure.html %}\n"
  },
  {
    "path": "src/_posts/mastering-paper/2014-12-18-color-picker.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: picking and sharing colors\"\nlast_modified_at: 2018-11-06T12:04:37-05:00\nexcerpt: \"A color picker has been added to Paper! Learn what the new tool does and how to use it.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Apple]\nimage:\n  path: &image /assets/images/paper-53-color-picker-feature.jpg\n  width: 1280\n  height: 674\n  feature: *image\ntwitter:\n  card: summary_large_image\ntoc: true\n---\n\nRe-imagined zoom tool, *check*. Expressive paint and ink tools that react to the speed and angle of your strokes, *double check*. A familiar color picker to sample, match, and adjust hues --- *triple check*. Yes that's not a typo, Paper by FiftyThree finally has a color picker.\n\nWith each major update Paper takes a forward leap into maturity as new tools and features are added. You really get the feeling that everything has been weighed to carefully balance and compliment the way you interact with the app. Almost to a fault, the tools and gestures have been designed to fade away into the UI putting the focus on what matters most --- the ink and paint being placed on the canvas.\n\n{% figure caption:\"Do you remember when Paper by FiftyThree only had 9 colors? I do.\" %}\n![original Paper by 53 color palette](/assets/images/paper-53-original-9-colors.png)\n{% endfigure %}\n\nFrom those early days of working with a constrained palette up to the addition of the [Color Mixer]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#color-mixer), selecting and manipulating color has been very important to me. The lack of a color picker has been a minor annoyance for me but I really started to feel its absence after the [launch of Mix]({% post_url /mastering-paper/2014-11-25-mix %}). Trying to accurately match color palettes when remixing ideas became a time sink that I'm glad to see finally filled.\n\n## How to use the Color Picker\n\nFirst off you need to own either the **Essentials** or **Mixer In-App purchases** to enable the Color Picker. If you have FiftyThree's Pencil then good news, all of the tools are already unlocked for you.\n\n{% figure caption:\"The Mixer is required to use the Color Picker.\" class:\"gallery-2-col\" %}\n![Paper 53 Mixer In-App purchase screen](/assets/images/paper-53-mixer-iap.png)\n![Paper 53 Essentials tools In-App purchase screen](/assets/images/paper-53-essentials-iap.png)\n{% endfigure %}\n\nTo sample a color tap on the small circle inside of the Color Mixer --- you may need to tap it a second time if it wasn't previously selected. You'll know you've done it right when an eye dropper icon appears in the circle.\n\n{% figure caption:\"The Mixer changes to an eye dropper when tapped on.\" %}\n![Color Mixer eye dropper](/assets/images/paper-53-mixer-eye-dropper.jpg)\n{% endfigure %}\n\nTapping the eye dropper icon will place a small circle onto the canvas that you can use to sample colors and add to your palette. You also have the option of refining a color by moving any of the three HSB[^hsb] sliders around, but I'll get to that in a minute.\n\n[^hsb]: HSB stands for <u>H</u>ue, <u>S</u>aturation, and <u>B</u>rightness (or Luminosity).\n\nThere's not much more to using the Color Picker. As the small circle is moved around the canvas, the color inside of it will change letting you know what color is selected. There is also a black dot in the center to help with alignment when trying to pick up a tiny speck of color.\n\n{% figure caption:\"Pretty cool how the color changes as you drag it around the canvas huh?.\" %}\n![animation of Color Picker changing colors](/assets/images/paper-53-color-picker.gif)\n{% endfigure %}\n\nWhen you've found a color you'd like to work with or save to your palette tap the circle. You can also tap the eye dropper icon inside of the Color Mixer or any of the tools in the tray to select the sampled color.\n\n{% notice %}\n#### ProTip: saving a sampled color\n\nTapping anywhere on the canvas will dismiss the Color Picker and the sampled color will not be saved to the Mixer. You have to tap the circle in the Color Picker or eye dropper for it to stick.\n{% endnotice %}\n\n### Picking colors from a photograph\n\nSampling colors with the picker tool isn't limited to just the ink, fill, and background layers --- you can also sample colors from photos. To start you'll want to import an existing image (or snap a new one with the camera).\n\nTo place a photo on the canvas tap the **camera icon**. Importing photos can be done when an idea is first created...\n\n![Paper new idea options](/assets/images/paper-53-color-new-idea.jpg)\n\nOr after the fact...\n\n![import photos in Paper](/assets/images/paper-53-color-photo-import-button.jpg)\n\nOnce you have a photo on the canvas you can sample its colors same as before:\n\n1. Tap the small circle inside of the **Color Mixer** tool.\n2. Tap the eyedropper.\n3. Drag the selector on top of the area you wish to sample.\n4. Tap the eyedropper again to work with or save to your palette.\n\n{% figure class:\"gallery-2-col\" %}\n![Color Mixer eyedropper](/assets/images/paper-53-color-photo-sample-1.jpg)\n![sampling a photo's color](/assets/images/paper-53-color-photo-sample-2.jpg)\n{% endfigure %}\n\n---\n\n## Color Picker limitations\n\n99% of the time the Color Picker will work as you expect it when placed on top of ink, marker, and pencil strokes. But when sampling the transparent strokes made by the watercolor brush or blends, you may not get the results you were expecting.\n\nLet's use these two splotches of color below as an example of what I mean. On the left is a shape painted with the watercolor brush and on the right one with the marker tool --- both filled with the same color.\n\n{% figure caption:\"Two shapes filled by two different tools with the same exact color.\" %}\n![shapes filled with the same color](/assets/images/paper-53-sampled-colors-1.jpg)\n{% endfigure %}\n\nBecause of the transparent nature of the watercolor brush, the painted shape on the left appears to be a lighter hue than the one on the right. You'd think that when dragging the Color Picker over both shapes it would sample them as two different colors, but that's not quite what happens...\n\n{% figure caption:\"Notice anything strange? According to Paper both colors are identical even though they don't look the same. Weird. Filling the page with a dark color had no effect on sampling.\" %}\n![sampling shapes filled with the same color](/assets/images/paper-53-sampled-colors-2.jpg)\n![sampling shaped filled with the same color](/assets/images/paper-53-sampled-colors-3.jpg)\n{% endfigure %}\n\nAs far as I can tell the Color Picker completely ignores the background page color when sampling --- rather than combining the page color with the transparent strokes on top of it. I'm not entirely sure if this is by design, some sort of bug, a limitation of the software, or a little of both. Before crying foul, sampling the colors on a transparent background in Adobe Photoshop produced the same exact results. So the picker doesn't seem to be broken...\n\n{% figure caption:\"Adobe Photoshop samples the fills just like Paper with both having the same color values.\" %}\n![screenshot of sampled colors in Photoshop](/assets/images/paper-53-sampled-colors-4.jpg)\n{% endfigure %}\n\nThis little gotcha is even more pronounced when sampling areas that have been heavily blended as shown below.\n\n{% figure caption:\"The discrepancy between what you see and what the picker samples is really noticeable here. I was expecting the bottom sample to be a lighter blue than what was actually picked up.\" %}\n![sampling gradations](/assets/images/paper-53-sampled-colors-5.jpg)\n{% endfigure %}\n\nPersonally I think it would be less confusing if the Color Picker was sampling the combined color that you see on screen (page color + transparent strokes on top) like **Procreate** and other drawing apps. But like I said it's more of an edge case scenario since you'll mostly be sampling opaque and layered colors.\n\n---\n\n## How to share colors\n\nDon't let that little color sampling inconsistency get you down, there's still plenty to love about the Color Picker and enhanced Mixer tools. If it wasn't clear from the sub-heading above, you can now *sort of* share colors and palettes with the Paper community. \n\nAs I've started to work with the picker more I'm beginning to see value in including color swatches in the margins of my drawings. It's a way of bringing clarity to the palette I use in a piece. Not only that, but it gives me a place to stash additional colors since my 6 palettes are more than filled up.\n\n{% figure caption:\"Placing color swatches off to the side for reference and sampling has its advantages.\" %}\n![example of color palette painting in the margin](/assets/images/paper-53-color-picker-swatches.jpg)\n{% endfigure %}\n\nAside from the new picker, the Mixer received some love by now including numeric values on each of the 3 sliders. These numbers map perfectly to HSB[^hsb] values which makes communicating the exact makeup of a color others that much easier.\n\n{% figure class:\"align-right\" %}\n![screenshot showing the HSB picker in Adobe Photoshop](/assets/images/photoshop-hsb.jpg)\n{% endfigure %}\n\nThe HSB/HLS color models are found in most desktop graphics programs like Adobe's Photoshop. By opting to include a standardized color model in Paper it is now possible to match colors across platforms and apps. As a designer I find this especially helpful for maintaining color consistency when importing Paper PNG files into Adobe Creative Suite documents.\n\n### Sharing color palettes on Mix\n\nWhen I wrote my Mastering Paper guide for [drawing portraits]({% post_url /mastering-paper/2014-04-21-drawing-faces %}) there wasn't a good way for me to share my palettes with the community. Now with the help of Mix by FiftyThree I can share my palette[^paper-palette-template] of skin tones to be sampled and used by anyone who decides to download them. \n\n[^paper-palette-template]: Thanks to Dayna D. Smith for providing the great \"[My Paper Palettes](https://mix.fiftythree.com/200794-Danya-D-Smith/1299445)\" template that I remixed.\n\n{% figure caption:\"Download my default skin tone palette for drawing portraits.\" %}\n[![my skin tone palette for drawing portraits](/assets/images/paper-53-skin-palette.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/1376457)\n{% endfigure %}\n\n---\n\n## What's up next\n\nIf you found this guide helpful stay tuned for the next one where I cover how the updated page fill feature works. I was going to include it in this guide but figured it would make more sense on its own.\n\nAs always feel free to leave comments below, ask questions, or [follow me on Twitter](https://twitter.com/mmistakes) and the like (links below in the footer).\n"
  },
  {
    "path": "src/_posts/mastering-paper/2015-01-02-drawing-outer-space.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: drawing outer space\"\nlast_modified_at: 2018-11-06T12:05:00-05:00\nexcerpt: \"Learn how to draw outer space scenes filled with stars, galaxies, planets, black holes and more with Paper for iOS and a Pencil stylus.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial, Pencil by 53, Apple]\nimage:\n  path: &image /assets/images/paper-53-space-feature.jpg\n  width: 1280\n  height: 589\n  feature: *image\ntwitter:\n  card: summary_large_image\ntoc: true\n---\n\nDrawing the *night sky*, *stars*, *galaxies*, *planets*, and other *celestial bodies* is a ton of fun with Paper, the iPad app by FiftyThree. Much like [drawing blue skies and clouds]({% post_url /mastering-paper/2013-09-05-drawing-clouds %}), it is very hard to screw them up if you follow a few simple guidelines.\n\nIn this Paper by FiftyThree tutorial I'll start by walking you through my process of painting an outer space scene using only a finger. Then, I'll demonstrate how to paint another one using [FiftyThree's Pencil stylus]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}) instead. Taking advantage of **Surface Pressure** and [**Blend**]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}) I find the effects are easier and faster to pull off with Pencil.\n\nOh and I'm trying something different with this guide. I've toyed around with short videos before, but this time I'm including two that can stand on their own as full blown tutorials. Editing together footage shown from two different angles, each video documents the entire drawing process from start to finish.\n\nBoth videos are fully annotated[^annotated] with notes and tips throughout, so be sure to watch directly on [Youtube.com](https://www.youtube.com/user/anotherjpeg/) for the best experience. Don't worry, for those of you who learn better with pictures and text I'm still including all that detail below --- just scroll past the videos that begin each section to jump ahead.\n\n[^annotated]: As far as I know YouTube annotations only appear on the actual YouTube.com website and not on mobile devices or from within the YouTube app.\n\nAnd with that let's get started.\n\n## Painting outer space with your finger\n\n{% figure caption:\"How to draw and paint an outer space scene with only your finger and Paper by 53.\" %}\n{% youtube myAwO2k23q4 %}\n{% endfigure %}\n\n### Cover the canvas\n\nStart by covering the canvas with a dark color. For this technique to work properly you need to draw it in manually. The page fill \"shortcut\" has some limitations with how colors are applied to it that won't give the effect we need. To learn more about why that is, be sure to check out my guide on [Paper's Color Picker]({% post_url /mastering-paper/2014-12-18-color-picker %}).\n\n{% figure caption:\"Stroke size increases with speed allowing you to fill in the background faster in you swipe fast.\" %}\n![using your fingers to ink in the canvas with black](/assets/images/paper-53-space-canvas-fill.jpg)\n{% endfigure %}\n\n### Star clusters and flow\n\nUse white or a tint to lighten the dark background and lay the ground work for the composition. Using a photographic reference helps, but you can free-form things and just let things unfold organically as you glide your fingers across the canvas.\n\n{% figure caption:\"Mixing up a bright blue tint to lighten the black background.\" %}\n![screenshot of light blue color](/assets/images/paper-53-space-lighten-bg-color.jpg)\n{% endfigure %}\n\nTo create smooth tones keep your finger on the screen and use circular motions to soften the edges. The goal is to avoid leaving harsh edges as much as possible.\n\n{% figure caption:\"Move slowly to define the shapes and faster around the edges to blur them.\" %}\n![lightening the background with a finger and white](/assets/images/paper-53-space-lighten-bg.jpg)\n{% endfigure %}\n\n{% figure caption:\"For areas that are dense with stars apply multiple layers of white to brighten them up.\" %}\n![screenshot of zoomed in lightened background](/assets/images/paper-53-space-lighten-bg-2.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: smaller brush sizes\n\nWhen using the zoom loupe the watercolor brush's size scales down. Use this to your advantage to paint thinner strokes and fill smaller shapes.\n{% endnotice %}\n\n#### Blue glazes\n\nStarting with a light blue color, apply a watercolor glaze to the left side of the composition. You don't have to worry about being precise since it will only show on the lighten areas painted with white. Because we filled in the background with black earlier, any color that happens to bleed won't be visible.\n\n![screenshot of painting a blue glaze](/assets/images/paper-53-space-blue-glaze-1.jpg)\n\nWhen glazing with the blue color, the same technique used when painting with white should be observed. Keep your strokes controlled and smooth. Move your finger slowly across the screen making sure not to [lift it off the screen]({% post_url /mastering-paper/2014-09-16-watercolor-brush-update %}) for more than a second. Doing so will indicate to Paper that a new stroke was made and you will see a visible seam between the values.\n\n{% figure caption:\"Building up the blues with many layers (or glazes) of watercolor.\" %}\n![screenshot of darkening blue with layered watercolor strokes](/assets/images/paper-53-space-blue-glaze-2.jpg)\n{% endfigure %}\n\nTo create the illusions of depth, add more glaze layers towards the outsides of the shapes. This will aid in creating clusters of stars later by leaving bright pockets of light near the centers.\n\nFeel free to adjust the blue color's darkness by moving the color sliders around. Don't go too far with it though. Multiple layers of lights generally look better than a single dark layer.\n\n#### Fuchsia glazes\n\nRepeat the exact same process on the right half of the composition now, this time using a fuchsia or violet hue. When you finish you should have something that vaguely resembles the following.\n\n{% figure class:\"gallery-2-col\" %}\n![screenshot of mixing a fuchsia color](/assets/images/paper-53-space-violet-glaze-1.jpg)\n![screenshot of finished fuchsia glazes](/assets/images/paper-53-space-violet-glaze-3.jpg)\n{% endfigure %}\n\nIf things went too dark mix a tint of blue or fuchsia (depending on where you want to lighten) and dab your finger quickly to recover some brightness. Use your best judgment and correct as needed. There may be some back and forth needed between tints and darks to get the gradients looking just right.\n\n{% figure caption:\"Quickly dab in strokes of watercolor filled with a white color to bring up the brightness.\" %}\n![lightening the blue and violet glazes with white and your finger](/assets/images/paper-53-space-lightening-glazes.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: paint fast with white\n\nMove quickly when using a watercolor brush loaded with white. Go too slow and it'll turn pure white way too fast.\n{% endnotice %}\n\n### Placing stars with your fingers\n\nNow begins the tedious process of placing stars one by one. I like to start with a medium to dark color that is in the family of the area I'm placing them. Starting on the blue side first we'll want to mix up a star color that is... bluish --- what a shocker! Using Paper's Color Picker makes things so much easier. Just sample a blue spot you painted earlier and then manipulate the sliders to get the intensity right.\n\n{% figure caption:\"Mixing a medium-dark blue to lay down some stars with.\" %}\n![screenshot of blue star color](/assets/images/paper-53-space-blue-stars.jpg)\n{% endfigure %}\n\nTry to use your fingertip with a controlled tapping motion. If you strike the screen and drag your finger at all, a small streak will appear instead of a dot. If this happens use the [Rewind gesture to undo](https://support.fiftythree.com/hc/en-us/articles/203385492-Drawing-Tools#rewind) any mistakes.\n\n![using a fingertip to create stars](/assets/images/paper-53-space-blue-stars-finger.jpg)\n\nThe more stars you add the more pronounced the effect. Varying the size of the stars and bumping up the brightness as you work helps as well. I strongly suggest using just the pencil tool and avoiding the pens and marker. The pencil is semi-transparent and in my opinion looks more natural than the others.\n\nTapping in the same spot a few times is an effective way of brightening a star. Using your finger tip isn't that accurate so it can take a few Rewinds to get the placement just right.\n\n{% figure caption:\"Increase the size or brightness of a star by placing more dots closing to each other.\" %}\n![screenshot of zoomed pencil stars](/assets/images/paper-53-space-bright-star.jpg)\n{% endfigure %}\n\nAs before, when you move over to the fuchsia and violet half of the space scene, select matching star colors. Glazes can be applied to darken clusters of stars further adding to the realism --- the same goes for using white to lighten. There really is no right or wrong way to approach it, so feel free to experiment and find what works best for you.\n\n{% figure caption:\"Stars that may have gone too bright can be harmonized by painting over with matching watercolor glazes.\" %}\n![screenshot of stars glazed with violet watercolor](/assets/images/paper-53-space-violet-star-glaze.jpg)\n{% endfigure %}\n\n### Two worlds\n\nAn outer space scene wouldn't be complete without a planet or two, so let's remedy that shall we?\n\n![screenshot of planet placement](/assets/images/paper-53-space-planet-placement.jpg)\n\nThe hardest part of world building is deciding where to place the planet(s). Since I've cut the composition in half, it would seem to make the most sense placing a planet on each side.\n\nPick a white or tint color and switch to the fountain pen tool. Then place your finger on the canvas where you'd like the planet to appear and hold it for a few seconds. The longer you press the bigger the dot gets.\n\n{% figure caption:\"After mixing a light color press and hold with the fountain pen to create a large dot.\" class:\"gallery-2-col\" %}\n![mixing a light color to create a planet with](/assets/images/paper-53-space-mix-planet-color.jpg)\n![tap and hold with the fountain pen to create a large dot](/assets/images/paper-53-space-dot-planet.jpg)\n{% endfigure %}\n\nI'm placing my first planet off in the violet portion of space so I'll want to mix up a similar hue. Using the watercolor brush, paint glazes over the white dot, gradually moving further and further away from one of the edges. In this example I'm moving towards the left to leave a highlight on the right side.\n\n{% figure class:\"gallery-3-col\" %}\n![screenshot of glazing a planet with violet watercolor](/assets/images/paper-53-space-f-planet-1.jpg)\n![screenshot of glazing a planet with violet watercolor](/assets/images/paper-53-space-f-planet-2.jpg)\n![screenshot of glazing a planet with violet watercolor](/assets/images/paper-53-space-f-planet-3.jpg)\n{% endfigure %}\n\nContinue adding glazes until one side fades completely into the blackness of space. To speed up the process increase the darkness of the color you're painting with.\n\nOnce satisfied with the results repeat the process for as many other planets as you want.\n\n{% figure caption:\"[**Two Worlds Apart**](https://mix.fiftythree.com/11098-Michael-Rose/1575972) is available on Mix for downloading and remixing. Feel free to add more stars, planets, or whatever else you'd like.\" %}\n[![finished space scene painted with just a finger](/assets/images/paper-53-space-scene-1-f.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/1575972)\n{% endfigure %}\n\n---\n\n## Painting outer space with Pencil (stylus)\n\nBuilding on the same techniques used in the first half of this guide, I'm going to now show you how Pencil can be used to enhance and speed things up. For the most part you follow the exact same steps with a few embellishments to ratchet up the realism.\n\n{% figure caption:\"How to draw and paint an outer space scene with Pencil and Paper by 53.\" %}\n{% youtube pdSp4Y4GOQs %}\n{% endfigure %}\n\nIf you haven't already paired Pencil with Paper do so now. I find it helpful to go into Pencil's settings and turn off Blend[^blend-off] until I need it. This avoids any unwanted smudges from appearing when not applying enough pressure with Pencil's tip.\n\n[^blend-off]: To turn off the Blend feature tap the icon in the upper right corner of Paper while in the journal view. Then tap **Pencil** > **Finger** and change the default behavior from Blend to **Nothing**.\n\n### Covering the canvas part 2\n\n![using Pencil to fill in a blank canvas](/assets/images/paper-53-space-2-bg-fill-pencil.jpg)\n\nJust like with the first outer space scene, you will want to cover the canvas in a dark color using the fountain pen or marker tools. By using the wide side of Pencil's tip you can cover the screen much faster. The rubber here is more durable and doesn't tear as quickly at the tip. Anytime you have the opportunity to draw with the broad side versus the tip --- take it.\n\n### Building a background and star clusters part 2\n\nI'm going to speed through these next set of steps since they're exactly the same as before. The only difference being they will be done with the Pencil stylus instead of your finger.\n\n{% figure caption:\"Lighten the black using the watercolor brush and a white or tint color.\" %}\n![lightening the black background with white and Pencil](/assets/images/paper-53-space-2-bg-lighten.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: turn Pencil on its side for a different drawing experience\n\nHold Pencil on its side to move more quickly and organically through the composition.\n{% endnotice %}\n\n{% figure caption:\"Add extra layers of white to brighten an area. The centers of the cloud like shapes are good locations for these highlights.\" %}\n![screenshot of lightening the black background with white](/assets/images/paper-53-space-2-lightening-bg-2.jpg)\n{% endfigure %}\n\nAfter you've lightened the background and are happy with the shapes created, decide on what color or colors you want the background to be. For this scene I think a rainbow-ish gradient with a bunch of colors might look interesting.\n\n{% figure caption:\"Starting with a light blue, apply glazes on top of each other to create smooth transitions from light to dark.\" %}\n![screenshot of light blue glaze](/assets/images/paper-53-space-2-light-blue-glaze.jpg)\n{% endfigure %}\n\nRemember to take your time with the watercolor brush and don't be tempted to use too dark of a color. This isn't a race!\n\n{% figure caption:\"With the blue portion of the space scene laid down move into the yellow and orange colors towards the middle of the composition.\" %}\n![screenshot of yellow glaze](/assets/images/paper-53-space-2-yellow-glazes.jpg)\n{% endfigure %}\n\n{% figure caption:\"Finishing with red glazes towards the right half that blend seamlessly from blue to yellow to red.\" %}\n![screenshot of finished background glazes](/assets/images/paper-53-space-2-finished-bg-glazes.jpg)\n{% endfigure %}\n\n### Dropping in a planet\n\nI've decided to place a medium sized planet towards the upper left corner. Because I'm opting for something larger the \"tap and hold dot trick\" used in the first drawing won't work this time --- it caps out at around an inch in diameter.\n\nSince it's pretty difficult to draw a perfect circle freehand I'm going to trace a cylinder. I just so happen to have part of a rotary cutter that is the size I need, so that's what I'm using. The box that Pencil ships in is a good alternative if you don't have anything else to trace.\n\n{% figure class:\"gallery-2-col\" %}\n![tracing around a rotary cutter with Pencil stylus](/assets/images/paper-53-space-2-circle-trace.jpg)\n![screenshot of a circle outline](/assets/images/paper-53-space-2-circle.jpg)\n{% endfigure %}\n\nPlacing the object directly on the iPad's screen, carefully trace around its edge. It may be hard to match up the lines exactly on your first go so just Rewind to undo until you get it right.\n\n{% notice %}\n#### Update: perfect circles\n\nSince writing this tutorial Paper was updated with [**Think Kit**](http://www.fiftythree.com/think). Now drawing perfect lines and shapes is only a swipe away in the tool tray.\n{% endnotice %}\n\nWith the outline complete, use the watercolor brush with a white (or tint) to fill it in. It's ok if your strokes bleed outside of the lines some, it adds to the glowing effect we're trying to accomplish. Plus we're going to lightly blend the edges anyways so any mistakes made now will be down played later.\n\n![screenshot of filled circle](/assets/images/paper-53-space-2-filled-circle.jpg)\n\nNext decide on what color you want your planet to be and begin painting over the white fill. For my scene I choose to paint with a dull red, being careful to stay within the lines as not to distort the circle's shape too much.\n\n{% figure caption:\"Build up layers of color to create a smooth gradation throughout the planet's surface.\" %}\n![screenshot of painting a planet](/assets/images/paper-53-space-2-planet-color.jpg)\n{% endfigure %}\n\nUsing the same process as before, leave one of the planet's edges exposed as you darken it. This will make it appear more three-dimensional as the tones are built up from light to dark.\n\n![screenshot of painting a dark shadow across a planet](/assets/images/paper-53-space-2-planet-shadow.jpg)\n\nI started to lose the shape of the circle because I was painting pretty fast. To correct it I darkened the lower left corner until it merged with the rest of the scene. Depending on what color the background is, these sorts of mistakes may be harder to cover-up.\n\n{% notice %}\n#### ProTip: use a stencil if you're a messy painter\n\nTo help stay in the lines a [stencil](http://www.amazon.com/gp/product/B000FPYQ14/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B000FPYQ14&linkCode=as2&tag=mademist-20&linkId=GLP5SABXVPYTF7PT) can be used. Simply hold it steady on the iPad's screen as you paint glazes with Pencil inside of it.\n{% endnotice %}\n\n#### Refining a planet\n\nAfter you finish filling in the planet, now is a good time to modify Pencil's settings and turn Blend[^blend-off] back on (if you previously turned it off like I did).\n\n{% figure class:\"gallery-2-col\" %}\n![blending the planet's edge with a finger](/assets/images/paper-53-space-2-planet-blend-1.jpg)\n![screenshot of a planet with the edges smudged](/assets/images/paper-53-space-2-planet-blend-2.jpg)\n{% endfigure %}\n\nUsing the tip of your finger, quickly swipe along the planet's edge in an arc like motion. This will blur strokes and colors at the edge while retaining the circle's shape. With the right amount of speed you should end up with a something that resembles a glowing orb.\n\n![screenshot of lightening a planet with white watercolor](/assets/images/paper-53-space-2-planet-lightening.jpg)\n\nTo correct any shape distortions that occur from smudging too much, paint in bursts of whites and darks over the problem areas. Repeating the painting and blending steps as many times as necessary. It helps to think of the colors on screen as pixels of sand that can be pushed around with your finger tips.\n\n![screenshot of penciling in highlights](/assets/images/paper-53-space-2-planet-edge.jpg)\n\n{% notice %}\n#### ProTip: smoothen edges with a Pencil stroke\n\nFine pencil lines along the sides work well to redefine a bumpy or irregular shaped curve.\n{% endnotice %}\n\n#### Detailing a planet\n\nBecause this planet is larger than the first set I painted, there's plenty of room to sketch in craters and other textures. Use the Color Picker to sample the planet and mix up a lighter variation of it. With a color selected use the pencil tool to scribble in craters and holes, giving the planet detail. By flipping Pencil on its side you can use Surface Pressure to add even more detail with a grainy charcoal like texture.\n\n![screenshot of planet details drawn with pencil](/assets/images/paper-53-space-2-planet-details.jpg)\n\nI didn't spend too much time detailing my planet, but that's not to say you shouldn't. Building off of the techniques used in my other guides, painting glazes on top of the [penciled textures]({% post_url /mastering-paper/2013-11-25-drawing-textures %}) will further enhance the realism.\n\n### Tapping stars with Pencil\n\nYou guessed it, time to tap in a ton of stars again. Using a stylus like Pencil instead of your finger makes it much easier to accurately place hundreds of stars.\n\n{% figure caption:\"This first pass of stars is hard to see but that's ok. As you add more stars, increase their brightness to help make them sparkle.\" class:\"gallery-2-col\" %}\n![tapping Pencil to create dots that look like stars](/assets/images/paper-53-space-2-stars-pencil.jpg)\n![screenshot of blue stars drawn with Pencil](/assets/images/paper-53-space-2-stars-pencil-2.jpg)\n{% endfigure %}\n\nJust like before pick a star color that relates to your background. Start with a medium tone first and cover the canvas in stars before gradually using a lighter one. Save the bright star clusters for those light center spots --- it will look more natural that way.\n\n{% figure caption:\"Detail of stars that have been slightly glazed with blue watercolor.\" %}\n![detail screenshot of blue stars drawn with Pencil](/assets/images/paper-53-space-2-blue-stars-detail.jpg)\n{% endfigure %}\n\n#### Star variations\n\nMethods used earlier to vary the stars size and brightness are still fair game. If you're using Pencil and have blending enabled, there's a new trick available to you.\n\nYou may remember in the first part of this guide I cautioned against using the ink tools for making stars. Well if you blend ink dots with fast smudges they turn into glowing orbs. It's a great effect that can add interest to the composition.\n\n{% figure caption:\"Swiping your finger quickly over a large white star will create a glow orb. You can even make trails by pulling your strokes slowly and smearing the star.\" %}\n![screenshot of blended stars](/assets/images/paper-53-space-2-blended-stars.jpg)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: simulate glow with white paint\n\nIf you don't have a Pencil stylus, glowing orbs can also be created by dabbing a star with white watercolor.\n{% endnotice %}\n\nJust like earlier, star clusters can be lightened or darkened by glazing over them with the appropriate colors. If you do decide to lighten sections be sure to move fast as you risk going too white when lingering in one spot.\n\n{% figure caption:\"[**One Dying Star**](https://mix.fiftythree.com/11098-Michael-Rose/1534984) is available on Mix for download and remixing. Do as you please with my painting.\" %}\n[![finished space scene drawn with a Pencil stylus](/assets/images/paper-53-space-2-finished.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/1534984)\n{% endfigure %}\n\n---\n\n## Two more things\n\nThere are two other techniques I wanted to share that felt out of place above so I'm dropping them here. These both require you to have FiftyThree's Pencil stylus and the Blend feature enabled.\n\nIf you place strokes of colors on top of a dark background and then slowly smudge upwards, an effect that mimics the aurora borealis can be achieved.\n\n{% figure caption:\"Direction and speed really matter here. The slower you move the further the color can be *pulled*.\" %}\n[![a blended aurora in space](/assets/images/paper-53-space-aurora-blend.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/1576095)\n{% endfigure %}\n\nA slightly modified approach to this technique can be used to create black holes. Instead of using slow upward smudges, you pull in a circular motion.\n\n{% figure caption:\"Obviously further refinement and the addition of stars needs to happen, but for five minutes of blend work it's not bad.\" class:\"gallery-3-col\" %}\n[![screenshot of drawing a black hole step 1](/assets/images/paper-53-space-blackhole-1-600.jpg)](/assets/images/paper-53-space-blackhole-1-lg.jpg)\n[![screenshot of drawing a black hole step 2](/assets/images/paper-53-space-blackhole-2-600.jpg)](/assets/images/paper-53-space-blackhole-2-lg.jpg)\n[![screenshot of drawing a black hole step 3](/assets/images/paper-53-space-blackhole-3-600.jpg)](/assets/images/paper-53-space-blackhole-3-lg.jpg)\n{% endfigure %}\n\n---\n\nWell I guess that's about it. Since doing video tutorials is fairly new for me (and super time intensive) let me know what works and what doesn't. The best way you can do that is by liking the videos, subscribing to [my YouTube channel](https://www.youtube.com/user/anotherjpeg), and leaving comments. Thanks!\n"
  },
  {
    "path": "src/_posts/mastering-paper/2015-04-15-faux-layer.md",
    "content": "---\ntitle: \"Mastering Paper for iOS: faux layer technique\"\nlast_modified_at: 2018-11-06T12:05:21-05:00\nexcerpt: \"Discover the faux layer technique and how it can aid in sketching and tracing with Paper for iOS.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, tutorial]\nimage:\n  path: &image /assets/images/paper-53-faux-layers-feature.jpg\n  width: 1280\n  height: 450\n  feature: *image\ntwitter:\n  card: summary_large_image\ntoc: true\n---\n\nUp until recently I would painstakingly erase and Blend away lines until I got them just right when drawing with Paper by FiftyThree.\n\nWhen [version 2.2](http://news.fiftythree.com/post/104844221313/paper-update-2-2-holiday-bonus-edition-happy) was released this past December, along with it came a Color Picker and a way to swap page colors whenever you wanted. Using these new features and a carefully mixed color, I'm going to show you how a \"faux\" layer can help with sketching and tracing.\n\n## Replicating the background color\n\nHave you noticed that the default page color in **Paper by FiftyThree** isn't a pure white? If you haven't here's a quick comparison between the two that makes the difference obvious.\n\n{% figure caption:\"Default background color compared against pure white.\" %}\n![white comparison](/assets/images/paper-53-default-white.png)\n{% endfigure %}\n\nThe key to the \"faux\" layer trick is matching the color you sketch with exactly to the default background color.\n\n{% figure caption:\"Default background color mix: **48**/**2**/**96**\" %}\n![default background color](/assets/images/paper-53-default-background-mix.jpg)\n{% endfigure %}\n\nThere's two ways of getting this color into your Paper palette:\n\n1. Use the [Color Picker]({% post_url /mastering-paper/2014-12-18-color-picker %}) eyedropper to sample an empty spot on the canvas.\n2. Tap the small circle inside of the [Color Mixer]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#color-mixer) and adjust the 3 sliders to have the following values (48/2/96).\n\nWhichever way you end up choosing I suggest you drag this newly mixed off-white color to an open slot in one of your palettes --- for safe keeping of course.\n\n{% figure caption:\"Drag a color to an open palette slot and release to save it.\" %}\n![dragging color swatches](/assets/images/paper-53-drag-color-swatch.jpg)\n{% endfigure %}\n\n## Setting the background\n\nIf you were to start sketching now it would look like you weren't drawing anything at all. To make these off-white lines more visible, we need to fill in the background with a contrasting color. In this example I went with a gray, but you can choose whatever color you want (we'll delete it later so don't agonize over the perfect color selection).\n\nTo fill in the background, simply drag a swatch from one of your palettes (or the [Color Mixer]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#color-mixer)) onto the canvas. When done correctly it should fill in the entire background leaving you with something like this:\n\n{% figure caption:\"Quickly fill in the background by dragging a color onto the canvas and releasing.\" %}\n![dragging a color to the background](/assets/images/paper-53-filled-gray-background.jpg)\n{% endfigure %}\n\n## Sketching with white\n\nNow the fun begins! Select the off-white color you sampled/mixed earlier and begin sketching.\n\n{% figure caption:\"Sketching in off-white with the expectation of tracing over it with a darker color.\" %}\n![white sketch layer](/assets/images/paper-53-white-sketch-layer.jpg)\n{% endfigure %}\n\nAs you sketch don't worry about whether your strokes are perfect, they won't be part of the finished drawing so be loose and free with them.\n\n{% notice %}\n#### ProTip: sketch with the pencil tool\n\nTo yield the best results with the \"faux\" layer technique I suggest using the pencil tool. It blends into the default page color better than the harsh edges produced by the ink tools.\n{% endnotice %}\n\n## Tracing your drawing\n\n{% figure caption:\"Select a darker color to trace over the white sketch with.\" %}\n![selecting a darker color](/assets/images/paper-53-tracing-layer-dark.jpg)\n{% endfigure %}\n\nOnce you get the general composition of your drawing locked down you'll want to change the color to something darker. Depending on the background color you initially filled the canvas with you may need to adjust it so these new strokes show up.\n\nUsing the rough sketch as a guide trace over the white lines with a tool and color of your choice. I used a single color for my tracing but if you happen to change your color as you work it may be necessary to alter the background. You'll know this is the case when your tracing blends into the background making it difficult to tell if you're laying down a mark.\n\n{% figure caption:\"Continue tracing your white sketch and add shadows and other details as you desire.\" %}\n![tracing and shading over white](/assets/images/paper-53-tracing-shading.jpg)\n{% endfigure %}\n\nIn the example above I took the tracing one step further by adding dark shadows using a [cross-hatching technique]({% post_url /mastering-paper/2014-02-09-basics %}#ink-techniques). This step is completely optional, you really just want to establish enough contours and values to \"inform\" the drawing.\n\n## Erasing the faux layer\n\n{% figure caption:\"Tap and hold on the Eraser tool and then select **Clear Page Color**.\" %}\n![clear page color option](/assets/images/paper-53-clear-page.jpg)\n{% endfigure %}\n\nOnce you're happy with things the next step is to remove all of the white lines. If you tap and hold on the Eraser tool for 2 seconds you'll be given the option to **Clear Ink** or **Clear Page Color**. \n\nTap **Clear Page Color** and watch as the background and rough sketch disappear, leaving behind a pristinely traced image.\n\n{% figure caption:\"All that remains now is the traced drawing.\" %}\n[![finished contour drawing](/assets/images/paper-53-removed-faux-layer.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2808345)\n{% endfigure %}\n\nNow you can continue adding to page by drawing and painting on top of what remains. I think you'll find this method is so much faster than having to carefully [erase or Blend away lines]({% post_url /mastering-paper/2014-10-25-erasing %}) from an \"under-drawing.\"\n\n{% figure caption:\"And here is how the faux layer trick for Paper by FiftyThree looks in sequence.\" %}\n![faux layer trick process animation](/assets/images/paper-53-faux-layers-process.gif)\n{% endfigure %}\n\n## Other uses\n\nBecause I mostly do portrait work it never crossed my mind that this technique could have other applications.\n\n<blockquote class=\"twitter-tweet\" lang=\"en\"><p><a href=\"https://twitter.com/mmistakes\">@mmistakes</a> your dark background trick is sweet. now i&#39;m trying to make a grid based on that idea: even sweeter.</p>&mdash; Ron Jeffries (@RonJeffries) <a href=\"https://twitter.com/RonJeffries/status/587650836018438144\">April 13, 2015</a></blockquote>\n<script async src=\"//platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n\nI think Ron is onto something and brings up a great use for the faux layer method. In a previous Mastering Paper tutorial I showed how [using grids]({% post_url /mastering-paper/2014-07-06-grid-method %}) could help a beginner draw more accurately. Creating a grid comprised of off-white lines would sure make hiding them a breeze don't you think?\n\n{% figure caption:\"Grid template available for free on FiftyThree's Mix service.\" %}\n[![grid template](/assets/images/paper-53-mix-grid-template.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2854744)\n{% endfigure %}\n\nSo with that in mind here's a [grid template](https://mix.fiftythree.com/11098-Michael-Rose/2854744) I shared on Mix. Save it to your Paper journal, remix your own variations for others to build off of, or share what you created with it on Mix or in the comments below.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2015-06-24-pencil.md",
    "content": "---\ntitle: \"Mastering Pencil by FiftyThree\"\nlast_modified_at: 2017-12-14T10:58:22-05:00\nexcerpt: \"Learn how to use Pencil by FiftyThree and features like Blend and Surface Pressure to pull off impressive effects and techniques in Paper for iPad and iPhone.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, Pencil by 53, tutorial, Apple]\nimage:\n  path: &image /assets/images/mastering-pencil-feature.jpg\n  width: 1280\n  height: 522\n  feature: *image\ntwitter:\n  card: summary_large_image\ntoc: true\n---\n\nNot convinced you need *FiftyThree's Pencil stylus* in your life? Or maybe you just want to level-up your skills? This guide covers both by revealing the kinds of Surface Pressure and Blend secrets that will turn you into a Pencil master.\n\n## What makes Pencil so unique and special?\n\n[Pencil by FiftyThree][buy-pencil] is not like other styli designed to work with Apple's iPad tablet. The unique shape and meticulously crafted finishes (*Walnut*, *Graphite*, and *Gold*) are the obvious differentiators, but it's the experiential qualities that truly sets it apart from the rest.\n\n![Pencil by FiftyThree](/assets/images/pencil-53-feature-900.jpg)\n\nFor the uninitiated, Pencil allows you to switch between tools in an intuitive and natural way when working with Paper (and [apps that support FiftyThree's SDK](http://www.fiftythree.com/pencil-ready \"Pencil ready iOS apps\")). Bounce between drawing, erasing, and blending without ever having to \"switch tools\" --- the tip draws, the eraser erases, and your finger smudges.\n\n{% figure caption:\"Switching between modes of working is a breeze with Pencil.\" class:\"gallery-3-col\" %}\n[![photo of drawing with Pencil](/assets/images/pencil-53-draw-600.jpg)](/assets/images/pencil-53-draw-lg.jpg)\n[![photo of erasing with Pencil](/assets/images/pencil-53-erase-600.jpg)](/assets/images/pencil-53-erase-lg.jpg)\n[![photo of blending with Pencil](/assets/images/pencil-53-blend-600.jpg)](/assets/images/pencil-53-blend-lg.jpg)\n{% endfigure %}\n\nPaper's tools have a level of expressiveness that I've yet to see matched by other iPad apps. Pencil augments each of them with improved accuracy, finer controls, and a sort of intelligence that reduces unwanted marks --- allowing you to rest your wrists on the screen as you work.\n\n{% notice %}\n#### Pencil, a year later...\n\nApart from the addition of **Surface Pressure**, little has changed since first pairing Pencil with Paper over a year ago. It still feels great to use, still has an insanely long battery life, still enables blending, and still lets you rest your wrists on the screen without messing up your drawing.\n\nLooking for more? Read my full [Pencil by FiftyThree Review]({% post_url /mastering-paper/2014-11-28-pencil-53-review %}).\n{% endnotice %}\n\n### A different kind of tip\n\nPencil's wedge shaped tip is covered in a rubbery material like many other iPad styli, but unlike these \"dumb\" capacitive siblings, Pencil's is much smarter. Using a combination of hardware + software wizardry, strokes become more expressive depending on their *speed*, *direction*, and *alignment* to the iPad's screen.\n\n![Pencil tip disassembled](/assets/images/pencil-53-tip-disassembled.jpg)\n\nThin lines are made with Pencil's fine point while wider ones are made with angled edge of the tip. No other stylus I know of has this ability, making Pencil feel less like a digital tool and more like a real piece of charcoal or graphite (without the mess of course). Oh, and in case you were wondering, the [tip is user replaceable](http://www.amazon.com/gp/product/B00MM4KD4U/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00MM4KD4U&linkCode=as2&tag=mademist-20&linkId=SIDCNA73WKOEKRHM) too.\n\n### A built-in eraser\n\nWhat would a pencil be without an eraser? Well FiftyThree's Pencil has one of those too. When you want to erase something you just flip Pencil on its head and glide the rubbery edge over the mistake to remove it.\n\n![Pencil's eraser and replacement](/assets/images/pencil-53-eraser-replacements.jpg)\n\nSize can be controlled by making contact with the eraser's corner (for small mistakes) or the entire surface to remove a larger area. Just like the tip the eraser is replaceable, though I haven't needed to replace mine yet.\n\n{% notice %}\n#### Erasing and undoing\n\nIf you're looking for other erasing techniques that don't rely on Pencil's hardware eraser you're in luck. I wrote an entire guide dedicated to [correcting and covering-up mistakes]({% post_url /mastering-paper/2014-10-25-erasing %}) in Paper by FiftyThree.\n{% endnotice %}\n\n### Palm rejection\n\nI'm going to come right out and say it. \n\n> Drawing, painting, and writing digitally on the iPad's glass surface feels really weird.\n\nThankfully FiftyThree put the engineering effort into Paper and Pencil to alleviate these issues --- specifically related to palm rejection.\n\nWhen Pencil is connected to Paper (or [supporting apps](http://www.fiftythree.com/pencil-ready)), **Palm Rejection** completely transforms the drawing experience making it more accessible. \n\n{% figure caption:\"Now if the twins could only learn how to share...\" %}\n{% youtube RRYmYPf1KpY %}\n{% endfigure %}\n\nRegistering touches consistently is almost impossible for my two little girls at this age because:\n\n1. The iPad is easily confused by touches made by resting wrists and palms on the screen.\n2. Their small fingers are often ignored by the iPad's sensors.\n\nPencil makes coloring on the iPad a reality for my easily frustrated daughters without fanfare or setup --- **Palm Rejection** just works.\n\n## Setting up Pencil\n\nThere's not much you need to do before using Pencil. Upon opening the box and removing the plastic wrap you'll want to slide out the tip to charge the battery via USB. In about 90 minutes you'll be good to connect it with Paper (or any Pencil ready app) by pressing the tip to the pairing spot.\n\n![Kiss to Pair in action](/assets/images/pencil-53-kiss-to-pair.jpg)\n\nTo view more details about your Pencil (*battery level*, *firmware*, *serial number*) tap the FiftyThree logo (or your profile icon when signed into Mix) located in the upper right corner. \n\n{% figure caption:\"Screenshot of Pencil's settings in Paper app.\" %}\n![Pencil's settings in Paper](/assets/images/paper-253-pencil-settings.jpg)\n{% endfigure %}\n\n{% notice %}\n#### Finger settings: Blend, Draw, Nothing\n\nYou also have the option to toggle whether your finger **Blends**, **Draws**, or does **Nothing** when Pencil is connected to Paper. If you find Paper mistakenly smudging as you draw, switching to Nothing is a great way to prevent that.\n{% endnotice %}\n\nFor even more information on how to setup Pencil, change tips, and performing maintenance like updating the firmware --- check out [FiftyThree's Support pages](https://wetransfer.zendesk.com/hc/en-us/articles/360001368883-Pencil-by-FiftyThree). It's where I first learned about this little fix:\n\n> If you have Multitasking Gestures or Accessibility Zoom enabled, this will prevent Pencil from operating effectively. Turn off Multitasking Gestures in your iPad Settings, under **General**. Turn off **Accessibility Zoom** under *General / Accessibility*.\n> <p><cite>support.fiftythree.com</cite></p>\n\n## Surface Pressure, what's that?\n\nWhen Pencil is connected to Paper it gains enhanced control and expressiveness over the tools with a feature FiftyThree calls **Surface Pressure**. Stroke sizes become directly related to how much or how little Pencil's tips touch the screen.\n\nCurious on the range you can achieve with Surface Pressure enhanced tools?\n\n{% figure caption:\"Marks made with each tool: using the tip's point, angled edge, point while zoomed in, and angled edge while zoomed in.\" %}\n[![Surface Pressure cheat sheet](/assets/images/pencil-surface-pressure-cheat-sheet-900.jpg)](/assets/images/pencil-surface-pressure-cheat-sheet.jpg)\n{% endfigure %}\n\nIf you ask me, Surface Pressure is Pencil's killer feature. It has completely transformed how I interact with Paper by allowing me to be more loose with drawing. What does that mean exactly? Well let me show you...\n\n### By design Pencil's invites you to hold it differently\n\n{% figure caption:\"To get the most out of Surface Pressure you'll want to practice holding it with different grips.\" %}\n{% youtube vmgQpzBOOSc %}\n{% endfigure %}\n\nI like to hold Pencil as if it's a piece of charcoal and utilize the angled tip when quickly sketching. Not only does this change the characteristics of pencil strokes (I'll get to that in a minute), but it also encourages you to use your entire arm instead of just the wrist.\n\nSketching in this way is not only more fun serves a practical reason as well. By moving your entire arm you'll find that: \n  \n1. Drawing straight lines and ovals becomes much easier.\n2. You can create sensitive lines[^sensitive-lines] at will.\n3. Your drawings will have more movement and energy to them.\n4. It becomes quicker to fill in large areas of space.\n\n[^sensitive-lines]: The shifting quality of *weight*, *value*, and *texture* of a line as related to a light source, spatial position, and mass of an object.\n\n### A new tool for shading\n\nYou may have noticed in the cheat sheet above (or in your own experiments), that the sketch tool takes on new qualities with Surface Pressure. With this tool selected, the angled edge of Pencil's tip turn into wide textured strokes that resembles those made with charcoal or graphite.\n\n{% figure caption:\"Digital strokes made using the angled edge of Pencil's tip compared against those made with compressed charcoal on traditional paper.\" class:\"gallery-2-col\" %}\n[![wide sketch strokes with Pencil](/assets/images/pencil-53-simulate-charcoal-600.jpg)](/assets/images/pencil-53-simulate-charcoal-lg.jpg)\n[![strokes made with charcoal and paper](/assets/images/charcoal-drawing-600.jpg)](/assets/images/charcoal-drawing-lg.jpg)\n{% endfigure %}\n\nWide strokes made with the pencil tool overlap differently than the ink, marker, and brush tools. These \"shade\" strokes have a more defined edge and can cause color banding[^banding] in tones if not smoothed out. To better illustrate this concept here's what I consider a tone with \"blocky\" strokes.\n\n[^banding]: Abrupt changes between shades of the same color.\n\n{% figure caption:\"With every overlapping pass the tones darken with noticeable edges between the **V** strokes.\" %}\n![animation showing overlapping wide pencil strokes](/assets/images/pencil-surface-pressure-overlap.gif)\n{% endfigure %}\n\n{% notice %}\n#### ProTip: shade in circles\n\nReduce color banding by holding Pencil on its side and moving in a circular motion to evenly fill things in.\n{% endnotice %}\n\n{% figure caption:\"Spread pencil tones evenly by overlapping them with a circular motion.\" %}\n{% youtube ChJ3LSCOyoM %}\n{% endfigure %}\n\nIf you look closely at the wide strokes of the pencil (sketch) tool, you'll notice it fades from dark to light.\n\n{% figure caption:\"Closeup of a pencil stroke. Dark edge is on the top and progressively fades down into the canvas.\" %}\n![closeup of Surface Pressure pencil stroke](/assets/images/pencil-surface-pressure-pencil-fade-detail.jpg)\n{% endfigure %}\n\nIn my tests, it seems as if the placement of the darker edge is determined by the angle of the stroke. Dark points up and light points down. I've yet to find a way to reverse that, so it's worth keeping that in the back of your mind when shading horizontally.\n\n{% figure caption:\"Dark points up, light points down.\" %}\n[![Surface Pressure pencil shading angles](/assets/images/pencil-surface-pressure-pencil-fade-900.jpg)](/assets/images/pencil-surface-pressure-pencil-fade.jpg)\n{% endfigure %}\n\n### What's Surface Pressure good for?\n\nNow that you know what Surface Pressure is and roughly how it works. I thought it would be useful to show off what you can do with it in Paper by FifyThree.\n\n#### Gesture drawing and other warm-ups\n\nA great way to warm-up before doing any sort of serious drawing is with quick gesture sketches. In art school we'd start each class capturing a model's movement in a series of 2 minute poses with charcoal and conté crayons.\n\nWhen drawing with Pencil and the sketch tool you can get a look that resembles charcoal rubbed onto paper. Even better, by working digitally you avoid any of the mess from handling a stick of charcoal.\n\n{% figure caption:\"Examples of gesture drawings created with Pencil and Surface Pressure.\" %}\n[![Surface Pressure gesture drawings](/assets/images/pencil-surface-pressure-gestures-900.jpg)](/assets/images/pencil-surface-pressure-gestures.jpg)\n{% endfigure %}\n\nTo get the most out of this technique you're going to want to hold Pencil differently than you're accustomed to. Instead of a [tripod grip](https://www.ot-mom-learning-activities.com/correct-pencil-grasp.html) you'll want to wrap your fingers around Pencil and rest your thumb just below (or on) the tip.\n\n{% figure caption:\"Tripod grip on the left (good for writing), palm grip on the right (good for gesture drawing).\" class:\"gallery-2-col\" %}\n![holding Pencil with a traditional writing grip](/assets/images/pencil-tripod-grip.jpg)\n![holding Pencil with a palm grip](/assets/images/pencil-palm-grip.jpg)\n{% endfigure %}\n\nAs you sketch and draw with this *palm grip* you'll need to get comfortable with both **pushing** and **pulling** your strokes. Your entire arm and wrist should be moving --- wrist only movements will lack fluidity. To better illustrate what I mean here's a video of me drawing with the palm grip.\n\n{% figure caption:\"Gesture drawing using Pencil held in the palm grip.\" %}\n{% youtube rqBLBCfDjZU %}\n{% endfigure %}\n\nAnother great way to loosen up your arm and hand is to draw ovals over and over again. Focus on moving your entire arm in a circular motion directly above the iPad's screen. \n\n{% figure caption:\"If you take a close look you'll notice I make several practice strokes in the air above the screen before making contact with the tip. This helps achieve accurate and crisp lines without constantly rewinding mistakes.\" %}\n{% youtube k3glCSQt22M %}\n{% endfigure %}\n\n#### Shading and tone building\n\nThe same layering principles used when glazing can be applied to the pencil tool with Surface Pressure.\n\n{% notice %}\n#### Painting with watercolor\n\nIf you're new to Paper and the color tool, learn all about glazing with my [**Mastering Paper: Back to Basics**]({% post_url /mastering-paper/2014-02-09-basics %}#watercolor-brush-techniques) guide.\n{% endnotice %}\n\nSurface Pressure enabled shading does most of the hard work by automatically making marks that fade into the canvas. If you've had trouble painting smoothly with the watercolor brush, give the sketch tool a try --- it's way more forgiving.\n\n{% figure caption:\"Create smooth transitions by overlapping colors using Surface Pressure.\" %}\n![Surface Pressure pencil gradients](/assets/images/pencil-surface-pressure-tones.jpg)\n{% endfigure %}\n\nRemember, each pass with Pencil's angled tip leaves a noticeable edge when overlapped --- use this to your advantage! By being deliberate in the direction of your strokes you will help define and reinforce the form of an object. Sort of like [how hatching works]({% post_url /mastering-paper/2014-02-09-basics %}#ink-techniques), but with fatter strokes.\n\n{% figure caption:\"By curving my strokes around the contour of the tomato I let Pencil and Surface Pressure do all the work.\" %}\n{% youtube O31BPEgKrXs %}\n{% endfigure %}\n\n![Surface Pressure tomato drawings in grayscale and color](/assets/images/pencil-surface-pressure-tomatoes.jpg)\n\n{% notice %}\n#### ProTip: zoom In\n\nFor even more granularity over how fast a shade darkens, zoom in! You can get a few more levels of variation to help make a more nuanced gradation.\n{% endnotice %}\n\n## Blend, the smudge tool\n\nAs you might have guessed from the above heading, Blend lets you smudge stuff. Sadly this feature is only available to Paper when Pencil is connected, so you'll want to [pick one up](http://www.fiftythree.com/pencil \"Buy Pencil by FiftyThree\") to partake in blending fun. Trust me it's totally worth it!\n\n{% figure caption:\"Pushing pixels with your finger feels fantastic.\" %}\n![slow finger blending in Paper](/assets/images/pencil-53-finger-blending.jpg)\n{% endfigure %}\n\n### How does blending work in Paper?\n\nIt's not a tool you select like the others, triggering it is way more intuitive than that. You simply use your finger to smudge whatever it is you want to blend or blur. And like most of Paper's tools it [reacts to the speed of your movement](http://making.fiftythree.com/the-precision-behind-blend/ \"The Precision Behind Blend\") allowing dynamic control on the fly.\n\n{% figure caption:\"Speed matters. Fast strokes slightly blur objects while slow ones can be used to smudge and deform them.\" %}\n{% youtube nzfTY5rw9Q0 %}\n{% endfigure %}\n\n{% notice %}\n#### ProTip: blending with a non-Pencil Stylus\n\nIf you're looking for more control and accuracy over your blends, try a capacitive stylus instead of your finger. As long as the tip of the stylus is big enough and Pencil is connected this should work. I've had success using a [Pogo Connect][pogo-stylus] and some [cheap styli][cheap-stylus] I picked up from Amazon.\n{% endnotice %}\n\n{% figure caption:\"Using a cheap capacitive stylus to Blend instead of a finger.\" %}\n![blending with cheap capacitive stylus](/assets/images/paper-53-non-pencil-blending.jpg)\n{% endfigure %}\n\n[pogo-stylus]: {{ site.url}}{% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}\n[cheap-stylus]: http://www.amazon.com/gp/product/B00575TN42/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00575TN42&linkCode=as2&tag=mademist-20\n\n### How does blending work in other apps?\n\nApps that support FiftyThree's SDK (like Procreate) get some special abilities when connecting Pencil to them. In Procreate for example, your finger will activate the **Smudge tool** so you can freely switch between it and the Paint tool.\n\n{% figure caption:\"Seamlessly switch between painting, erasing, and smudging with Pencil and Procreate.\" %}\n{% youtube TboRri2mOVQ %}\n{% endfigure %}\n\n{% notice %}\n#### ProTip: Pencil's eraser in Procreate\n\nAnd just like with Paper, Pencil's physical eraser will trigger the eraser tool in Procreate. The current Erase tool settings will be used whenever you flip Pencil on it's top to correct mistakes.\n{% endnotice %}\n\n### Paper and Blend settings\n\nIn case you skimmed through the first half of this article where I covered Pencil's settings panel in Paper, here's the important part to gleam.\n\n{% figure caption:\"Blend/Draw/Nothing\" %}\n![screenshot of Finger settings](/assets/images/pencil-finger-settings.jpg)\n{% endfigure %}\n\nUsually Paper is good about distinguishing between the tip of Pencil and your finger to avoid unwanted blends. But if you have a lighter touch when drawing you might find that you trigger it more than you'd like. In this case I suggest flipping between **Blend** and **Nothing** to toggle it on/off when needed.\n\n### What's Blend good for?\n\nWhen used in moderation smudging and blurring your drawings can really take them to the next level. If you thought Surface Pressure was cool just wait till you see what's possible with Blend.\n\n#### Depth of field and \"bokeh\" effects\n\nThe first thing I did when experimenting with Pencil was to smudge up the background of a portrait I drew of my wife. Before Blend I was using the watercolor brush to [dab blotches of white]({% post_url /mastering-paper/2014-10-25-erasing %}#paint-with-white-to-erase) to simulate a bokeh[^bokeh] effect.\n\n[^bokeh]: In photography, bokeh is the aesthetic quality of the blur produced in the out-of-focus parts of an image produced by a lens. [Bokeh has been defined](http://en.wikipedia.org/wiki/Bokeh \"Wikipedia entry on bokeh\") as \"the way the lens renders out-of-focus points of light\".\n\nBy rubbing my finger across the background in a circular motion I was able to quickly drop it out-of-focus, creating a more realistic bokeh.\n\n{% figure caption:\"Experiment with the speed at which you move your finger. The slower the more intense the blur...\" %}\n![blending a background to simulate bokeh](/assets/images/pencil-53-wendy-portrait-blend.jpg)\n{% endfigure %}\n\nAs you blend the background pay careful attention not to cut too far into the foreground. It's this contrast between sharp and blurry that will ultimately help sell the effect by creating depth in the piece.\n\n{% notice %}\n#### ProTip: sketch over a Blend\n\nAfter blurring a background with the Blend tool go back over the edges of foreground objects. When drawing portraits I like to sketch wispy hair over a blurred background to add depth to the drawing.\n{% endnotice %}\n\n##### More blurred backgrounds\n\nHere's a few Paper portraits I used Pencil and Blend to draw. In the second drawing I purposely smudged the figure's hand instead of the background to mix things up. Have fun and experiment with focal points!\n\n{% figure caption:\"Check out all my [*bokeh* PaperFaces portraits](/tag/bokeh/) where I used this effect with and without Pencil.\" class:\"gallery-3-col\" %}\n[![Thomas D. portrait](/assets/images/paperfaces-thomas-d-twitter-sq-640.jpg)](/assets/images/paperfaces-thomas-d-twitter-sq-950.jpg)\n[![hjalle portrait](/assets/images/paperfaces-hjalle-twitter-sq-640.jpg)](/assets/images/paperfaces-hjalle-twitter-sq-950.jpg)\n[![Rene D. portrait](/assets/images/paperfaces-rene-d-twitter-sq-640.jpg)](/assets/images/paperfaces-rene-d-twitter-sq-950.jpg)\n{% endfigure %}\n\nThis technique of blurring the background doesn't have to be used with just portraiture. In the following example it can be used to simulate macro photography, focusing on one object and throwing the rest out of focus.\n\nThe process is the same:\n\n1. Start by blocking out the background with the watercolor brush.\n2. Refine shapes and drop in color quickly using the fountain pen.\n3. Evenly blend the objects you want to appear out-of-focus (in this case the entire background).\n4. Draw the \"in-focus\" object leaving sharp edges and adding highlights and other details to make the illusion more convincing.\n\n{% figure class:\"gallery-2-col\" %}\n[![plant blend step 1](/assets/images/pencil-53-plant-bokeh-1-700.jpg)](/assets/images/pencil-53-plant-bokeh-1-lg.jpg)\n[![plant blend step 2](/assets/images/pencil-53-plant-bokeh-2-700.jpg)](/assets/images/pencil-53-plant-bokeh-2-lg.jpg)\n[![plant blend step 3](/assets/images/pencil-53-plant-bokeh-3-700.jpg)](/assets/images/pencil-53-plant-bokeh-3-lg.jpg)\n[![plant blend step 4](/assets/images/pencil-53-plant-bokeh-4-700.jpg)](/assets/images/pencil-53-plant-bokeh-4-lg.jpg)\n{% endfigure %}\n\n#### Reflections\n\nAh reflections... they're so magical and easy to achieve with Blend. With a few minutes of quick drawing and a couple of swipes of your finger you can create photo realistic scenes just like these:\n\n{% figure class:\"gallery-2-col\" %}\n[![mountain landscape painted with Pencil](/assets/images/pencil-53-bob-ross-mountain-700.jpg)](/assets/images/pencil-53-bob-ross-mountain-lg.jpg)\n[![sunset landscape painted with Pencil](/assets/images/pencil-53-bob-ross-sunset-700.jpg)](/assets/images/pencil-53-bob-ross-sunset-lg.jpg)\n{% endfigure %}\n\nTo start you'll want to use the pencil tool to mark the horizon, and sketch out your scene --- I like to use a light gray color for that. Then start to [paint in the sky]({% post_url /mastering-paper/2013-09-05-drawing-clouds %}) and shape the mountains using the brush and fountain pen tools.\n\n{% figure class:\"gallery-3-col\" %}\n[![painting the sky](/assets/images/pencil-53-mountain-blend-1-700.jpg)](/assets/images/pencil-53-mountain-blend-1-lg.jpg)\n[![painting the water](/assets/images/pencil-53-mountain-blend-2-700.jpg)](/assets/images/pencil-53-mountain-blend-2-lg.jpg)\n[![drawing mountains](/assets/images/pencil-53-mountain-blend-3-700.jpg)](/assets/images/pencil-53-mountain-blend-3-lg.jpg)\n{% endfigure %}\n\nAdding snowy details to the mountains is next, followed by inking in a row of trees. If you're looking for help with drawing foliage and other greens be sure to check out my [**Mastering Paper: Drawing Trees and Grass** tutorial]({% post_url /mastering-paper/2013-08-31-drawing-trees %}).\n\n{% figure caption:\"Use the pen tools filled with a dark color to build up the tree silhouettes.\" class:\"gallery-2-col\" %}\n[![adding details to the mountains](/assets/images/pencil-53-mountain-blend-4-700.jpg)](/assets/images/pencil-53-mountain-blend-4-lg.jpg)\n[![drawing trees](/assets/images/pencil-53-mountain-blend-5-700.jpg)](/assets/images/pencil-53-mountain-blend-5-lg.jpg)\n{% endfigure %}\n\nSpend most of your effort perfecting the top half of the scene. Once you're happy with it we're going to create its mirror image. Select the fountain pen tool and roughly draw everything again --- in the bottom half and flipped upside down.\n\nIt doesn't have to be perfect, you just want to match the colors and general shape of each object --- the most important ones being the trees.\n\n{% figure caption:\"You should end up with something similar to this.\" %}\n[![drawing reflections](/assets/images/pencil-53-mountain-blend-6-900.jpg)](/assets/images/pencil-53-mountain-blend-6-lg.jpg)\n{% endfigure %}\n\nNow the fun part. Make sure Pencil is connected, Blend is turned on, and begin smudging everything from the horizon line down. At first, move quickly to create a soft blur. Then gradually begin pulling trees into the water by dragging your finger slowly.\n\n{% figure caption:\"Pull the trees into the water to create their reflection.\" %}\n{% youtube fJdHAM9u4Sk %}\n{% endfigure %}\n\nTo finish things off select the pencil tool to sketch in waves, foam, and other details. Feel free to redraw any trees and shoreline you may have mistakenly blended when creating the water reflections.\n\n{% figure caption:\"Need more pointers for drawing and painting water? I have you covered with my [**Mastering Paper: Drawing Water and Waves** tutorial](/mastering-paper/drawing-water/).\" %}\n[![detail shot of water waves](/assets/images/pencil-53-mountain-blend-7-900.jpg)](/assets/images/pencil-53-mountain-blend-7-lg.jpg)\n{% endfigure %}\n\n#### Underwater and dreamy scenes\n\nThe same process for creating reflections can be used to paint beautiful underwater scenes as well.\n\n{% figure caption:\"Some examples of underwater scenes I painted with Paper by FiftyThree using Pencil and Blend.\" class:\"gallery-3-col\" %}\n[![scuba diver painted with Pencil](/assets/images/pencil-53-guavagleelesley-700.jpg)](/assets/images/pencil-53-guavagleelesley-lg.jpg)\n[![underwater dream painted with Pencil](/assets/images/pencil-53-underwater-dream-700.jpg)](/assets/images/pencil-53-underwater-dream-lg.jpg) [![scuba diver painted with Pencil](/assets/images/pencil-53-zakatnov-700.jpg)](/assets/images/pencil-53-zakatnov-lg.jpg)\n{% endfigure %}\n\nSimilar to the reflection effect you'll want to determine what will be in and out of focus. In this case everything behind the scuba diver will be blurry so that's what we will paint first.\n\nUsing the watercolor brush you'll want to lay down a base color and then start layering objects on top of that. Feel free to use the pencil, ink pens, or marker tools to draw the rest of the background.\n\n{% figure caption:\"Don't worry about adding too many details at this point, we're going to smudge most of the scene away in a minute...\" class:\"gallery-3-col\" %}\n[![scuba diver background step 1](/assets/images/pencil-53-scuba-step-1-700.jpg)](/assets/images/pencil-53-scuba-step-1-lg.jpg)\n[![scuba diver background step 2](/assets/images/pencil-53-scuba-step-2-700.jpg)](/assets/images/pencil-53-scuba-step-2-lg.jpg)\n[![scuba diver background step 3](/assets/images/pencil-53-scuba-step-3-700.jpg)](/assets/images/pencil-53-scuba-step-3-lg.jpg)\n{% endfigure %}\n\nWith our background in good shape make sure Pencil and start smudging away. Using a circular motion softly move your finger tip over the background to blur it evenly.\n\nWhen done correctly the water should look almost dreamlike with a uniform blur across the entire plane. To finish, add things like bubbles, more fish, or plant life to the scene. If you don't blend them they will automatically look as if they're floating above the water adding a nice sense of depth to the scene.\n\n{% figure caption:\"By leaving the edges around the scuba diver sharp, the figure will pop-off the page as it contrasts against the soft background.\" class:\"gallery-2-col\" %}\n[![scuba diver step 5](/assets/images/pencil-53-scuba-step-5-700.jpg)](/assets/images/pencil-53-scuba-step-5-lg.jpg)\n[![scuba diver step 6](/assets/images/pencil-53-scuba-step-6-700.jpg)](/assets/images/pencil-53-scuba-step-6-lg.jpg)\n{% endfigure %}\n\n#### Clouds, smoke, and fog\n\nBuilding on the techniques found in my [**Mastering Paper: Drawing Clouds** tutorial]({% post_url /mastering-paper/2013-09-05-drawing-clouds %}), a few well placed cloud smudges can greatly improve their realism. You can also modify the type of cloud on display by varying the speed of your blends.\n\n{% figure caption:\"Use quick blends for fluffy clouds and slow dragging smudges for for streaky ones.\" class:\"gallery-2-col\" %}\n[![sunset clouds blended with Pencil](/assets/images/pencil-53-blended-sunset-700.jpg)](/assets/images/pencil-53-blended-sunset-lg.jpg)\n[![dark streaky clouds smudged](/assets/images/pencil-53-blended-dark-clouds-700.jpg)](/assets/images/pencil-53-blended-dark-clouds-lg.jpg)\n{% endfigure %}\n\nThese techniques can be used for much more than just enhancing clouds. They also work great for softening pencil strokes, turning them into the beautiful *aurora borealis* (the Northern Lights).\n\n{% figure caption:\"Give light trails a sense of motion by pulling your blend strokes slowly. Practice smudging the [aurora borealis on Mix](https://mix.fiftythree.com/11098-Michael-Rose/915375).\" class:\"gallery-2-col\" %}\n[![sketching the aurora](/assets/images/pencil-53-aurora-sketch-700.jpg)](/assets/images/pencil-53-aurora-sketch-lg.jpg)\n[![smudging the aurora](/assets/images/pencil-53-aurora-smudged-700.jpg)](/assets/images/pencil-53-aurora-smudged-lg.jpg)\n{% endfigure %}\n\n#### Simulate atmospheric perspective\n\nOne way of adding depth to a landscape is by adhering to the properties of [atmospheric perspective](http://www.arthints.com/what-is-atmospheric-perspective/). Simply put --- far away objects appear more faded than those in the foreground.\n\nNow you could be meticulous with your color choices and purposely mix gray and blue as you paint to get a similar effect. But if you're anything like me you wouldn't mind a shortcut to speed things up.\n\nIn this drawing of trees, the layers near the top are the most heavily blended. While the dark green trees at the bottom remain sharp and untouched.\n\n{% figure caption:\"Blend the plane (or object) furthest from the foreground the most and gradually decrease that amount as you move forwards.\" class:\"gallery-2-col\" %}\n[![tree tops drawn in ink](/assets/images/pencil-53-tree-tops-700.jpg)](/assets/images/pencil-53-tree-tops-lg.jpg)\n[![tree tops blended](/assets/images/pencil-53-tree-tops-blended-700.jpg)](/assets/images/pencil-53-tree-tops-blended-lg.jpg)\n{% endfigure %}\n\nVery similar to the reflection example from earlier, you can create a dense layer of fog by blending everything --- not just the reflected trees. By smudging over the drawing it effectively lowers the contrast making things appear hazy.\n\n{% figure caption:\"Start by drawing the horizon line so you know where to place the trees and those that will be reflected below in the water. Then cover the canvas in circular blend strokes to blur everything.\" class:\"gallery-3-col\" %}\n[![drawing the horizon line](/assets/images/pencil-53-fog-scene-1-600.jpg)](/assets/images/pencil-53-fog-scene-1-lg.jpg)\n[![drawing the trees tops](/assets/images/pencil-53-fog-scene-2-600.jpg)](/assets/images/pencil-53-fog-scene-2-lg.jpg)\n[![drawing the trees reflected in the water](/assets/images/pencil-53-fog-scene-3-600.jpg)](/assets/images/pencil-53-fog-scene-3-lg.jpg)\n{% endfigure %}\n\nThe fog effect is achieved by covering the canvas in circular blend strokes to blur everything. Once blurred subtle details can be added to define the tree tops and small waves in the water.\n\n{% figure class:\"gallery-2-col\" %}\n[![drawing the horizon line](/assets/images/pencil-53-fog-scene-4-600.jpg)](/assets/images/pencil-53-fog-scene-4-lg.jpg)\n[![drawing the horizon line](/assets/images/pencil-53-fog-scene-5-600.jpg)](/assets/images/pencil-53-fog-scene-5-lg.jpg)\n{% endfigure %}\n\n#### Lighting effects\n\nBefore Pencil and Blend were a thing you had to [get creative with white paint]({% post_url /mastering-paper/2014-02-09-basics %}#lightening-with-white) to make lens flares and other glowing orbs of light. With a few quick swipes of your finger you can easily transform plain shapes and lines into lightsabers, auras, lightning, and more.\n\n{% figure caption:\"Blending shapes into glowing objects.\" class:\"gallery-2-col\" %}\n![lightsaber - before/after blend animation](/assets/images/pencil-53-blend-lightsaber.gif)\n![lightning - before/after blend animation](/assets/images/pencil-53-blend-lightning.gif)\n{% endfigure %}\n\n#### Outer space scenes\n\nGalaxies far far away, stars, planets, black holes, and countless other celestial bodies can also benefit from blends and smudges. For in-depth instructions and videos be sure to check out my [**Mastering Paper: Drawing Outer Space**]({% post_url /mastering-paper/2015-01-02-drawing-outer-space %}) guide.\n\n{% figure caption:\"Both of these paintings have been shared on Mix for you to play with and alter.\" class:\"gallery-2-col\" %}\n[![space scene with planets](/assets/images/paper-53-space-2-finished-750.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/1534984)\n[![space scene with aurora](/assets/images/paper-53-space-3-finished-750.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/1576095)\n{% endfigure %}\n\nThe two sets of tutorials show how to smear color around a black canvas to create planets and glowing stars. And for those of you who don't own Pencil yet I walk you through how to create a similar scene with just your fingers.\n\n#### Simulate fire and flames\n\nBy alternating between quick blends and slow smudges you can create realistic looking flames and fire. It takes some practice to get the speed just right, but once mastered I think the end results speak for themselves.\n\n{% figure caption:\"Flames aren't the only thing you can smudge into existence. Pencil strokes can be transformed into smoke trails just as easily with slow blends.\" class:\"gallery-2-col\" %}\n[![blended ink to create flames](/assets/images/pencil-53-blend-flame-700.jpg)](/assets/images/pencil-53-blend-flame-lg.jpg)\n[![blended ink to create fire and smoke](/assets/images/pencil-53-blend-matchstick-700.jpg)](/assets/images/pencil-53-blend-matchstick-lg.jpg)\n{% endfigure %}\n\n{% youtube GdPYXERDH4M %}\n\n### How to improve blends\n\nThe temptation is really high to abuse the Blend feature in Paper --- especially after learning about all these awesome effects. It's easy to turn a drawing into a smeared mess resembling something you'd find on [**Photoshop Disasters**](https://web.archive.org/web/20151211053805/http://www.psdisasters.com/) if don't know when to quit, a fact I learned the first time I tried to blend a face.\n\n{% figure caption:\"Blend got away from me here as I distorted the shape of the face too much and lost all of the texture from the original watercolor layers.\" class:\"gallery-2-col\" %}\n[![blended face disaster paperfaces](/assets/images/paperfaces-dermike-process-1-750.jpg)]({% post_url /paperfaces/2013-12-09-dermike-portrait %})\n[![blended face disaster paperfaces](/assets/images/paperfaces-dermike-twitter-700.jpg)]({% post_url /paperfaces/2013-12-09-dermike-portrait %})\n{% endfigure %}\n\nFear not, here's a few pointers to help keep your blends, blurs, and smudges in check.\n\n#### Paint over a blend\n\nA nice way to recover from over worked blends is by [applying layers of watercolor]({% post_url /mastering-paper/2014-02-09-basics %}#glazing \"painting glazes with Paper\") on top. This helps restore balance by upping the texture and downplaying the *airbrushed* look. Thoughtfully placed pencil strokes can also have the same effect when combined with the right color.\n\n{% figure caption:\"Bring some life back to aggressive blurs by adding texture with sketch or watercolor strokes.\" %}\n[![watercolor glazed over a blend](/assets/images/pencil-53-blend-recovery-900.jpg)](/assets/images/pencil-53-blend-recovery-lg.jpg)\n{% endfigure %}\n\n#### Feather touches\n\nGetting the intensity of a blur just right isn't always easy. To make a subtle blend you have to barely graze the iPad's screen as you quickly swipe against it. This works OK when you're covering a large area, but for small area blends it can be a real challenge.\n\nThe trick is to be quick. By barely touching the iPad's screen while you swipe it fast, you can create blends that aren't as harsh.\n\n{% notice %}\n#### Stronger blending with zoom\n\nWhen opening the magnifying loupe to zoom-in the blurring effects intensifies which has its pros and cons. For subtle blurs I suggest smudging when in the zoom circle.\n{% endnotice %}\n\nPhew --- this was a long one! I covered a ton of material so if anything is unclear or needs further explanation, please let me know.\n\nAnd if you create something cool with Blend feel free to share in comments below, or [ping me on Twitter](https://twitter.com/mmistakes). I'm always interested to see what the Paper community is doing with FiftyThree's excellent set of tools.\n\n[Buy Pencil by FiftyThree][buy-pencil]{:.btn}\n\n{% include_cached affiliate-disclosure.html %}\n\n[buy-pencil]: http://www.amazon.com/gp/product/B00SIYUBMC/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B00SIYUBMC&linkCode=as2&tag=mademist-20&linkId=MRH7TJG6DTA23BUH\n"
  },
  {
    "path": "src/_posts/mastering-paper/2015-09-11-paper-3-features.md",
    "content": "---\ntitle: \"New Paper for iOS 3.0 features I can't live without\"\nlast_modified_at: 2018-11-06T12:05:56-05:00\nexcerpt: \"Paper for iOS comes to the iPhone with productivity boosting features like photo import, text notes, grid view, rotate, and more.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, Apple]\nimage:\n  path: &image /assets/images/paper-3-feature.jpg\n  width: 1600\n  height: 654\n  feature: *image\ntwitter:\n  card: summary_large_image\ncomments_locked: true\ntoc: true\n---\n\nThe hashtag [#CreateAnywhere](https://twitter.com/hashtag/createanywhere) takes on greater meaning now that [**Paper by FiftyThree**](http://www.fiftythree.com/paper) is available for iPhone --- a device I *always have with me*. Not only that but with a new set of tricks up its sleeve, Paper is quickly becoming a productivity powerhouse.\n\nHere's some of my favorite additions found in the 3.0 update...\n\n## Universal Paper App\n\nYes, you've read correctly --- Paper is now a universal iOS app that works on both iPad and iPhone. Every time I open Paper on my iPhone 5s I'm amazed all of the features found on the iPad version made the journey over. Much like the complete UI overhaul in [version 1.6.1](http://news.fiftythree.com/post/79379441335/the-paper-ios-7-update-is-here-brighter-fresher), I got the sense that the team at FiftyThree re-evaluated every bit of the app for 3.0. Even if that meant modifying a few of Paper's defining characteristics[^changes] in order to make the overall experience more intuitive and fluid.\n\n[^changes]: Yes the journal book view and zoom loupe have gone away. Change is good, deal with it :sunglasses:.\n\n{% figure caption:\"Paper 3.0 for iPad/iPhone/iPod available in the App Store for free. [Get it now!](https://itunes.apple.com/us/app/id506003812)\" %}\n![Paper 3.0 App Store screenshot](/assets/images/paper-3-store.jpg)\n{% endfigure %}\n\n## Importing images\n\nLove it or hate it (stick me in the love it camp), you can finally import images into Paper by FiftyThree! Tap the camera icon and you can either snap a picture or choose one from your photo library to place on the canvas.\n\nCurrently you are limited to one photo per idea --- but you can scale it, rotate it, and even call-out an area of interest with a new [*Spotlight option*](http://blog.fiftythree.com/posts/annotate-spotlight-photos).\n\n{% figure caption:\"Importing photos in Paper for iPad and iPhone.\" %}\n![Importing photos into Paper 3.0](/assets/images/paper-3-photo-import.jpg)\n{% endfigure %}\n\nI'm excited to use this feature as a sketching aid --- drawing directly on reference images I've imported into Paper. There's no way to toggle this layer off yet (*psst... FiftyThree engineers if you're reading*), but it's easy enough to remove if you want to leave behind just what you've drawn or painted.\n\n{% figure caption:\"Tap and hold on the Eraser tool, tap **Clear Photo**, and poof!\" %}\n![Clear Photo layer animation](/assets/images/paper-3-clear-photo.gif)\n{% endfigure %}\n\n## Rotating ideas\n\nWhat a time saver this one is. If you wanted to share ideas \"right side up\" you had to export to the camera roll to make the rotation edit. This worked OK for sharing on social media but not so much with drawings shared on Mix --- you just had to live with them displaying horizontally.\n\n{% figure caption:\"Tap the button on the far right to rotate ideas.\" %}\n![new rotate button](/assets/images/paper-3-rotate-button.jpg)\n{% endfigure %}\n\nIn 3.0 there's a new button conveniently located below each idea for rotating the canvas in 90 degree intervals. Horizontal and vertical ideas live in harmony together because of the new grid view. Which leads me to my next favorite thing in Paper 3.0...\n\n{% figure caption:\"View ideas horizontally or vertically with the tap of the new **rotate button**.\" class:\"gallery-3-col\" %}\n![Idea that hasn't been rotated yet](/assets/images/paper-3-rotate-horizontal.jpg)\n![Idea rotated 90 degrees](/assets/images/paper-3-rotate-vertically.jpg)\n![How rotated images appear in Paper's spaces](/assets/images/paper-3-rotate-spaces.jpg)\n{% endfigure %}\n\n## Journals replaced with \"Spaces\"\n\nPaging through Paper's digital journals might have been a good idea years ago, but with page counts in the hundreds it quickly becomes unusable. Journals transitioning into \"Spaces\" is one of the best things to happen to Paper since the introduction of [**Think Kit**](https://www.fiftythree.com/think).\n\nInstead of ideas bound together as books, they're presented with a different UI metaphor --- stacks of paper. These stacks expand into a neatly aligned grid of cards you can interact with when tapped on. I'll tell you this much, scrolling through ideas in this way sure beats flipping back 500 plus pages to find a drawing I worked on a year ago.\n\n{% figure caption:\"Scrolling through a large stack of ideas is way more usable now.\" %}\n{% youtube VBMt_sjEXF4 %}\n{% endfigure %}\n\nThese new \"Spaces\" are more accommodating of the new content types found in Paper 3.0 as well. Ideas in portrait or landscape orientation fit in perfectly with text notes and images. There's no way any of this would be usable or look half as good as it does now if FiftyThree stuck with the book motif.\n\n## Other new additions\n\nIn my short time with the new iPad and iPhone versions I've come across a couple of other refinements that should make the app more pleasant to use. Feel free to add any you've discovered in the comment section below.\n\n### Popular gestures have dedicated buttons now\n\nUndoing mistakes and page management are some of the most common Paper actions I get questions about. In my experience most people had no clue you could do either --- so I'm happy to see they're more discoverable now.\n\nUndoing (Rewinding) can still be triggered with a gesture[^rewind] or tapping the new **<<** button found in the tool tray. Tap the button to step back an edit at a time or hold down to speed it up.\n\n{% figure caption:\"Undo mistakes by pressing the **<<** button in the upper left corner of the tool tray.\" %}\n![Rewind button in tool tray](/assets/images/paper-3-rewind-button.jpg)\n{% endfigure %}\n\n[^rewind]: A small adjustment was made to the way Rewind works. To trigger it tap once with 2 fingers anywhere on the screen before making the [circle gesture]({% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#gestures-to-master).\n\n{% notice %}\n#### ProTip: quick undo gesture\n\nTo quickly undo a mistake double tap the screen with two fingers.\n{% endnotice %}\n\nThe **• • •** button below each idea allows you to delete, duplicate, and move pages now. You no longer have to tap and hold an idea with one hand and do finger gymnastics with the other to move things around.\n\n{% figure caption:\"Delete, Duplicate, and Move to Space... by tapping the **• • •** button.\" %}\n![more button](/assets/images/paper-3-more-button.jpg)\n{% endfigure %}\n\n### Ability to annotate ideas and create text notes\n\nPerfect for to-do lists, recipes, or adding captions to your ideas and photos. I could see this coming in handy for providing context around an idea you've shared or to solicit feedback from followers.\n\n![text notes in Paper](/assets/images/paper-3-text-ideas.jpg)\n\nBasic formatting of text can be achieved by [swiping across text](http://blog.fiftythree.com/posts/swipe-to-style) to cycle through styles (Title, Subtitle, Bullet, and Sub-Bullet). You can also **bold**, *italicize*, and <s>strikethrough</s> text by selecting it and tapping the right arrow followed by **Style**.\n\n{% figure caption:\"Styling text in Paper 3.0.\" %}\n![styling text in Paper](/assets/images/paper-3-text-styles.jpg)\n{% endfigure %}\n\n#### Changing the default idea type\n\nYou can easily switch between idea types (Canvas/Photo/Text) by tapping their corresponding icons in the tool tray. But you can also change which type is used as the default when creating a new idea.\n\n{% figure caption:\"Tap and hold on the new idea button (in this example it's a squiggle) at the bottom of the screen and select which type (Canvas, Photo, Text) you want to use as the default.\" %}\n![change default idea type](/assets/images/paper-3-idea-type-button.jpg)\n{% endfigure %}\n\n### Formerly known As Mix\n\nMix is no longer something you \"pull down\" to access from within Paper. The stream of ideas from the **People You Follow** on Mix (or should I say PAPER now?) now appear alongside your private spaces for quicker access.\n\n{% notice %}\n#### ProTip: see all your shared ideas\n\nThe *shared journal* has been removed from Paper but you can still see all of your public ideas in one place. Tap your avatar in the upper right, and then tap your name to bring up your profile card. From here tap **Ideas** to see everything you've shared.\n{% endnotice %}\n\nOK, back to lusting over the new **Apple Pencil** and waiting for the day Apple brings that technology to the smaller and cheaper iPads :wink:.\n"
  },
  {
    "path": "src/_posts/mastering-paper/2016-05-16-switching-tools.md",
    "content": "---\ntitle: \"Paper for iOS quick tip: switching tools\"\nexcerpt: \"Switching tools in Paper for iOS may seem obvious to you pros out there, but you'd be surprised how often I'm asked how to do it. Here's the answer.\"\ncategories: [mastering-paper]\ntags: [Paper for iOS, Apple, tutorial]\nimage:\n  path: &image /assets/images/paper-53-full-tools.jpg\n  width: 1587\n  height: 369\n  feature: *image\ntwitter:\n  card: summary_large_image\ntoc: true\nlast_modified_at: 2018-11-06T12:06:36-05:00\n---\n\nNew to Paper by FiftyThree and just can't seem to figure out how to switch tools? I have the short answer for you right here.\n\nThey may be subtle, but the white dots beneath the row of tools are a big clue to help solve this mystery. Similar to the dots you find at the bottom of your iOS device's home screen, they indicate there are off-screen goodies to be had.\n\n{% figure caption:\"There be more tools to the right, don't worry you get them for free.\" %}\n![indicator dots beneath Paper tools](/assets/images/paper-53-switch-tools-dots.jpg)\n{% endfigure %}\n\n## Tool switching (iPad)\n\nSimply swipe across the row of **Think Kit** tools to reveal another set of five ([Fountain Pen][fountain-pen], [Pencil][pencil], [Marker][marker], [Fine Tip Ink Pen][ink-pen], and [Watercolor Brush][watercolor-brush]) to the right.\n\n[fountain-pen]: {% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#fountain-pen\n[pencil]: {% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#pencil\n[marker]: {% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#marker\n[ink-pen]: {% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#ink-pen\n[watercolor-brush]: {% post_url /mastering-paper/2013-07-31-introduction-tool-guide %}#watercolor-brush\n\n{% figure caption:\"Video showing how to switch between the diagramming and drawing tools on iPad.\" %}\n{% youtube KXqj04MfDLk %}\n{% endfigure %}\n\n## Tool switching (iPhone)\n\nAnd for you iPhone Paper users there are three sets of tools you can swipe through.\n\n{% figure caption:\"Switching tools in iPhone version of Paper.\" %}\n![switching tools in Paper by 53 for the iPhone](/assets/images/paper-53-switch-tools-iphone.gif)\n{% endfigure %}\n\nI know what you're thinking, \"wow how could anyone miss this?\" Well from the amount of emails I receive a month asking how to change tools... quite a lot :wink:.\n\nBaffled by how to do something else in Paper? Leave a comment below, or if you'd prefer to keep it private fire off a message to me from my [Contact page](/contact/).\n"
  },
  {
    "path": "src/_posts/notes/2006-09-23-feeling-kinda-stuck-half-nelson.md",
    "content": "---\ntitle: \"Feeling kinda stuck in a Half Nelson\"\nexcerpt: \"My impressions of the film Half Nelson, starring Ryan Gosling.\"\nimage: \n  path: &image /assets/images/half-nelson-feature.jpg\n  width: 835\n  height: 399\n  feature: *image\n  caption: \"DVD screengrab from [**DB Cover**]\"\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [review]\nsupport: false\n---\n\nMy gosh! I ate a bowl of generic Honeycomb cereal for lunch and have been starving ever since. Completely devoured the large bucket at Dipson tonight and got a refill of my favorite popcorns before *Half Nelson* even started. Sometimes I wonder if all the old people sitting around me are super artsy and enjoy these films... or if they just live across from the theater and straggle in to take advantage of a senior citizens discount.\n\nThe reviews were fairly good for Half Nelson and I really enjoyed the feel of the website and trailer. Everything in this film seemed extremely subtle and understated to me. The typography used in the opening credits was made up of a serif typeface... all lowercase... white on black... very traditional with a hint of organic imperfection. Nothing too flashy. Just a story about an average guy smoking crack in the school he happens to be teaching at.\n\n{% figure caption:\"Still shot from Half Nelson (2006)\" class:\"large\" %}\n![Half Nelson (2006)](/assets/images/600full-half-nelson-screenshot.jpg)\n{% endfigure %}\n\nOverall the movie seemed to plateau about midway. The classroom scenes were all about opposing forces in history which was probably suppose to mirror Danny's (I think that was his name) life... if you want to over analyze... The conclusion was downplayed and I get why. \n\nI guess I was just waiting for the big shocker or turning point to happen --- but secretly sort of glad that event never happened. You could argue that one or two events might have been tha shockah... but it was so subdued that I hardly took notice.\n\nI didn't hate it. I didn't love it. I'm sure glad I didn't see Ben and Matt's horror flick, **Feast** instead.\n"
  },
  {
    "path": "src/_posts/notes/2006-10-25-ipod-battery-settlement.md",
    "content": "---\ntitle: \"iPod battery settlement program status\"\nexcerpt: \"A short update on the status of my iPod 3G battery settlement claim.\"\ncategories: [notes]\ntags: [Apple, tech geek]\nlast_modified_at: 2015-12-15\nimage:\n  path: &image /assets/images/ipod-battery-settlement-teaser.jpg\ntwitter:\n  card: summary_large_image\nsupport: false\n---\n\nLast week I finally got an iPod return kit for my busted 3G iPod and dropped it off at DHL. The next day Apple's repair status page informed me that the problem was identified and that I was awaiting a replacement iPod. It has now said the same thing for the past five days:\n\n> Product replacement pending\n\n{% figure caption:\"iPod battery replacement status screenshot\" %}\n![iPod Battery Replacement status](/assets/images/185.jpg)\n{% endfigure %}\n\nWhich according to Apple means: *a replacement iPod will be shipped to me shortly*. Does this mean my iPod is toast and there were more problems than just a bad battery? Most reports online indicate I'm getting a refurbished one, which often come looking and acting brand new. Mine is pretty old so would it be far fetched for them to send me a newer generation model? Maybe one with a color display? I doubt it… but I don't really care what I get at this point. Just give me an iPod that has 40GB's or more of hard drive space so I can enjoy some tunes in the car. I can't stand the radio for much longer.\n\nUpdate. Wow a package from DHL was waiting for me when I got home from work today. Looks like the replaced just the battery because my iPod appears to be the same. Good. Tomorrow is the test to see if it lasts more than 5 seconds on a charge. Otherwise its a new 80GB iPod for me.\n"
  },
  {
    "path": "src/_posts/notes/2007-06-05-la-moustache-impressions.md",
    "content": "---\ntitle: \"La Moustache quick review\"\nexcerpt: \"My quick impressions of La Moustache --- a French film about a dude shaving his mustache.\"\nimage: \n  path: &image /assets/images/la-moustache-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\n  caption: \"DVD screengrab from [**The Movie Database**](http://www.themoviedb.org/movie/16998-la-moustache)\"\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [review]\nsupport: false\nlast_modified_at: 2018-02-09T09:18:20-05:00\n---\n\nSaw another great French film tonight. This one is called **La Moustache** and starts right off with the protagonist Marc, deciding to shave off his mustache that he's worn his entire adult life. \n\nThinking his wife and friends will notice the drastic change, he gets mad when they don't. At first he thinks his wife is playing an elaborate prank on him but things gradually progress to a state of great disorientation for Marc.\n\nHis coworkers deny that he ever had a mustache even though he has photos of him wearing one. His wife tells him his father died the year before, when five minutes earlier she was talking about going to see them for dinner. All kinds of head scratching events occur as you witness Marc's madness.\n\nThe acting and music are all really good. If you want to see a film that you can discuss \"what the hell just happened\" with your friends, then see this one.\n"
  },
  {
    "path": "src/_posts/notes/2007-06-10-tale-two-sisters-impressions.md",
    "content": "---\ntitle: \"Almost the film version of Fatal Frame\"\nexcerpt: \"A Korean horror flick that reminded me of the Fatal Frame video game franchise.\"\nimage: \n  path: &image /assets/images/tale-two-sisters-floor-blood-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\n  caption: \"DVD screengrab from [**The Movie Database**](http://www.themoviedb.org/movie/4552-janghwa-hongryeon)\"\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [review]\nsupport: false\nlast_modified_at: 2018-02-09T09:25:28-05:00\n---\n\nNetflix has been on a roll with the Korean films suggested I watch. First it was a set of Chan-wook Park revenge flicks: ([**Old Boy**][old-boy], [**Sympathy for Mr Vengeance**][mr-vengeance], and [**Lady Vengeance**][lady-vengeance]). And now [**A Tale of Two Sisters**][two-sisters]...\n\nLike most of the other Korean films I've seen, the story starts off really slow with most of the interesting and shocking events happening near the end. AToTS really confused me right up until the end. The plot summary from Netflix leverages the horror and scary aspects of the film more than it should.\n\n*[AToTS]: A Tale of Two Sisters\n\n> Terrified sisters try to exorcise their home of two dark forces --- their evil stepmother and a vengeful entity --- in this ghostly tale. Hospitalized after their mother's death, young Su-mi (Im Su-jeong) and Su-yeon (Mun Geun-yeong) return home to find a nasty new stepmother (Yeom Jeong-ah). The girls suffer terrifying events, but their father doesn't care, even though evil lurks around every corner. Can the girls free their home from its demons?\n\nIt really wasn't a horror film per say, but if you ever played those *Fatal Frame* video games you'll probably recognize some familiar imagery. Many of the scenes from the movie reminded me of the two sisters walking around the cursed village in **Fatal Frame 2**. There definitely were a few of those moments where you see something out of the corner of your eye and it freaks you out. Although the ghosts or whatever looked and acted like some of the creeps in **The Ring** and **The Grudge**, this film was far from being on the level of those bad remakes.\n\n[old-boy]: http://www.imdb.com/title/tt0364569/ \"Old Boy entry on IMDb\"\n[mr-vengeance]: http://imdb.com/title/tt0310775/ \"Sympathy for Mr Vengeance entry on IMDb\"\n[lady-vengeance]: http://imdb.com/title/tt0451094/ \"Lady Vengeance entry on IMDb\"\n[two-sisters]: http://www.imdb.com/title/tt0365376/ \"A Tale of Two Sisters entry on IMDb\"\n"
  },
  {
    "path": "src/_posts/notes/2007-07-28-sunshine-movie-impressions.md",
    "content": "---\ntitle: \"Blinded by the light --- Sunshine impressions\"\nexcerpt: \"The film Sunshine directed by Danny Boyle is science fiction without the big bang.\"\nlast_modified_at: 2013-04-26 00:00:00\nimage: \n  path: &image /assets/images/sunshine-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\n  caption: \"DVD screengrab from [**DVDBeaver**](http://www.dvdbeaver.com/film2/DVDReviews34/sunshine_blu-ray.htm)\"\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [review]\nsupport: false\ntoc: true\n---\n\nScience fiction movies, now those be my jams. Have been looking forward to seeing Danny Boyle's new film **Sunshine**, when I saw a trailer before *Sicko* a month or so ago. I couldn't tell you any of the actors' names other than Cillian Murphy, but they all are pretty familiar faces (ie: dude who played the Human Torch in *Fantastic Four & Rise of the Silver Surfer*).\n\n*Armageddon*, *Deep Impact*, *The Core*... yeah this film is nothing like that garbage. Things start off in space where we are quickly brought up to speed on Earth's dire condition through some brief narration. About 50 years in the future, 8 scientists are taking a nuke to the Sun in hopes of reigniting it and saving the entire population from certain doom.\n\n## Quick plot summary, go\n\nWe learn that they are the second group to attempt this mission after Icarus I lost contact about six and a half years ago. Before passing into the dead zone they compose their final video messages to send back to their family on Earth since communication will be cut from here on in. Cillian's character is the only scientist we see recording his message.\n\nShit hits the fan after Icarus II picks up a distress beacon from the missing Icarus I. The eight decide to change course and intercept Icarus I --- which always means disaster in these flicks. The idea of igniting a dying star with a nuclear warhead being hypothetical and all --- regaining control of Icarus I means two tries. Makes sense to me...\n\nSomewhere along the third act this film takes a right turn into a different kind of film. I won't ruin anything for you, but it's nothing crazy like blood thirsty aliens showing up. It's very plausible and works well with the rest of the film up to that point.\n\n## Closing thoughts\n\n*Sunshine* never tries to insult your intelligence with over simplified scientific babble a 5 year old could understand. In fact there really is little explanation about what is going on or what they are doing. Instead it focuses on philosophical themes and how expendable life is in the greater scheme of things.\n\nIf you're looking for a big budget science fiction action adventure skip this one. You'll think the story moves along too slowly and not enough shit blows up. If you enjoy your sci-fi cut from the indie vein or dug [*Primer*](http://imdb.com/title/tt0390384/) and its realistic explanation of time travel, then you can't go wrong. B+\n"
  },
  {
    "path": "src/_posts/notes/2007-09-14-one-week-new-ipod-classic.md",
    "content": "---\ntitle: \"One week with the new iPod classic\"\nexcerpt: \"Quick impressions of the new iPod classic 60GB.\"\nlast_modified_at: 2013-05-03\nimage: \n  path: &image /assets/images/ipod-classic-feature.jpg\n  width: 1600\n  height: 754\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [Apple, review]\ntoc: true\n---\n\nLast week Apple finally unveiled a new generation of iPods. The last iPod I purchased was a 3rd generation model with 40GB of hard drive space and have been waiting for a decent successor. My iTunes Music Library has finally outgrown the 3rd gen so I decided this was the time to get a replacement. I figured an iPod that resembled the iPhone would be just around the corner and pleasantly surprised when the *iPod touch* was announced.\n\nAt 16GB the iPod touch doesn't meet my needs, so I decided to go with the new iPod classic 80GB model. Hopefully by then flash drive prices comes down and I can get a version of the iPod touch with 80GB+. Until then the classic more than meets what I was looking for in a music player that can hold all my tunes and have enough juice for a full work day.\n\nThe classic has a few issues, but nothing that has given me buyer's remorse.\n\n## The pros\n\n*\tBattery life!!! I played 3 hours of video (with the back light on) and 4 hours of audio and the battery meter barely moved. With a promised 30 hours of audio / 7 hours of video playback I'm extremely happy with this little dude's performance. Sure beats the 20 minutes I'd get on a full charge with my 3rd gen.\n*\tNice and thin. About half the size of my old iPod.\n*\tAll metal enclosure. Feels solid and well built.\n*\tNew interface. Splitting the menu in half and showing album art and photos fade by looks great. There was so much dead space with the old interface that this is a step in the right direction.\n\n## The cons\n\n*\tThe interface. Sure it has eye candy like *cover flow* and the new menu UI, but it's way too sluggish. When you move from music to photos to videos to settings, the menu just chugs along and you have to wait while it pre-fetches artwork. It's not a problem once you get into playing some music but half the time I thought I didn't press the button because you get no feedback that you actually selected something.\n*\tThe clock. WTF?!? After 20 seconds of inactivity the Now Playing screen goes away and you get this lame clock displaying the time and battery level. The only way I've been able to get rid of this \"feature\" is by turning the back light setting to *Always On*. Must be some energy saving feature Apple thought was necessary. Give me the option to turn this off please.\n*\tScroll wheel sensitivity seems off. Maybe I'm used to pre-click wheel iPod, but I have problems rating songs or moving through the menus accurately.\n*\tScreen glare. When used in my car during the day I can barely see the screen. Not that big of a deal, but I'm glad I didn't get an iPod touch for this very reason. Would have been nearly impossible to navigate through songs since it has no hard buttons and I wouldn't be able to see the screen.\n\n## Photo gallery\n\n* [![iPod classic syncing next to a 40GB iPod](/assets/images/80t.jpg)](/assets/images/80.jpg)\n* [![iPod classic thickness compared to an old 40GB iPod](/assets/images/81t.jpg)](/assets/images/81.jpg)\n* [![New interface menu](/assets/images/82t.jpg)](/assets/images/82.jpg)\n* [![iPod classic games screen](/assets/images/83t.jpg)](/assets/images/83.jpg)\n* [![iPod classic coverflow](/assets/images/84t.jpg)](/assets/images/84.jpg)\n* [![iPod classic coverflow flip](/assets/images/85t.jpg)](/assets/images/85.jpg)\n* [![iPod classic viewing your photos](/assets/images/86t.jpg)](/assets/images/86.jpg)\n* [![iPod classic search](/assets/images/87t.jpg)](/assets/images/87.jpg)\n{: .gallery-thumbnails}\n"
  },
  {
    "path": "src/_posts/notes/2007-11-17-upgrade-imac-g5-osx-leopard.md",
    "content": "---\ntitle: \"Upgrading an iMac G5 to OS X Leopard\"\nexcerpt: \"What I went through upgrading an iMac G5 to Mac OS X Leopard (10.5).\"\nlast_modified_at: 2015-02-04T12:02:06-05:00\nimage: \n  path: &image /assets/images/starfield-leopard-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [Apple, tech geek]\ntoc: true\n---\n\nI did my research this time around and checked out various websites and forums to see if all the major applications I use daily would be supported in Mac OS X Leopard. A lot of the Adobe crap, QuarkXpress, and 3rd party software I use for syncing my Palm Centro were up in the air in terms of Leopard compatibility. Came to the decision last Friday that I would just purchase a 500GB external hard drive, clone my startup disk to it, and if problems arose in Leopard I would just downgrade back to Tiger.\n\n{% figure caption:\"Migrating all my data over to a fresh OS X Leopard install\" %}\n![Mac OS X Leopard](/assets/images/65.jpg)\n{% endfigure %}\n\n## Prep the install\n\nBacking up to the external drive took a few hours to move about 90GBs of data and then I was ready to pop in my Leopard DVD and start the clean install process. Figured it was a good idea to start fresh since my iMac was upgraded from Panther to Tiger and now Leopard... who knows how much crap and clutter was lurking around in the system preferences ready to slow things down and cause problems.\n\nA hour later Mac OS X Leopard booted up for the first time and I ran the Migration Assistant to move over all my user data, network settings, and applications from my external drive. This process took awhile but seemed to do a good job because my wallpaper, user picture, settings, startup items, and applications came over just how they were prior to the clean install. Sweet!\n\n## Do all my beloved applications work?\n\nNext came firing up Adobe Creative Suite 1 applications to see if they'd launch and function properly. Photoshop... check, Illustrator... check, InDesign… check. I didn't really poke around to much but all of those applications launched, opened documents, saved documents, printed, and seemed to function fine. I guess InDesign is the most buggy of the bunch but I rarely use it so I'm sure I'll be fine.\n\nQuarkXpress 6.1 and 6.5 opened fine for me as well. There were a few buggy things with the cursor, but nothing that would cause me any headaches. Certainly wasn't as bad as trying to run QuarkXpress 4 in Classic mode... yuk! I've read of some bugs with Saving pages as <abbr title=\"Encapsulated postscript\">EPS</abbr> files, but that seemed fine to me, as did exporting PDF files. I didn't try to save a <abbr title=\"postscript\">PS</abbr> file and run it through Distiller but I don't see why that would give me any problems. The real test will be doing some serious work in QuarkXpress and Photoshop, but I rarely do that at home. So I should be fine for now.\n\n## Trouble in missing sync land\n\nThe only other application I was worried about was MarkSpace's Missing Sync for Palm OS. MarkSpace has [stated on their website](https://web.archive.org/web/20071231053209/http://www.markspace.com/leopard.html \"Missing Sync compatibility with Leopard\") that version 6 has issues with Leopard and they were working on fixing them. Seeing how I have an older version (5.1) I pretty much expected things not to work. Didn't really care if my data sync'ed up in iCal or Address Book properly yet. I just wanted my data on my Palm Centro to stay put and be backed up somewhere on my computer just in case I had to hard reset it.\n\nTo my surprise everything appeared to sync with the desktop (didn't push changes to iSync and brought up a conflict manager which was expected). MarkSpace posted version 6.0.2 b1 of Missing Sync for Palm OS to their website which claims to works with Leopard now. I'll give that a try later today when I take the plunge and pay to upgrade from version 5 to 6.\n\n## A+ for Mac OS X Leopard\n\nSo for now I'm a happy camper as far as Leopard is concerned. Formatted my external drive after everything was up and running, and now have Time Machine backing up to it. Coverflow in the finder runs pretty good on my aging iMac G5, iChat looks nice (even though the video chat effects are disabled due to it not being an Intel), and the download stack is a welcomed addition. Sure there are a lot of other features and cool things going on in Leopard but these are the ones that have impacted me the most so far. I'm curious to see how the Finder performs over shared drives... could be a life safer at work if it's speedier than Panther or Tiger.\n"
  },
  {
    "path": "src/_posts/notes/2007-12-12-rriiccee-show-last-night-soundlab.md",
    "content": "---\ntitle: RRIICCEE show last night\nexcerpt: \"Musically --- RRIICCEE is fine, but not something I really want to see live again.\"\nimage: \n  path: &image /assets/images/rriiccee-feature.jpg\n  width: 500\n  height: 293\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [life, Buffalo, review]\nsupport: false\n---\n\nSo I no longer have any drive to go see bands perform live. The one or two shows I force myself to attend yearly always leave me questioning my intentions about ten minutes after arriving at the bar. Maybe I'm getting less patient with my age but I can't stand it when bands don't start playing until three+ hours after doors open. On a work night that just sucks.\n\nBut really, I can live with all that if the band is amazing and puts on a mind blowing performance (something that has yet to happen as of late). So when I heard that Vincent Gallo was going to actually play Buffalo *at Soundlab*, a city that he always rips on in interviews --- I was excited to purchase my ticket and go.\n\nGallo was bringing along some guy from *Hole* and a few other musicians to play \"music\" as the band [*RRIICCEE*](http://www.rriiccee.com/). They don't believe in recording albums in a studio and then playing those songs to an audience in some rehearsed manner. Instead they just play and feed of each other giving a unique performance every time. This sounded like it was going to be some sort of noise, jamming, jazz, free form borefest, but I didn't care since I wanted to see Gallo act like the persona I've come to admire --- an asshole with great taste!\n\nFor $20 I can honestly say it wasn't worth it. The music RRIICCEE played was good and the type I generally enjoy, but not something I really wanted to see live. The last thing I wanted to do on a Tuesday night was stand in a packed bar and stare at the floor because I was so bored. Not sure what was wrong with me because that used to be my scene a few years back. Hmmm…\n\nMost of the songs had Gallo noodling away on the bass guitar, while Erlandson did some noise with guitar pedals (I think), followed with an occasional drum buildup that went nowhere. A few of the songs had Gallo singing softly similar to his solo stuff on [*When*](http://vincentgallo.com/music/discography/when.html) and these were easily my favorites. But the rest of the noise was forgettable and yawn inducing.\n\nIf I could have found a spot at the bar, the show might have been more enjoyable. Technically they were fine, I just wasn't feeling the lack of song structure last night. But hey --- maybe that's your sort of thing and you'll absolutely love their live performance. Worth noting, Gallo seemed like a really nice guy which I wasn't expecting. He was smiling the entire show and he'd just laugh to himself when people shouted stuff like \"Welcome home Billy Brown.\" If I had the energy to have stayed around after I might have gotten a photograph with him. Oh well.\n"
  },
  {
    "path": "src/_posts/notes/2008-01-29-diving-bell-butterfly-impressions.md",
    "content": "---\ntitle: \"Seeing through blurred eyes --- The Diving Bell and The Butterfly\"\nexcerpt: \"Quick impressions of the film, The Diving Bell and The Butterfly.\"\nimage: \n  path: &image /assets/images/diving-bell-butterfly-feature.jpg\n  width: 1024\n  height: 512\n  feature: *image\n  caption: \"DVD screengrab from [**Artsy Fartsy Film**](http://artsyfartsyfilm.blogspot.com)\"\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [review]\nsupport: false\n---\n\n[*The Diving Bell and The Butterfly*](http://www.thedivingbellandthebutterfly-themovie.com/), gave me a good idea of what the world would look and sound like if I was paralyzed and only had vision in my left eye. Even though it was a sad world it was a beautiful one. Blurred, skewed, captivating and perfect.\n\n> Don't kiss me goodbye...\n"
  },
  {
    "path": "src/_posts/notes/2008-04-06-using-rasterbator.md",
    "content": "---\ntitle: \"How to use the Rasterbator to print out a wall sized owl\"\nexcerpt: \"A quick tutorial and time lapse video of how to assemble a wall sized poster using The Rasterbator.\"\nimage: \n  path: &image /assets/images/owl-rasterbator-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [tech geek, time lapse]\nlast_modified_at: 2017-09-08T09:15:00-04:00\ntoc: true\n---\n\nA few weekends ago I decided to cover one of the walls in the office with a large poster. I've toyed around with black and white rasterbated images before, but I really wanted to see how well a full color one would look. My office walls are a lime green color and I figured something with dark greens would contrast nicely. Choosing a forest scene with a huge owl seemed right up my alley so I got to work on it's creation.\n\n## The process of Rasterbating\n\nTook some quick measurements of the wall's dimensions and uploaded the image to the [Rasterbator](http://arje.net/rasterbator). Got things cropped how I liked and outputted the 120 page PDF file. The next 3 hours I spent trimming the white borders off of each page since my printer doesn't print to the edge. I think next time I do one of these I'm going to leave the borders... cutting these pages consistently was pretty hard. I tried using a trimmer with a rotary blade but the pages slide some regardless of the clamp thing. Oh well.\n\n*[PDF]: Portable Document Format\n\n## Time lapse video\n\nAnyways. After cutting out all the pages I setup my JVC mini-DV camcorder and recorded myself taping each page to the wall. Figured this would be a fun excuse to use the camcorder since I rarely break the thing out after buying it 4 years ago. Took the 2 hours of footage and imported it into iMovie and made a quick time lapse video by speeding it up 4x. I think it came out good and laugh every time I see my stupid cats walking around watching me in confusion.\n\n{% figure caption:\"Video time lapse of the process of putting up a Rasterbator poster\" %}\n{% youtube 05Qy88RUJHA %}\n{% endfigure %}\n\n{% figure caption:\"Measure twice, cut once, and hopefully not a finger or two\" %}\n![Trimming pages printed out by the Rasterbator](/assets/images/rasterbator-trimming-pages.jpg)\n{% endfigure %}\n\n{% figure caption:\"First row up...\" %}\n![First Rasterbator row assembled](/assets/images/rasterbator-firstrow-owl.jpg)\n{% endfigure %}\n\n{% figure caption:\"Halfway there\" %}\n![Halfway assembled Rasterbator owl](/assets/images/rasterbator-halfway-owl.jpg)\n{% endfigure %}\n\n{% figure caption:\"Finished\" %}\n![Finished Rasterbated owl](/assets/images/rasterbator-finished-owl.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2009-01-25-blurb-book-quality-printing.md",
    "content": "---\ntitle: \"The quality of my first Blurb book is great\"\nexcerpt: \"Using Blurb's BookSmart software was painless and having it printed was equally enjoyable.\"\nlast_modified_at: 2018-02-09T09:04:18-05:00\nimage: \n  path: &image /assets/images/blurb-book-featured.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [design, review]\nsupport: false\ntoc: true\n---\n\nDesigning a book with Blurb was painless and having it printed was equally enjoyable. I'm really happy with how my first photography book turned out.\n\n## Options to satisfy\n\nI sprung for the more expensive satin paper to give the pages a nice texture and thickness to them. Next time I'm definitely paying extra for a hardcover with slip so pages are better protected. The only negative I've found with the printing is that some of my photographs printed a tad on the dark side. I didn't bother calibrating my monitor or using any of Blurb's supplied [ICC color profiles](http://www.blurb.com/downloads/Blurb_ICC_Profile.icc), so that was probably the issue.\n\nThey offer some guidance on [color management](http://www.blurb.com/color-management), that I'll look at more closely next time. I'm also planning on designing my next book using Adobe InDesign and [Blurb's Plug-in](http://www.blurb.com/indesign-plugin) instead of their [BookSmart<sup>®</sup>](http://www.blurb.com/booksmart) application --- just so I have total control over each page.\n\n## Sample pages\n\n{% figure caption:\"Detail photographs of a printed book.\" class:\"gallery-2-col\" %}\n[![Photograph of interior page spread of book, A Six Month Walk](/assets/images/six-month-walk-interior-1-320.jpg)](/assets/images/six-month-walk-interior-1-1024.jpg)\n[![Detail photograph of printed page of book, A Six Month Walk](/assets/images/six-month-walk-detail-print-320.jpg)](/assets/images/six-month-walk-detail-print-1024.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2009-03-29-birds-bird-cage-tattoos.md",
    "content": "---\ntitle: \"Wendy's bird cage &amp; flying birds tattoos\"\nexcerpt: \"Put a bird on it. Photographs of Wendy's bird cage tattoos and some ink splat trees on my arms.\"\nlast_modified_at: 2017-09-07T20:33:26-04:00\nimage: \n  path: &image /assets/images/bird-cage-tattoo-healed-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [life, tattoo, vegan]\nsupport: false\ntoc: true\n---\n\nThe last couple of months have been pretty stressful. Butter, my domestic long haired cat has been sick off and on and causing me to incur some high vet bills and a bunch of junk that hasn't helped to keep my mind at ease. \n\nThen I started the process of moving in with [my girlfriend Wendy](https://2littlerosebuds.com/) and getting ready to put my house on the market. Top that off with all the economy stuff, worrying if I'll have a job tomorrow, and if my car will make it another day without dying --- my health decided to take a dump on itself.\n\n## Tattoos to relieve stress\n\nLast weekend we hit up [**Rise Above Tattoos**](https://www.facebook.com/pages/Modern-Love/1792647387731776) again and spent the afternoon getting some more work done. Wendy added a bunch of birds in flight, a cage, and a tree branch to mimic the design of her other arm. She's in the process of healing now so it looks pretty scabby in a few spots. Will probably need some touch ups if the color falls out, but that shouldn't be a problem since the same thing happened last time.\n\n{% figure caption:\"Some ink splat filler on my forearm\" %}\n[![Some ink splat filler on my forearm](/assets/images/hair-pull-heart-tattoo-m.jpg)](http://www.flickr.com/photos/michael_knows/sets/72157605004332974/ \"Flickr photoset of my all my tattoos\"){% endfigure %}\n\n## These aren't Photoshop brushes, shut up\n\nI didn't get much done... just some lines, ink splats, and squiggles to fill in the mess that is my left arm. In a few weeks I'll probably go in an make an appointment to get something on my upper chest. I have some ideas but nothing finalized yet.\n\n## Freshly inked birds and trees\n\n{% figure caption:\"Birds flying around some tree branches.\" %}\n[![Upper detail of Wendy's forearms](/assets/images/bird-cage-tattoo-upper.jpg)](/assets/images/bird-cage-tattoo-upper.jpg \"Vegan tattoo and birds flying around some tree branches\")\n{% endfigure %}\n\n{% figure caption:\"Still in the process of healing.\" %}\n[![Detail of the Wendy's bird cage tattoo](/assets/images/bird-cage-tattoo-lower.jpg)](/assets/images/bird-cage-tattoo-lower.jpg \"Birds breaking free, a key, and a lock.\")\n{% endfigure %}\n\n{% figure caption:\"And here is my bird related tattoo...\" %}\n[![Bird in a tree forearm tattoo](/assets/images/bird-in-tree-forearm-tattoo-s.jpg)](/assets/images/bird-in-tree-forearm-tattoo-l.jpg \"Michael's bird in a tree forearm tattoo\")\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2009-06-09-palm-pre-impressions.md",
    "content": "---\ntitle: \"The iPhone is great, but the Palm Pre is more my style\"\nexcerpt: \"Quick impressions of the Palm Pre from a long time smartphone user.\"\nlast_modified_at: 2018-02-09T08:54:48-05:00\nimage: \ncategories: [notes]\ntags: [Palm Pre, iPhone, tech geek, review]\ntoc: true\n---\n\nThree days later I'm still impressed with the **Palm Pre**. As a user of Palm OS smartphones (Treo 600, Treo 650, Centro), I've come to rely on a proven feature set.\n\nThe experience of having a device that organizes your life, makes phone calls, and connects online --- has remained unchanged. For the most part the Palm Pre meets or exceeds my expectations, with only a few minor back steps. After the break is a full rundown of my Palm Pre likes and dislikes (mostly software related), in no particular order.\n\n{% figure caption:\"Palm Pre closed with my sweet wallpaper\" %}\n![Palm Pre closed](/assets/images/palm-pre-wallpaper.jpg)\n{% endfigure %}\n\n## Palm Pre positives\n\n* Device feels great in your hands. *(Not sure where all the \"it feels cheap\" reviews came from.)*\n* Screen looks awesome!\n* The UI is very slick.\n* webOS is very responsive and allows **true multitasking**.\n* Notifications are handled very elegantly.\n* Push Gmail. *(Emails hit my Palm Pre before my desktop --- sweet!)*\n* Synergy and the way that it syncs with \"the cloud.\" *(ie: Google, Facebook, etc)*\n* Battery life. *(I can easily make it through a workday which is all I had hoped for)*\n* Removable battery.\n* Physical keyboard. *(Yes it's small, but coming from a Centro I have no problems banging out txts or emails.)*\n* Plugging in via USB let's you access the ringtone and wallpaper folders, to easily add your own to the device.\n* Is capable of syncing with iTunes to add music, podcasts, videos, movies, or photos.\n* Backups every day to your Palm Profile --- just in case you need to restore your device after a wipe.\n* GPS and Sprint Navigation for turn by turn directions.\n\n## Palm Pre negatives\n\n* Having to pay $30 for the Classic app. Booooooooo!\n* Having to use Classic at all! Let's get true webOS versions on the App Catalog so I can stop using Classic for a few archaic applications.\n* No option to make *Tasks repeatable* like the Palm OS version. *(Maybe I'm the only one who relies on this --- I dunno)*\n* Tasks don't sync up with Google Tasks. *(I'm sure this will happen eventually)*\n* Flipping through the Calendar is painfully slow.\n* No agenda view in Calendar.\n* Sprint Navigation doesn't pull in your contacts' addresses if they're coming from Google or Facebook accounts.\n* Can't change the notification sound. *(I have no desire to change it but it would be nice to have the option)*\n* Can't assign a default ringtone for unknown callers like in Palm OS devices.\n* Reception issues. *(I've never had more than 2 bars at my house with the **Centro**, but the Palm Pre seems to average much less and I've experienced a few dropped calls)*\n* Landscape mode is limited to only a few applications\n* USB port cover seems cheaply made and I feel like I'm going to break it off every time I open it.\n* Device does get warm after prolonged usage. *(To be fair so did my Centro)*\n* Audio speaker isn't that loud.\n\nSo there you have it. Can't say that I was excited about the thought of paying an extra $20 a month for the required Sprint Everything Data plan. But seeing how I'm getting more anytime minutes, Sprint Navigation, Sprint TV, and nights that start at 7pm instead of 9pm --- I'll live. My only real Palm Pre complaints stem from its software or lack of applications, which I'm pretty confident will be addressed with future firmware and software updates. I hope :wink:\n\nIf you're looking for a more in-depth look at the Palm Pre, check out [Precentral's extensive review](https://web.archive.org/web/20100613121400/http://www.precentral.net/palm-pre-review). They cover every aspect of the phone with a detailed write-up, photos, and video walk-through.\n\n* [![Palm Pre lock screen](/assets/images/354t.jpg)](/assets/images/354.jpg)\n* [![Palm Pre closed](/assets/images/355t.jpg)](/assets/images/355.jpg)\n* [![Palm Pre open](/assets/images/356t.jpg)](/assets/images/356.jpg)\n* [![Palm Pre keyboard close up](/assets/images/357t.jpg)](/assets/images/357.jpg)\n* [![Palm Pre camera and mirror](/assets/images/358t.jpg)](/assets/images/358.jpg)\n* [![Palm Pre opened up](/assets/images/359t.jpg)](/assets/images/359.jpg)\n* [![Palm Pre and Palm Centro comparison](/assets/images/360t.jpg)](/assets/images/360.jpg)\n* [![Palm Pre and Palm Centro comparison](/assets/images/361t.jpg)](/assets/images/361.jpg)\n* [![Palm Pre Phone](/assets/images/362t.jpg)](/assets/images/362.jpg)\n* [![Palm Pre Music App](/assets/images/363t.jpg)](/assets/images/363.jpg)\n* [![Palm Pre Tweed App](/assets/images/364t.jpg)](/assets/images/364.jpg)\n* [![Palm Pre App Catalog](/assets/images/365t.jpg)](/assets/images/365.jpg)\n{: .gallery-thumbnails}\n"
  },
  {
    "path": "src/_posts/notes/2009-10-17-eviltron-prank-review.md",
    "content": "---\ntitle: \"The Eviltron and a scary movie makes for a great prank\"\nexcerpt: \"The Eviltron device, when setup properly, can land some convincing scares.\"\nlast_modified_at: 2019-02-16T10:37:51-05:00\nimage: \ncategories: [notes]\ntags: [review, tech geek]\n---\n\nSo we went and saw **Paranormal Activity** last night. If you haven't heard it's basically the **Blair Witch Project** shot in a haunted house. I couldn't have planned it better because earlier in the day my [Eviltron from Think Geek](http://www.thinkgeek.com/gadgets/electronic/c427/) showed up which gave me time to plant it in our bedroom.\n\nThe fact that we just saw a movie about strange noises and ghosts, made hiding the Eviltron perfect for some effective scares. At first I acted startled at the scratching noises and played it up as if there was a mouse or rodent in our attic. But when the small child laughed and it whispered \"hey, can you hear me?\" Wendy freaked out and I had to end the prank. Pretty sure she was ready to runaway and go to her parents' house for the night.\n\nTrick or treat!!!\n\n{% youtube 8LOrtVef9mE %}\n"
  },
  {
    "path": "src/_posts/notes/2009-12-13-doppleganger-credit-card-scammer.md",
    "content": "---\ntitle: \"Bizarro me, a credit card scammer?\"\nexcerpt: \"Apparently there is a bizarro version of me in Niagara County using scammed credit cards.\"\nlast_modified_at: 2017-09-08T08:59:18-04:00\nimage: \ncategories: [notes]\ntags: [Buffalo]\nsupport: false\n---\n\nI had nothing to do with using a bad credit card at Tops' honest! I just happen to look like this dude.\n\n> LOCKPORT --- The Niagara County Sheriff's Office is seeking the public's help in helping to track down a man wanted for the unlawful use of a credit card on Nov. 13 in Tops Market, 5827 S. Transit Road.\n>\n> The man, described as white with horn-rim glasses, long brown hair, *a beard and a flat cap*, was captured on security camera. Call Investigator Michael Leggett at xxx-xxxx.\n>\n> <cite>The Buffalo News</cite>\n\n{% figure caption:\"I think my bizarro twin is running some sort of credit card scam.\" %}\n![Me the fugitive?](/assets/images/michael-the-fugitive.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2010-06-16-soldout-iphone-4.md",
    "content": "---\ntitle: \"Getting the sold out iPhone 4 at launch\"\nexcerpt: \"Looks like I might actually get two iPhone 4s on launch day.\"\nlast_modified_at: 2018-11-08T20:52:30-05:00\ncategories: [notes]\ntags: [iPhone, Apple, tech geek]\nimage:\nsupport: false\n---\n\nLooks like I might actually get an **iPhone 4** on launch day. Took AT&T all day to process the order I made at 6:50 AM EST (6/15/2010), but everything is looking good. Guessing I had no problems getting through because I was a new customer and didn't have to deal with the servers looking up my account info for upgrade eligibility.\n\n> Tue, Jun 15, 2010 at 6:49 AM\n>\n> Dear Michael Rose,\n>\n> Thank you for placing your order with AT&T.\n>\n> Pre-orders for iPhone 4 and iPhone 3GS 8GB will be processed to arrive as early as June 24, 2010, if submitted by 2 p.m. ET, June 22, 2010.\n>\n> The actual shipment date and receipt of your order is not guaranteed and may be subject to delays for reasons that include, but are not limited to, product availability, inventory, credit issues, number porting or carrier delays, and completion of other required AT&T business processes.\n>\n> Additional items added to the cart at the time of your pre-order may ship separately depending on availability. All pre-orders taken online are being handled on a first-come, first-served basis.\n>\n> We appreciate your business and take pride in providing you with the fastest 3G network in America and the best coverage worldwide.\n>\n> Here is a copy of your order summary:\n\n{% figure caption:\"Order status results\" %}\n![iPhone 4 order status](/assets/images/iphone-4-order-status.jpg)\n{% endfigure %}\n\nNow I'm just worried that my existing number is going to be ported over today from Sprint and I'll be without service on my **Palm Pre**. From the looks of it AT&T confirmed my number port for 12:30pm today (6/16/2010). Sure hope it doesn't take effect until I activate via iTunes next week.\n\n{% figure caption:\"Number port status\" %}\n![Sprint number port status](/assets/images/sprint-number-port-status.jpg)\n{% endfigure %}\n\nNow the waiting game begins...\n"
  },
  {
    "path": "src/_posts/notes/2010-06-25-iphone4-impressions.md",
    "content": "---\ntitle: \"Impressions of iPhone 4 from a long time Palm user\"\nexcerpt: \"The following are some of my experiences and observations transitioning from Palm to iOS after nearly 10 years of baggage.\"\nimage: \ncategories: [notes]\ntags: [iPhone, Apple, Palm Pre, review, tech geek]\ntoc: true\n---\n\n{% figure caption:\"My smartphone progression over the years.\" %}\n![Smartphone progression](/assets/images/my-phone-progression.jpg)\n{% endfigure %}\n\nBeing a longtime Palm user *(see picture above)*, I've come to rely on core functionality in my devices --- solid messaging/email clients, robust calendar and task managers, internet connectivity, and the ability to install applications. Now that every new phone released has these functions, there certainly are more choices to be had.\n\nWith that in mind I've decided to leave Palm and webOS in favor of Apple's iOS and iPhone 4 mobile device. The following are some of my experiences and observations transitioning from Palm after nearly 10 years of use.\n\n## iPhone 4 hardware impressions\n\n*\tiPhone 4 is solid, feels great in your hand, and the screen is extra crispy and responsive. The Pre was awfully good at lagging with incoming phone calls or not responding to taps.\n*\tReception was crap in my house until I realized I was \"[holding it wrong](http://www.engadget.com/2010/06/24/apple-responds-over-iphone-4-reception-issues-youre-holding-th/).\"\n*\tCamera is amazing and takes great stills & HD videos. Any photographer will tell you, having more megapixels doesn't make for better images. Glad to see Apple gets this and focused on getting more light to the sensor.\n*\tGPS in this thing seems super accurate and fast. Not sure if it's the hardware or the software but I get accurate locks almost instantly' something my Palm Pre had troubles with.\n*\tBattery life is excellent. Makes it through a full day with juice to spare.\n*\tDoesn't become a hot potato when making calls in areas with poor reception, something I can't say about the Pre.\n*\tI don't miss having a physical keyboard. Really enjoying using it in one hand.\n\n## iPhone 4 software likes\n\n*\tHaving 4 years to polish iOS really shows. No lagging --- applications open fast, and scrolling is smooth like butter. Sup webOS and Android?\n*\tThere really is an app for everything. Sure if you look hard enough at webOS homebrew you're likely to find what you want, but the polish and attention to detail just aren't there. Most apps feel like a proof of concept rather than a finished consumer ready product.\n*\tMore device API's available to iOS developers. Palm is playing catchup and it clearly shows.\n*\tLove me some games, especially unique indie titles.\n*\tiOS Calendar has a list view! One year later and Palm still couldn't be bothered to add that or an agenda view from the old days.\n*\tMail does threaded messages --- thank you.\n*\tVirtual keyboard is awesome. Thought I'd hate typing on a screen, but it works so much better than having to slide out a keyboard to fire off quick replies.\n\n## iPhone 4 software dislikes\n\n*\tSyncing contacts, email, and social media from the cloud is pretty weak. Sure you can link *Facebook* data to contact entries or use *Google Sync* via Microsoft Exchange to push Gmail/calendars/contacts, but they each have some issues. webOS does it much better and with less effort.\n*\tNotifications are weak and obtrusive. Palm nailed it in webOS and easily has the best implementation out there. webOS notifications have nice visual cues and are stackable allowing you to act on them in whatever order you want.\n*\tFaux multi-tasking. Well to be fair I don't dislike the feature, I just think it has room to grow. Right now not all applications support it. Which can be jarring when apps don't resume where you left off.\n\nOverall I'm extremely happy with my purchase. Sure I'm paying the Apple tax on a more expensive monthly bill with data capped at 2GB. But I think it's worth it to have a phone that is responsive, reliable, and a joy to use.\n"
  },
  {
    "path": "src/_posts/notes/2011-04-04-makings-mistake.md",
    "content": "---\ntitle: \"Makings of a mistake, designing the site\"\nexcerpt: \"As a designer we've all been there. When was the last time you got bored with a design and decided to just burn it and start anew?\"\nlast_modified_at: 2015-12-15\ncategories: [notes]\ntags: [web development, Wordpress, design]\nsupport: false\ntoc: true\n---\n\nAs a designer we've all been there. When was the last time you got bored with a design and decided to just scrap it and start from scratch? Yeah, that's what I thought.\n\n## Force feeding a CMS\n\nFor the last decade I've been fighting \"the loop\", squeezing my words in and out of every major web content management system, trying to tame DIV-itus, and determining what voice and creative outlets to live in. Depending on which half of my brain you asked, you'd probably get a different answer about all this madness.\n\nBut you know what? I'm alright with that. I've always been alright with that. The first website I created that wasn't some Geocities piece of mess was a personal project I called Faded Leaf Design.\n\n{% figure caption:\"**November 2001**: Splash screen for Faded Leaf design website that launched a popup window containing Flash documents. Looking back at this now I can't help but see a huge usability nightmare for visitors.\" %}\n![Faded Leaf Design Splash Screen](/assets/images/faded-leaf-design-2001.jpg)\n{% endfigure %}\n\n## Is it a portfolio or is it a blog?\n\nOver time I shifted focus and came up with Made Mistakes as a concept to wrap my online portfolio in. Originally I planned to create it in <del>Macromedia</del> Adobe Flash with a simple <abbr title=\"Extensible Markup Language\">XML</abbr> backend. I quickly dropped that idea, inspired by the momentum gaining in the web standards movement around <abbr>HTML</abbr>, <abbr>CSS</abbr>, and Javascript.\n\nAfter creating some static HTML pages to use as a framework, I settled on replicating the look and feel into [Movable Type](http://www.movabletype.org/). At the the time it was a popular <abbr title=\"Content Management System\">CMS</abbr> being used by other designers and made the most sense for realizing a gallery focused site with blog components.\n\n{% figure caption:\"Made Mistakes started in 2001 with a Flash teaser page and later morphed into a portfolio gallery powered by Movable Type.\" %}\n![Screenshots of Made Mistakes over the years](/assets/images/made-mistakes-flash-xhtml.jpg)\n{% endfigure %}\n\n## Now what?\n\nNow I want to see what I can do to enrich my eye and skills as a designer. I've tired of all the constant reblogging of other's content without attribution or added insight, and feel that I owe it to myself to do more. I suppose the only way to grow is to create often and document the process and inspirations along the way.\n\n{% figure caption:\"Circa 2001, my first home on the web looked like this.\" %}\n![Splash screen for an early personal website](/assets/images/bleedsapathy-splash-page.jpg)\n{% endfigure %}\n\n{% figure caption:\"Redesign sketch that never happened.\" %}\n![Made Mistakes Website Sketch](/assets/images/made-mistakes-sketch.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2011-04-06-knowing-grids-means-breaking-grids.md",
    "content": "---\ntitle: \"Knowing grids means breaking grids\"\nexcerpt: \"Exploring what it means to develop a grid system that helps facilitate strong design with purpose.\"\nlast_modified_at: 2013-04-26\nimage: \n  path: &image /assets/images/knowing-grids-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [design, inspiration]\nsupport: false\ntoc: true\n---\n\nOf all the things to grab my attention, the grid system used in a women's health calendar was certainly not high on my list.\n\nIt's a funny story that will probably make less sense after I describe this awful analogy, but here it goes. You ever do something for so long that you start seeing it creep up in random places? Back in 1997, after I got a Nintendo 64 and played *Super Mario* all night instead of working on my 3D design projects. I started getting these crazy ideas that I could triple jump over ponds or reach the top of buildings by doing a back flip like that mustachioed plumber.\n\nSitting in 2D design and typography classes for 4 years of my life had a similar effect. It was like having a magician expose all his secrets to me. Problem is, I can no longer take these tricks at face value and instead see grid systems, slight of hand, and other illusions played on the eye. Guess that's become both a curse and a blessing...\n\nSo what does all this nonsense have to do with a women's health calendar? Glad you asked because I was about a whole half seconds away from losing focus.\n\n## Three columns two typefaces\n\nThere is absolutely nothing about this cover that I don't like. It's been sitting on a chair in our dinning room for the past month and I always catch myself eye-ing it up. Shhh... don't tell my wife.\n\nThe two punch knockout for me is the combination of serif headlines followed by sans-serif subheads. Whoever designed this made sure they didn't use some bunk freebie font because the ff ligature looks damn good in \"office. A+.\n\n## Interior spreads\n\nContrasting with the cover's wide 3 column grid, the interior pages opt for an even 4. While most pages keep a two column layout, the 4 grid system allows for plenty of variation to accommodate the calendar pages. It keeps a consistent measure in the column spaces and gutters as well, helping to create a nice mathematically derived horizontal rhythm.\n\nImagery on the right page does two things --- adds interest to a text heavy page, but more importantly it draws your eye back in because all of the faces are looking left. When holding the printed piece in hand, the smiling people become one of the first things seen when flipping pages. It immediately pulls you in and helps your eye orientate left to begin reading.\n\nSomething I've been trying to do more of with my print grids, is adhering to a strict vertical rhythm. For the most part the OWH 2011 Calendar achieves this, but could use some minor line-height and spacing adjustments to align all baselines. So much easier to do in print than on the web unless you enjoy [the maths](http://www.alistapart.com/articles/settingtypeontheweb).\n\n## Getting obvious with fine details\n\nI often have a problem with adding to much complexity to a design as a way to give it depth. It's refreshing to see such a modern and minimal approach in this piece. A minor detail I'm willing to bet non-designers never noticed was the thought put into border shapes and frames. In each of the *health problems'* icons, the bottom corner is formed at a perfect 90 degree angle instead of rounded. This contrast in shape creates an arrow that helps direct you down to the next line of text.\n\nIf I've learned anything as a designer, it's to make more insightful moves with my grid and other invisible elements. Hopeful this will let the content of each design do the communicating and draw attention. That's really the point of all this --- isn't it?\n\n{% figure caption:\"Fine and subdued imagery catches my eye?\" %}\n[![Office on Women's Health 2011 calendar cover](/assets/images/owh-grid-cover-300.jpg)](/assets/images/owh-grid-cover-800x452.jpg \"calendar cover\")\n{% endfigure %}\n\n{% figure caption:\"Taking the time to develop a strong grid system helps bring order to placing type and image.\" %}\n[![OWH page spread with 4 column grid](/assets/images/owh-grid-spread-300.jpg)](/assets/images/owh-grid-spread-800x454.jpg \"4 column grid example\")\n{% endfigure %}\n\n{% figure caption:\"Nothing irks me more than when drop shadows are applied with default Photoshop layer styles. Glad to see someone dialing back the opacity and blur for a subtle way of adding dimension.\" %}\n[![OWH calendar pages and nice subdued drop shadows](/assets/images/owh-grid-calendar-300.jpg)](/assets/images/owh-grid-calendar-800x472.jpg \"Subdued drop shadow example\")\n{% endfigure %}\n\n{% figure caption:\"A straight corner is just asking to stand out amongst the rounded and direct eye traffic to a logically spot.\" %}\n[![OWH 4 column grid and icon detail](/assets/images/owh-grid-icons-300.jpg)](/assets/images/owh-grid-icons-620x298.jpg \"Icons detail\")\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2011-04-12-typography-urban-outfitters.md",
    "content": "---\ntitle: \"Typography no nos with Urban Outfitters\"\nexcerpt: \"The typography in Urban Outfitters latest catalog has some serious readability issues.\"\nlast_modified_at: 2013-04-26\nimage: \n  path: &image /assets/images/UO11-spring-featured.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [design]\nsupport: false\ntoc: true\n---\n\nI think it is very clear that the April 2011 *Urban Outfitters* catalog was more concerned with style and art direction than typography. Now, I'm not trying to weigh the implications of, or reasons for this. Being a designer who values legibility and hierarchy, this catalog sure is filled with a bunch of head scratching typographic choices.\n\n{% figure caption:\"Would it have hurt to move these blocks of type to right a few inches?\" %}\n![UO April 2011 inside front cover detail](/assets/images/UO-bad-type-placement.jpg)\n{% endfigure %}\n\n## Violators, mount up\n\nInside front cover starts off with this gem. I absolutely hate when an element in the background violates a block of type in the foreground. Now sometimes this can serve a purpose, but here I can't fathom one single reason why you'd place a paragraph on top of a light stand or whatever the hell that is. I just can't help wanting to move both paragraphs to the right three inches and neatly tuck them under the protruding umbrella...\n\n## I hate full justified type\n\nOk cool, moving on. Pet peeve number 2. Well really this should be numero uno, but seeing how it wasn't the first offense I noticed, I'll cut it some slack. But honestly, I don't get the point of fully [justified type](http://en.wikipedia.org/wiki/Justification_(typesetting)). Pretty sure this isn't a newspaper, magazine, or periodical that's so tight on space that it actually makes sense to squeeze in a few extra characters this way.\n\nI'm probably wrong and this isn't suppose to be a catalog. What would be the point of making the product description readable? Or why would you want to clearly define item SKUs and prices so someone could actually find them and place an order? Lines running into each other without any breaks, hierarchy, or logic always seem to make a ton of design sense. Ugh.\n\nOh never mind. At Least one page out of 48 must have read Ellen Lupton's [*Thinking with Type*](http://www.amazon.com/gp/product/1568989695/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=1568989695). Away with fully justified type and in with a lovely rag on the right. And would you look at this, size, weight, and placement changes to help lead you from section to section. I might actually be able to figure out what descriptions go with each piece of clothing. Now if I could only tell if that's a 1 or a capital i.    \n\n![Urban Outfitters April 2011 Cover photo](/assets/images/UO-spring11-cover.png)\n{: .align-right}\n\n## Typography rulez\n\nKidding aside. I've always enjoyed Urban Outfitters fresh ideas even if they break a few rules along the way. They never get locked into using the same typefaces, mastheads, logos, photography, paper stock, etc. About the only thing consistent is the inconsistency of each season's catalog --- a trend that follows through on [their website](http://www.styleite.com/retail/urban-outfitters-new-website/ \"Type on arches? Yeah UO did that on their website\"). And for something so closely tied to fashion that's probably a smart move.\n\nAt the end of the day I really doubt any one is looking at these pages wondering why the kerning is off. They're most likely thinking, \"damn this hipster bullshit is overpriced\" or why aren't any of these ladies wearing pants?\n\n## Readability no nos\n\n{% figure caption:\"Just for giggles I mocked up a type treatment with left justified type and varying font weights. Which one do you think is easier to read? A or B.\" %}\n![Urban Outfitters type comparison](/assets/images/UO-product-text.jpg)\n{% endfigure %}\n\n{% figure caption:\"White type on a light gray background is awful for readability.\" %}\n![Another example of bad type and no regard for readability](/assets/images/UO-awful-readability.jpg)\n{% endfigure %}\n\n{% figure caption:\"This page isn't half bad. No justified type, nice rag, and solid use of a grid. A++\" %}\n![Urban Outfitters catalog typography](/assets/images/UO-type-hiearchy.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2011-04-21-collecting-records-artwork.md",
    "content": "---\ntitle: \"Collecting records for the artwork\"\nexcerpt: \"How the hand crafted aesthetics found in DIY released emo and hardcore records started my collecting addiction.\"\nimage: \n  path: &image /assets/images/collecting-records-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [inspiration, design]\nsupport: false\ntoc: true\nlast_modified_at: 2017-12-12T16:27:14-05:00\n---\n\nMost of the [records I purchased](http://www.recordnerd.com/lists/bleedsapathy) in the late 90's--early 2000's were self-released or put out by small independent labels. \n\n## Hand lettered, the stuff of my dreams\n\nLooking back, my favorite sleeves and liner note designs all shared a common element --- they were created by hand and printed in black and white. Which is an interesting comparison to the digital world of today, were kids have access to sophisticated desktop publishing software, and affordable means to print full color on a range of paper stocks.\n\n## Anything but the Swiss\n\nThumbing through boxes of dusty hardcore and emo records, it's easy to see where many of my early aesthetics drew inspiration from. In college I tired of the [Swiss style](https://en.wikipedia.org/wiki/International_Typographic_Style \"International Typographic Style\") every one of my peers was regurgitating in *Typography I* and *II*. What excited me more, was mashing analog approaches of zine and DIY record packaging design with refined digital methods and craftsmanship. Focusing less on the gloss and more on the method, gave me a greater appreciation of texture and how to communicate with it.\n\n*[DIY]: Do It Yourself\n\nInstead of embarrassing myself with examples of my early fumbles as a graphic designer --- I'd like to share inspirational fragments from my record collection. With over 500 LP's and 45's, I'm sure I can find plenty of material to critique and comment on.\n\n{% figure caption:\"Upcoming artwork to be discussed.\" %}\n![Image of upcoming artwork to be critiqued](/assets/images/record-art-teaser-620x217.jpg)\n{% endfigure %}\n\n## More to come\n\nJust finished capturing some photographs of artwork that ranges from black/white ink drawings, fancy die-cuts, to sleeves printed on vellum with metallic inks...\n"
  },
  {
    "path": "src/_posts/notes/2011-04-25-record-art-review-agna-moraines-autobiography-7-inch.md",
    "content": "---\ntitle: \"Agna Moraine's Autobiography, handwritten record art\"\nexcerpt: \"I couldn't begin to tell you what the artwork in this emo record means. But silk screening lyrics on fabric scrapes is kind of cool.\"\nlast_modified_at: 2013-04-26\nimage: \n  path: &image /assets/images/agna-moraines-autobiography-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [inspiration, design]\nsupport: false\ntoc: true\n---\n\nEmo bands from the late 1990's make up a good portion of my record collection. I was really drawn to quirky vocals, high pitched screams, odd tempo changes, and plenty of twinkle in the guitars.\n\n## Twinkle twinkle, whining in sweaters\n\nAnother aspect of these bands that I enjoyed, were the materials being released with their records and tapes. Almost always created by hand, my favorites were either silk screened designs or deliberately worn photocopies of original drawings and illustrations.\n\nProduced on the cheap meant you often received extra \"goodies\" in the record sleeves that you'd never see in commercially released albums. And because the methods of producing these elements were following a do-it-yourself ethic, the end result looked like one of a kind creations. Notes and drawings scrawled in a journal, torn out, folded, and placed alongside a 7-inch record for you to connect with when played on a turntable in your bedroom.\n\n{% figure caption:\"Outside sleeve illustrations\" %}\n[![Agna Moraine's Autobiography outside sleeve illustrations](/assets/images/agna-moraines-autobiography-outside-sleeve-620x413.jpg)](/assets/images/agna-moraines-autobiography-outside-sleeve.jpg \"outside sleeve illustrations\")\n{% endfigure %}\n\n## Collect for the music, collect for the artwork\n\n*Agna Moraine's Autobiography* put out a Self Titled 7-inch sometime in 1999 (I think) on Anima. From the liner notes it looks like these dudes might be from Kalamazoo, Michigan... unless that's the label's home base.\n\nArtwork on the front sleeve appears to have little to do with the song titles or content. Unless there is some obvious connection between knives, brown leaves, guns, wishes, skulls and memories I'm missing.\n\nThere is a mix of hand written lyrics silk screened on scraps of fabric (nice touch), and what looks like a poem typed out on a sheet of white paper. The poem sheet includes an illustration of a fish jumping out of water. As far as I can tell this sheet has nothing to do with the record since none of the words appear in the songs.\n\nThe record is pressed on black with white labels. Side A lists the 4 song titles, while Side B has a crude line art drawing of a man worshiping the moon near a dead tree and pond.\n\nImages, sounds, and lyrics are all over the place on this record. But that's ok. Maybe they're meant to be from a dream...\n\n## Additional packaging photographs\n\n{% figure caption:\"Song lyrics on fabric\" %}\n[![Agna Moraine's Autobiography song lyrics on fabric](/assets/images/agna-moraines-autobiography-fabric-lyrics-300.jpg)](/assets/images/agna-moraines-autobiography-fabric-lyrics.jpg \"Song lyrics on fabric\")\n{% endfigure %}\n\n{% figure caption:\"Illustrations and drawings on fabric\" %}\n[![Agna Moraine's Autobiography illustration on fabric detail](/assets/images/agna-moraines-autobiography-detail-fabric-art-300.jpg)](/assets/images/agna-moraines-autobiography-detail-fabric-art-620x449.jpg \"Illustrations and drawings on fabric\")\n{% endfigure %}\n\n{% figure caption:\"Liner note illustrations\" %}\n[![Agna Moraine's Autobiography liner notes illustartions](/assets/images/agna-moraines-autobiography-liner-notes-illustartion-300.jpg)](/assets/images/agna-moraines-autobiography-liner-notes-illustartion.jpg \"Liner note illustrations\")\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2011-05-08-urban-outfitters-typography-goof.md",
    "content": "---\ntitle: \"Urban Outfitters, ya typography dun goofed again\"\nexcerpt: \"Glad to see improvements in the May 2011 Urban Outfitters catalog. Especially since I took a few issues with their typography last month.\"\nimage: \n  path: &image /assets/images/UO-may11-feature.jpg\n  width: 1024\n  height: 512\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [design]\nsupport: false\ntoc: true\n---\n\nGlad to see improvements in the May 2011 Urban Outfitters catalog. Especially since I took [a few issues with the typography](/articles/typography-urban-outfitters/) and other design choices last month.\n\n## A step in the right direction\n\nI was shocked to see product copy that was almost legible and set in a serif typeface instead of a sans ([P22 Underground](https://web.archive.org/web/20111111003402/http://www.p22.com/products/underground.html)). Plus they even made a half effort to number blocks of text with corresponding photographs on the page (see below for example). Although it would have been nice if they actually captioned the photographs so I don't have to think as much\n\n{% figure caption:\"The serif typeface used here is quite beautiful --- especially the ampersand glyph and italic set.\" %}\n![Urban Outfitters May 2011 serifs and italics](/assets/images/UO-MAY11-serifs-italics.jpg)\n{% endfigure %}\n\n## How to ruin good photography with bad typography\n\nSullied by page spreads that are obviously more interested in making beautiful pictures than helping customers make informed buying decisions.\n\n{% figure caption:\"It's really hard to tell what this catalog is trying to sell, beautiful photographs or clothing and accessories?\" %}\n![Urban Outfitters May 2011 excellent photography](/assets/images/UO-MAY11-photography.jpg)\n{% endfigure %}\n\nI've tired trying to discover any sort of detail on the clothing and product sold in this catalog. I mean how could I? You basically need a magnifying glass and more patience I'm willing to waste trying to sort out what price and item number goes with each photograph.\n\n{% figure caption:\"Looks like someone's RETURN key is busted. Unless it was intentionally set to generate headaches...\" %}\n![Urban Outfitters May 2011 unreadable mess](/assets/images/UO-MAY11-unreadable-mess.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2011-05-10-free-aboutme-business-cards.md",
    "content": "---\ntitle: \"My About.me profile\"\nexcerpt: \"How 5 minutes spent creating an About.me profile nabbed me free Moo business cards of my own design.\"\nimage: \n  path: &image /assets/images/about-me-featured.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [design]\nsupport: false\nlast_modified_at: 2019-02-16T10:45:17-05:00\n---\n\nPretty much the only reason I created an About.me page was to get free customized business cards printed by Moo.\n\nIf you weren't aware --- [About.me](https://about.me) is a custom profile and personal analytics dashboard that lets you quickly build a personal page that points users to your content from around the web. Its straightforward WYSIWYG editor makes customizing the design, fonts, colors, and background image a breeze.\n\n*[WYSIWYG]: What you see is what you get\n\n{% figure caption:\"The QR code looks cool, but I doubt anyone actually scans these things.\" %}\n![Holding a Made Mistakes business card](/assets/images/michael-rose-business-card-qr-620x413.jpg)\n{% endfigure %}\n\n{% figure caption:\"Screenshot of my About.me page that I created in a whole 5 minutes.\" %}\n[![Screenshot of my about.me page](/assets/images/michael-rose-about-me-620x349.jpg)](https://about.me/michael.rose)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2011-05-19-record-art-review-corn-on-macabre-7-inch.md",
    "content": "---\ntitle: \"Corn On Macabre record art --- vellum and metallic ink bliss\"\nexcerpt: \"My favorite thing about this Corn On Macabre 7-inch record is the use of vellum and metallic inks in the sleeve.\"\nimage: \n  path: &image /assets/images/COM-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [inspiration, design]\nsupport: false\ntoc: true\n---\n\nMy favorite thing about this Corn On Macabre record has nothing to do with the band or the music. Sense of sight and touch often influence me more than sounds...\n\n## The medium is important\n\nAn often overlooked aspect in design are the materials chosen to help communicate the message(s). The paper printed on and the ink printed with, can completely screw with a design if they're speaking different languages.\n\nIf the sleeve art for this *Corn On Macabre* 7-inch was printed on Classic Columns or some piece of bright white the tone would be at odds with the music. I think more of sludge, dirt, and faded photographs when listening to Chapter One. Song titles and lyrics about horror movies don't exactly benefit being printed on glossy card-stock, know what I mean?\n\n## Liner notes and metallic ink\n\nNot sure how much it added to the production cost, but I sure like the way vellum looks and feels. The translucency of the paper looks even better when these photographs are printed on it with a metallic ink. If I remember correctly, I think [Brent Eyestone's](http://www.discogs.com/artist/Brent+Eyestone) earlier band *Waifle* printed on vellum in one of their full length releases.\n\n## Record packaging detail images\n\n{% figure caption:\"Detail photo of liner notes set in Trajan\" %}\n[![Detail photo of liner notes set in Trajan](/assets/images/COM-metallic-ink-trajan-620x197.jpg)](/assets/images/COM-metallic-ink-trajan.jpg \"Everyone's favorite movie poster typeface, Trajan.\")\n{% endfigure %}\n\nApparently my asshole cat shares a taste for vellum too. Maybe it was the smell, or maybe it was the way the sun caught the metallic ink, but he sure couldn't help himself from biting into it --- bastard. So much for selling this Corn On Macabre record in mint condition.\n\n{% figure caption:\"Detail photographs of the packaging.\" class:\"gallery-2-col\" %}\n[![Record sleeve typography](/assets/images/COM-record-sleeve-typography-300.jpg)](/assets/images/COM-record-sleeve-typography.jpg)\n[![Corn on Macabre - punk is undead](/assets/images/COM-punk-is-undead-300.jpg)](/assets/images/COM-punk-is-undead.jpg)\n[![Linear notes and images](/assets/images/COM-record-sleeve-300.jpg)](/assets/images/COM-record-sleeve.jpg)\n[![Photo detail of metallic ink printed image](/assets/images/COM-metallic-ink-image-300.jpg)](/assets/images/COM-metallic-ink-image.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2012-04-04-romance-egg-engagement.md",
    "content": "---\ntitle: \"Easter egg marriage proposal\"\nexcerpt: \"Two years ago on this day, I proposed to my wife Wendy by leading her on an Easter egg scavenger hunt.\"\nimage: \n  path: &image /assets/images/romance-engagement-feature.jpg\n  width: 768\n  height: 384\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [life]\nsupport: false\nlast_modified_at: 2018-02-09T08:20:09-05:00\n---\n\nI've always been one of those guys who didn't understand why women enjoyed receiving dead flowers. So two years ago when I decided to propose marriage to [my girlfriend Wendy](https://2littlerosebuds.com/), I was at a slight disadvantage --- I'm not a romantic, I don't do romance.\n\nThe ring was purchased, but the method of delivering it eluded me. Easter Sunday was quickly approaching and the idea of doing a scavenger hunt that ultimately led to the ring and me on one knee, popped in my head.\n\nI wrote around ten clues that I sealed in plastic eggs and hid around our house the night before while Wendy showered. In the morning I woke her up, promising her a little diversion that she thought would end at an Easter basket full of *vegan treats*. At least that's what I alluded to, so she'd get the hell out of bed!\n\nClue after clue, egg after egg, I led Wendy throughout the house until she found the last one…\n\n![Easter egg with the final proposal clue](/assets/images/final-egg-clue.jpg)\n\nI dropped to one knee, she dropped an F-bomb… and then said yes after realizing what just happened. Six months later, on October 2nd, 2010 we were married at [**The Roycroft Inn**](http://www.roycroftinn.com/) in East Aurora, New York. Come this fall, we're expecting to double the size of our family with the arrival of the twins, and I couldn't be happier!\n"
  },
  {
    "path": "src/_posts/notes/2012-08-31-paperfaces-ipad-portrait-project.md",
    "content": "---\ntitle: \"iPad portraits with Paper for iOS\"\nexcerpt: \"An experiment in humanizing the web — drawing a portrait everyday day using an iPad and Paper for iOS.\"\nlast_modified_at: 2017-09-07T15:53:18-04:00\nimage: \n  path: &image /assets/images/paperfaces-project-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [Paper for iOS, Apple, illustration]\ncomments: true\ncomments_locked: true\ntoc: true\n---\n\nPaperFaces was an iPad drawing project by time traveling designer and illustrator Michael Rose --- that's me! It began in August 2012, when I started drawing portraits on my iPad using the [Paper by FiftyThree app](http://www.fiftythree.com/paper) and [ended exactly two years later]({% post_url /articles/2014-08-29-paperfaces-retrospective %}). \n\n## Latest portraits\n\nThe last batch of PaperFaces drawings along with in process sketches for each. They can also be found scattered across social media if you dig back far enough: [Twitter](https://twitter.com/mmistakes), [Instagram](http://instagram.com/mmistakes), and [Tumblr](http://mademistakes.tumblr.com).\n\n<ul class=\"gallery-thumbnails\">\n{% for post in site.categories.paperfaces limit:15 %}\n  <li>\n    <a href=\"{{ post.url }}\" title=\"{{ post.title }}\"><img src=\"{{ post.image.thumbnail }}\" alt=\"\"></a>\n  </li>\n{% endfor %}\n</ul>\n\n<div markdown=\"0\"><a href=\"/paperfaces/\" class=\"btn\" style=\"margin-bottom:0;\">View all PaperFaces Portraits</a></div>\n\n## Frequently asked questions\n\n### Will you draw me?\n\nUnfortunately I am no longer taking volunteers for the project. <s>If you'd like to commission me to illustrate your Twitter avatar, recreate a photograph in my PaperFaces™ style, draw your pet dinosaur, or whatever, follow the link below.</s> I'm currently taking a break from drawing portraits as well. Sorry :-(\n\n### What is PaperFaces?\n\nPaperFaces is the name that I coined for the portraits I was drawing with the Paper by 53 iPad app. Most of the Paper creations share the #MadeWithPaper hashtag, so I thought [PaperFaces](https://twitter.com/search?q=PaperFaces&src=typd) would fit in with that theme and decided to start tagging each portrait with it.\n\nOne night, out of sheer boredom, I decided I'd try to recreate <a href=\"/assets/images/paperfaces-veganwendy-twitter.jpg\" title=\"iPad drawing of @veganwendy\" rel=\"gallery\">my wife's Twitter avatar</a> with Paper by 53. The positive response that resulted from that drawing prompted me to create one of <a href=\"/assets/images/paperfaces-mmistakes-twitter.jpg\" title=\"iPad drawing of @mmistakes\" rel=\"gallery\">my own avatar</a>, which also went over well with my small group of Twitter and Instagram followers.\n\nDue to the positive comments that I received, I decided to put a call out for more portrait volunteers. Without really considering the implications of my actions, I posted the following:\n\n<blockquote class=\"twitter-tweet\"><p>Retweet and I'll draw your profile picture using Paper on my iPad <a href=\"https://twitter.com/search/%23MadeWithPaper\">#MadeWithPaper</a> <a href=\"http://t.co/5oqH4bJt\" title=\"https://twitter.com/mmistakes/status/240601384477659136/photo/1\">twitter.com/mmistakes/stat…</a></p>&#8212; Michael Rose (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/240601384477659136\" data-datetime=\"2012-08-29T00:06:55+00:00\">August 29, 2012</a></blockquote>\n<script async src=\"//platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n\nA few hours later, while grocery shopping with my wife, my iPhone started blowing up with retweet and @reply notifications. By the end of the day I had amassed around 300 volunteers and figured that turning it into a formal 365 day project might be fun.\n\nWhen the count hit 700, I revised my initial goal of 365 to 730 (that's two a day for a year), due to the increased demand and not wanting to let anyone down. At around the same time, I started getting inquiries about the project, and whether I was accepting donations. At the suggestion of friends and some newfound supporters, I published this page to better explain the project and added PayPal buttons on the site for those who wanted to motivate me to keep the project going.\n\n### Why the blank faces?\n\nWhen I began the project I attempted to draw each face as detailed and accurately as possible. Even though I'm classically trained in illustration and the fine arts, photo realism isn't really \"my bag.\" Part of what attracted me to Paper by 53 was its small tool set, lack of zoom, and focused color palettes. Trying to interpret each portrait using these constraints helped me to stumble across the whole \"blank face\" look and grow as an artist.\n\n{% figure caption:\"PaperFaces iPad portrait of my two twin girls.\" class:\"large\" %}\n![Rosebud twins' portrait](/assets/images/paperfaces-rosebud-twins-l.jpg)\n{% endfigure %}\n\nAfter drawing over 600 portraits with Paper my skills have matured and I've begun drawing the entire face. It has been a fun personal challenge to capture as much detail in as little time possible.\n\n### What's your process like?\n\nIt all starts with a list. If there are paying commissions in the queue, I work on those portraits first. With over 2,300 portrait requests, I need a way to accurately check who has retweeted my initial post. I use [Favstar.fm](http://favstar.fm/) to view all my retweets and determine who is next, then grab their Twitter avatar and save it to my iPhone's camera roll. It's by no means a perfect system, and requests do fall through the cracks, but it's the best I've come up with so far.\n\nNext, I fire up Paper on my iPad, draw a black square with the pen tool, and start roughing out the illustration with the pencil tool. What works well for me is resting an iPhone right on the iPad's screen so I can reference the original photograph as I draw. This allows me to relax in my living room with the family, instead of sitting at a desk in a studio.\n\nUpon the portrait's completion, I share it from within the Paper by 53 app to Twitter and Tumblr, repost a cropped version to Instagram, and @reply the volunteer to notify them. If they donated or ask nicely, I send them a larger sized version in case they'd like to print it out. Using Evernote, I mark the drawing complete in my fancy PaperFaces notebook and move on to the next portrait.\n\nAnd yes, I use a stylus. For the first 50 or so portraits I drew exclusively with a [Just Mobile AP-818 Universal AluPen Stylus][alupen] until the tip wore out. I moved on to a [LunaTik Alloy Touch Pen Stylus/Ink Pen][lunatik] and am now using a [Pogo Connect Bluetooth 4.0 Smart Pen][pogoconnect] with all that pressure sensitive goodness.\n\n[alupen]: http://www.amazon.com/gp/product/B0042U9AT6/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=B0042U9AT6\n[lunatik]: http://www.amazon.com/gp/product/B00821TR7G/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=B00821TR7G\n[pogoconnect]: http://www.amazon.com/gp/product/B009K448L4/ref=as_li_ss_tl?ie=UTF8&tag=mademist-20&linkCode=as2&camp=1789&creative=390957&creativeASIN=B009K448L4\n\n### When are you going to stop?\n\nAt the moment, there is a *waiting list* of over 2,000. Now I know what you're thinking, \"this dude is never going to draw all those.\" Well, you're probably right. Though I am making progress and have drawn just shy of {{ site.categories.paperfaces | size }} finished illustrations.\n\nWorking my day job as a designer, then spending the rest of the evening with my wife and twin baby girls doesn't leave much free time. Since this project is a fun diversion for myself, I allot a few hours each night to draw a portrait or two. On average most portraits take me 1--2 hours to complete. It really depends on the complexity of the original photograph and how much detail I'm trying to capture.\n\n## Usage and copyright\n\nEach PaperFaces portrait is protected under a [Creative Commons License](/terms/ \"Attribution-NonCommercial 4.0 International\"). That means they're free to use as avatars, share on social media, or print for personal use only.\n\n## Video tutorials\n\nI use the term \"tutorial\" loosely. What you'll find here are glorified slide shows highlighting various stages of PaperFaces drawings. To create these I take periodic screenshots on the iPad and then generate a slide show with them using Aperture for Mac OS X. It's not quite the same thing as a true speed painting video, but it does show how I attacked each of these portraits. I've also [documented my process](/mastering-paper/ \"How I draw with Paper by 53 and an iPad\") in the written form, if reading is  your thing.\n\n{% notice %}\n#### Video process update\n\nI've recently discovered [Reflector](http://www.reflectorapp.com/) which allows the screen of an iOS device to be mirrored on a Mac or PC via AirPlay. True speed painting videos here I come!\n{% endnotice %}\n\n{% figure caption:\"View more of my Paper by FiftyThree video tutorials on [YouTube](https://www.youtube.com/user/anotherjpeg) or read [how I use Paper](/mastering-paper/).\" %}\n{% youtube videoseries?list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao&amp; %}\n{% endfigure %}\n\n## Homages\n\nI've been completely humbled by all the support and attention coming my way since I started this project. Drawing someone's portrait and having them thank you by returning the favor is all kinds of amazing. I'm featuring those drawings here, along with any that follow the \"PaperFaces style.\" If you want your drawing(s) to be included leave a comment below (include your drawing in the comment) or [tweet me](https://twitter.com/mmistakes).\n\n<ul id=\"fanart-gallery\" class=\"gallery-thumbnails\">\n  <li><a href=\"/assets/images/homage-pepfre-mmistakes-lg.jpg\"><img src=\"/assets/images/homage-pepfre-mmistakes-150.jpg\" alt=\"PaperFaces portrait of @mmistakes drawn by @Pepfre\"></a></li>\n  <li><a href=\"/assets/images/homage-missshrestha-rosebuds-lg.jpg\"><img src=\"/assets/images/homage-missshrestha-rosebuds-150.jpg\" alt=\"PaperFaces portrait of the twins drawn by @missshrestha on Instagram\"></a></li>\n  <li><a href=\"/assets/images/homage-morgantj-mmistakes-lg.jpg\"><img src=\"/assets/images/homage-morgantj-mmistakes-150.jpg\" alt=\"PaperFaces portrait of @mmistakes drawn by @morgantj\"></a></li>\n  <li><a href=\"/assets/images/homage-tortadecereja-mmistakes-lg.jpg\"><img src=\"/assets/images/homage-tortadecereja-mmistakes-150.jpg\" alt=\"PaperFaces portrait of @mmistakes drawn by @tortadecereja\"></a></li>\n  <li><a href=\"https://www.instagram.com/p/W8WaxfAYmG/\"><img src=\"/assets/images/homage-lindseyvail-art-1-150.jpg\" alt=\"PaperFaces homage drawn by @lindseyvail_art on Instagram\"></a></li>\n  <li><a href=\"http://instagram.com/p/W5r5EwgYge/\"><img src=\"/assets/images/homage-lindseyvail-art-2-150.jpg\" alt=\"PaperFaces homage drawn by @lindseyvail_art on Instagram\"></a></li>\n  <li><a href=\"http://instagram.com/p/VQ4-6HklEU/\"><img src=\"/assets/images/homage-m0im0i-150.jpg\" alt=\"PaperFaces homage drawn by @m0im0i on Instagram\"></a></li>\n  <li><a href=\"https://twitter.com/LovisasLife/status/314699959775662081\"><img src=\"/assets/images/homage-lovisaslife-150.jpg\" alt=\"PaperFaces homage drawn by @LovisasLife on Twitter\"></a></li>\n  <li><a href=\"http://instagram.com/p/QTn7jWJkHj/\"><img src=\"/assets/images/homage-ramesstudios-150.jpg\" alt=\"PaperFaces homage drawn by @ramesstudios on Instagram\"></a></li>\n  <li><a href=\"http://instagram.com/p/cHexhprrxf/\"><img src=\"/assets/images/homage-konstnaren-150.jpg\" alt=\"PaperFaces homage drawn by @konstnaren on Instagram\"></a></li>\n  <li><a href=\"http://instagram.com/p/aVh8QOJ-uv/\"><img src=\"/assets/images/homage-grumz-150.jpg\" alt=\"PaperFaces homage drawn by @grumz on Instagram\"></a></li>\n  <li><a href=\"http://eichan68.tumblr.com\"><img src=\"/assets/images/homage-eichan68-150.jpg\" alt=\"PaperFaces homage drawn by @eichan68 on Instagram\"></a></li>\n</ul>\n\n## Featured on\n\nJust sharing the love with some links back to articles and galleries that have featured my PaperFaces artwork and story.\n    \n* [This Summer We Learned About PaperFaces…](http://madewithpaper.fiftythree.com/post/36767754768/this-summer-we-learned-about-paper-faces-by)\n* [53 Outstanding Works of Art Made with Paper by FiftyThree](https://designshack.net/articles/inspiration/53-outstanding-works-of-art-made-with-paper-by-fiftythree/)\n* [The Story of #PaperFaces](https://web.archive.org/web/20130723152905/http://anewatlantis.com/2013/01/the-story-of-paperfaces/)\n* [15 Beautiful Faces Made with the Paper iPad app](http://www.obeymagazine.nl/graphic-design/illustraties/15-gezichten-paper-ipad-app/)\n* [22 Gorgeous Pieces Of Art You Won't Believe Were Drawn On An iPad](http://www.businessinsider.com/gorgeous-ipad-art-2015-1)\n\n{% notice %}\n#### Mastering Paper for iOS tutorials\n\nSince starting PaperFaces I've received a few inquiries on my illustration techniques --- so I wrote a guide for you called [Mastering Paper](/mastering-paper/). You're welcome!\n{% endnotice %}\n"
  },
  {
    "path": "src/_posts/notes/2013-08-29-365-days-of-drawing.md",
    "content": "---\ntitle: \"365 days of drawing faces\"\nexcerpt: \"Year one of my 365 day portrait project may be over, but I'm just getting started.\"\nimage: \n  path: &image /assets/images/paperfaces-476-portraits.jpg\n  width: 1280\n  height: 704\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [life, illustration, Paper for iOS, Apple]\ncomments: true\ncomments_locked: true\nlast_modified_at: 2017-12-12T16:27:38-05:00\n---\n\nToday my 365 project titled [**PaperFaces**](/paperfaces/) turns one --- holy smokes! In this past year I've managed to illustrate 476 portraits, make a ton of new *Paper friends*, burned through a few pen styli, and rekindled my passion for drawing. \n\nI honestly can't believe I've been drawing strangers for 365 days straight. I was half joking when I posted this and had no idea it would take off in the way that it did.\n\n<blockquote class=\"twitter-tweet\"><p>Retweet and I'll draw your profile picture using Paper on my iPad <a href=\"https://twitter.com/search/%23MadeWithPaper\">#MadeWithPaper</a> <a href=\"http://t.co/5oqH4bJt\" title=\"https://twitter.com/mmistakes/status/240601384477659136/photo/1\">twitter.com/mmistakes/stat…</a></p>&#8212; Michael Rose (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/240601384477659136\" data-datetime=\"2012-08-29T00:06:55+00:00\">August 29, 2012</a></blockquote>\n<script async src=\"//platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n\n## Big ups and stuff\n\n- Thank you to everyone who volunteered their face for the project.\n- Thank you to the 91 of you who commissioned portraits.\n- Thank you to everyone who has followed me on [Twitter](https://twitter.com/mmistakes), [Instagram](https://instagram.com/mmistakes), and [Facebook](https://facebook.com/michaelrose).\n- Thank you for all the kind @replies, emails, comments, favorites, likes, and encouragement.\n- Thank you [**FiftyThree**](http://www.fiftythree.com/) for developing the app that made all this possible, fostering a [community of creators](http://madewithpaper.fiftythree.com/) who inspire me daily, and for supporting my project by featuring it in posts and tweets.\n\n{% figure caption:\"Some of my favorite portraits I've illustrated.\" class:\"gallery-3-col\" %}\n[![PaperFaces portrait of a horsehead](/assets/images/paperfaces-studioprisoner-twitter-600.jpg)]({% post_url /paperfaces/2013-06-17-studioprisoner-portrait %})\n[![PaperFaces portrait of a Go master](/assets/images/paperfaces-go-master-600.jpg)]({% post_url /paperfaces/2013-06-05-go-master-portrait %})\n[![PaperFaces portrait of long flowing hair](/assets/images/paperfaces-genevasands-twitter-600.jpg)]({% post_url /paperfaces/2013-01-17-genevasands-portrait %})\n{% endfigure %}\n\nHere's to another fun year of blank faces. And to the thousands of you still waiting for portraits... I'm working on them, really I am.\n"
  },
  {
    "path": "src/_posts/notes/2014-03-07-starting-young.md",
    "content": "---\ntitle: \"Starting young\"\nexcerpt: \"It was only natural the two little rosebuds would become early adopters of technology.\"\nimage: \n  path: &image /assets/images/starting-young-feature.jpg\n  width: 1920\n  height: 546\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [life, Paper for iOS, tech geek, twins]\ncomments: true\ncomments_locked: true\nlast_modified_at: 2017-09-07T15:59:12-04:00\n---\n\nThis *technology thing* has been both a blessing and a curse as my wife and I try to navigate parenthood.\n\nShortly after our twin girls were born 19 months ago: moments were captured, milestones shared, feedings and diaper changes --- coordinated all from app enabled mobile phones. This is how technology saved us.\n\n{% figure caption:\"\" class:\"align-right\" %}\n![Oh Trotro, oh Trotro](/assets/images/trotro.gif)\n{% endfigure %}\n\nWhat I didn't anticipate was how quickly the *two little rosebuds* would become attracted to these glowing screens. When it wasn't the 4\" variety held tightly between our fingers, it was the 51\" wall hugger in our living room. On demand Netflix programming became the norm, and look out if their favorite French cartoon **[Trotro](http://thetvdb.com/?tab=series&id=108061)** buffers for a few seconds...\n\nAnyways, back to the point. For the last couple of months my wife and I have been trying to help the twins hit some of their milestones. They were born a few weeks premature so it's been a challenge motivating them to walk, eat on their own, use utensils, stack blocks, speak, etc.\n\nColoring is one milestone we never once considered they'd be ready for, but for whatever reason our doctor always brings it up first. So we try it, we work with them. Like most activities involving something the twins have to hold --- they chuck it across the room the second they grab it. Now it's not like we expect little Pablo Picasso's, but if they just held a crayon for more than a second --- we'd consider that a victory.\n\nAnd so back to that technology thing. The girls love glowing screens, I love glowing screens! Hey, there's this [drawing and sketching app](/mastering-paper/) I'm quite found of --- why not let them have at it with just their fingers?\n\nI sat in front of them holding the iPad firmly, while giving each a try at finger doodling. Chloe was first up and all about drawing with both hands. Sometimes it worked out well for her and sometimes not due to multi-touch limitations and triggering Rewind constantly.\n\n{% figure caption:\"Chloe's first Paper drawings (color selection by Dad).\" class:\"gallery-2-col\" %}\n[![Chloe's first Paper drawing](/assets/images/paper-53-chloe-draw-1-600.jpg)](/assets/images/paper-53-chloe-draw-1.jpg)\n[![Chloe's first Paper drawing](/assets/images/paper-53-chloe-draw-2-600.jpg)](/assets/images/paper-53-chloe-draw-2.jpg)\n{% endfigure %}\n\nEverly couldn't have been more different in her approach. Instead of swirling around the screen she banged on it with her hands, creating small lines and tick marks. If I can encourage her to ease up on hitting so hard we might have a future [stippling master]({% post_url /mastering-paper/2014-02-09-basics %}#stippling) on our hands.\n\n{% figure caption:\"Everly's first Paper drawing (color selection by Dad)\" %}\n[![Everly's first Paper drawing](/assets/images/paper-53-everly-draw-1-600.jpg)](/assets/images/paper-53-everly-draw-1.jpg)\n{% endfigure %}\n\nWe'll see how things progress as I let them play around with [Paper by 53](http://fiftythree.com/paper/) some more. The big benefit being I don't have to worry about them throwing crayons around since they seem to enjoy smearing their greasy fingers across the screen. I'm hoping Paper will help transition them into crayons once they figure out their fingers and hands have the ability to *create something*.\n\nWish me luck...\n"
  },
  {
    "path": "src/_posts/notes/2014-04-01-inspiring-faces.md",
    "content": "---\ntitle: \"Inspiring faces want to know\"\nexcerpt: \"Finding inspiration from the faces of strangers on Sktchy for iOS.\"\nimage: \n  path: &image /assets/images/sktchys-of-me-feature.jpg\n  width: 1280\n  height: 721\n  feature: *image\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [Sktchy, tech geek]\n---\n\nIt's been a lot of fun drawing the faces of strangers. But you know what's even better'? Having strangers draw you in return.\n\nIf you have an iOS device I encourage you to download the free [**Sktchy** app](https://get.sktchy.com/). You don't have to be an artist to use it --- in fact most using the app aren't. You just need to upload a selfie or two and hopefully inspire someone to create a work of art based on it.\n\nI've been known to peruse the *Inspiration* tab in look of faces to draw. So if you've been patiently waiting for me to draw you as part of my [PaperFaces Project]({% post_url /notes/2012-08-31-paperfaces-ipad-portrait-project %}), Sktchy might be a nice alternative.\n\n{% notice %}\n#### Beard selfies are a must\n\nGoofy homeless looking beards help get you noticed. Apparently Sktchy artists enjoy them because mine has managed to inspire a handful of drawings and sketches. Who knew?\n{% endnotice %}\n\n{% figure caption:\"\" class:\"gallery-2-col\" %}\n![Inspiration tab on Sktchy](/assets/images/sktchy-inspiration-screenshot.jpg)\n![Profile page on Sktchy](/assets/images/sktchy-profile-screenshot.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2014-08-24-paperfaces-giveaway.md",
    "content": "---\ntitle: \"Paperfaces digital drawing giveaway\"\nlast_modified_at: 2019-02-16T10:52:43-05:00\nexcerpt: \"Enter to win a portrait of your choice drawn by Michael Rose in his signature PaperFaces style.\"\ncategories: [notes]\ntags: [illustration, Paper for iOS]\nimage:\n  path: &image /assets/images/paperfaces-contest.jpg\n  width: 1280\n  height: 402\n  feature: *image\ntwitter:\n  card: summary_large_image\n---\n\nTo celebrate two years of [drawing portraits every day]({% post_url /notes/2012-08-31-paperfaces-ipad-portrait-project %}), I'm launching a fun giveaway leading up to the special day.\n\nOn August 31st I'll select **(3) winners** at random to draw digitally[^disclaimer] on my iPad, using portrait reference photographs of their choice. [Here's a refresher](/paperfaces/) of the type of drawing I will end up doing if you're new to my work.\n\n[^disclaimer]: Upon the drawing's completion the winners will receive PNG files measuring 2048&times;1536 pixels. This contest is for a digital drawing only, the winners *will not* receive a physical drawing.\n\nEntering the PaperFaces Giveaway is simple. **Contest has ended**: <s>Just fill out the Rafflecopter form below and follow the directions.</s> You can increase your odds of winner by completing some or all of the entry types[^entry-types]. Have fun and good luck!\n\n[^entry-types]: All entries will be verified for completion prior to randomly selecting winners. Following and then unfollowing will do you no good as those entries won't be counted in the giveaway.\n\n## Winning portraits\n\n{% figure caption:\"Winners of my first PaperFaces portrait giveaway.\" class:\"gallery-3-col\" %}\n[![color portrait winner](/assets/images/paperfaces-harvydanger-twitter-600.jpg)]({% post_url /paperfaces/2014-09-02-harvydanger-portrait %})\n[![black and white portrait winner](/assets/images/paperfaces-psychoticmilkma-2-600.jpg)]({% post_url /paperfaces/2014-09-06-psychoticmilkma-2-portrait %})\n[![black and white portrait winner](/assets/images/paperfaces-viktoriaderoy-600.jpg)]({% post_url /paperfaces/2014-09-10-viktoriaderoy-portrait %})\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2016-10-17-inktober-2016-failure.md",
    "content": "---\ntitle: \"Inktober failure\"\nexcerpt: \"Like previous years, I started out with the best of intentions for Inktober and then quickly lost steam...\"\nimage: \n  path: &image /assets/images/inktober-2016-wash-portrait.jpg\n  width: 1600\n  height: 1958\n  feature: *image\ngallery:\n  - url: /assets/images/inktober-2016-wash-portrait-process-1.jpg\n    image_path: /assets/images/inktober-2016-wash-portrait-process-1-600.jpg\n    alt: \"Ink wash portrait in process detail\"\n  - url: /assets/images/inktober-2016-wash-portrait-process-2.jpg\n    image_path: /assets/images/inktober-2016-wash-portrait-process-2-600.jpg\n    alt: \"Ink wash portrait in process detail\"\n  - url: /assets/images/inktober-2016-wash-portrait-process-3.jpg\n    image_path: /assets/images/inktober-2016-wash-portrait-process-3-600.jpg\n    alt: \"Ink wash portrait in process detail\"\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [watercolor, portrait, illustration, Inktober]\nlast_modified_at: 2019-02-15T14:08:07-05:00\n---\n\nSimilar to previous years, I started out with the best of intentions for [**Inktober**](http://mrjakeparker.com/inktober) and then quickly lose steam...\n\nAfter taking a few days to complete a single ink wash --- I was spent. Working digitally has spoiled me to the point that sitting at a desk instead of the sofa, cleaning brushes, and dealing with messes is just too much work to bother with.\n\nI did manage to record a time lapse video during hour 2 of the painting. Unfortunately I mistakenly put the iPhone 7 Plus in **SLO-MO** mode by mistake for the first half. Really surprised there was enough free space to record an hour of 1080p video...\n\n{% figure caption:\"1 hour time lapse condensed down into ~20 seconds.\" %}\n{% youtube gOBj8HdfA2Y %}\n{% endfigure %}\n\nOctober is half over and I suppose there's still time for me to knock out another portrait or two. If past years are any indication there's not a good chance of that happening. :neutral_face:\n\n{% figure caption:\"Inktober pieces from the past.\" class:\"gallery-3-col\" %}\n[![Inktober drawing from the past](/assets/images/inktober-past-1-600.jpg)](/assets/images/inktober-past-1.jpg)\n[![Inktober drawing from the past](/assets/images/inktober-past-2-600.jpg)](/assets/images/inktober-past-2.jpg)\n[![Inktober drawing from the past](/assets/images/inktober-past-3-600.jpg)](/assets/images/inktober-past-3.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2016-10-24-using-ssi.md",
    "content": "---\ntitle: \"Using SSI to detect cookies\"\nexcerpt: \"In my never ending quest to micro-optimize the hell out of my site, I ran into a snag when trying to use SSI directives to improve the loading of critical CSS and cached stylesheets.\"\ncategories: [notes]\ntags: [TIL, web development, Jekyll]\ncomments: true\nsupport: true\nlast_modified_at: 2016-10-24T10:29:13-04:00\n---\n\nIn my never ending quest to micro-optimize the hell out of my site, I ran into a snag when trying to use SSI directives.\n\n[Version 10.2](https://github.com/mmistakes/made-mistakes-jekyll/tree/10.3.0) of this site was my half-baked attempt at [eliminating render-blocking CSS]({% post_url /articles/2016-02-17-using-jekyll-2016 %}#critical-path-css) to speed up page loads. By manually inlining critical CSS via a [Jekyll include](http://jekyllrb.com/docs/templates/#includes) and using [**loadCSS**](https://github.com/filamentgroup/loadCSS) to asynchronously load the rest --- I did pretty good.\n\n{% figure caption:\"Analyzed with [Google's PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights/) tool.\" %}\n![Made Mistakes version 10 analyzed with PageSpeed Insights](/assets/images/mm-home-pagespeed-021116.jpg)\n{% endfigure %}\n\nThis workflow wasn't ideal for a variety of reasons:\n\n1. Manual process.\n2. Need to maintain separate \"critical\" stylesheets for inlining.\n3. Included a bunch of declarations that aren't critical to rendering \"above the fold\" content ---  causing some file size bloat.\n\nSo with the help of [**Critical**](https://github.com/addyosmani/critical) (and friends) I attempted to automated the process. Getting it working within the constraints of a Jekyll site with thousands of posts wasn't easy, but I got close with [a set of Gulp tasks](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/gulp/tasks). A tale for another day unfortunately...\n\nSorry a little off topic there, back to SSI directives.\n\nI learned that to speed up things for repeat visitors, loading a cached version of the CSS instead of waiting for **loadCSS** to do its thing was preferred. By using Filament Group's aptly named [**Enhance.js**](https://github.com/filamentgroup/enhance) project as a boilerplate, this could be achieved by dropping a cookie and using SSI directives.\n\nStructuring our HTML looks a little like like this:\n\n```html\n<!--#if expr=\"$HTTP_COOKIE=/fullcss\\=true/\" -->\n  <link rel=\"stylesheet\" href=\"assets/stylesheets/style.css\">\n<!--#else-->\n  <style>\n     /* critical path CSS styles go here... */\n  </style>\n<!--#endif-->\n  <noscript><link rel=\"stylesheet\" href=\"assets/stylesheets/style.css\"></noscript>\n```\n\nThe `#if` and `#else` conditionals are SSI directives used by Apache to do some neat things. In this context they determine if a cookie named `fullcss` has been set. If it has, cached CSS files will load using a standard `<link>` element. If it hasn't, the inline CSS will be rendered by the browser instead.\n\n*[SSI]: Server Side Includes\n\nFor first time visitors:\n\n1. Critical CSS inlined within the `<style>` element will load almost instantly.\n2. **loadCSS** script will asynchronously load the remaining page CSS as not to block rendering.\n3. A cookie will be set to trigger the loading of cached CSS on future page loads.\n\nAfter setting all this up and testing my pages against [**WebPagetest**](https://www.webpagetest.org/), [**PageSpeed Insights**](https://developers.google.com/speed/pagespeed/insights/), and [**GTmetrix**](https://gtmetrix.com/) I saw an obvious drop in scrores :confused:. Apparently the SSI directives weren't working as intended, causing `style.css` to render block each page load. Hmmmm...\n\n:bulb: Oh right, maybe it's Cloudflare's **Auto Minifying** setting mucking around! Sure enough, as soon I disabled their HTML minifier, lines like `<!--#if expr=\"$HTTP_COOKIE=/fullcss\\=true/\" -->` remained untouched. Unfortunately `style.css` was still render blocking the page.\n\n{% figure caption:\"Auto Minify removes unnecessary characters from your source code (like extraneous whitespace and comments).\" %}\n![screenshot of Cloudflare's Auto Minify settings](/assets/images/cloudflare-auto-minify.jpg)\n{% endfigure %}\n\nDug a little deeper and discovered you have to configure your server to [permit SSI](http://httpd.apache.org/docs/current/howto/ssi.html#configuring) before they'll be recognized. Oops! Dropped these two lines in my `.htaccess` file and everything magically worked.\n\n```\nOptions +Includes\nAddHandler server-parsed .shtml .html .htm\n```\n\n{% figure caption:\"So close to 100. If it wasn't for the Google Analytics and AdSense scripts...\" %}\n![Google PageSpeed Insights score screenshot](/assets/images/pagespeed-insights-99-100.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/notes/2016-10-25-css-blur-effect.md",
    "content": "---\ntitle: \"CSS blur effect\"\ncategories: [notes]\ntags: [TIL, web development]\nlast_modified_at: 2016-11-04T16:13:05-04:00\n---\n\nPlaying with the new **Depth Effect** (aka [*fauxkeh*](https://www.instagram.com/explore/tags/fauxkeh/)) on my iPhone 7 Plus got me thinking about Gaussian blurs, and how to improve their use on this site.\n\nIn this [last redesign](https://github.com/mmistakes/made-mistakes-jekyll/tree/11.0.0), I applied a blurred effect to images in a few key locations[^locations]. To keep page speed in check I shrunk images down to `~20px` wide, optimized them with [**imagemin**](https://github.com/imagemin/imagemin), and then scaled them up with `background-size: cover` to fill their parent containers.\n\nThe browser does the rest, enlarging and smoothing out these tiny images --- creating a blurred effect of sorts. For the most part they look good. On devices that display `@2x` or higher, blotchy patterns and artifacts begin to show their ugly faces.\n\n{% figure caption:\"These upscaled images sure do look awful on an iPad with retina display, :stuck_out_tongue_closed_eyes: yuck!\" %}\n[![ugly upscaled images on a high resolution display](/assets/images/mm-upscaled-image-blur-ipad-1124.jpg)](/assets/images/mm-upscaled-image-blur-ipad.jpg)\n{% endfigure %}\n\nThis is where [CSS filter functions](https://css-tricks.com/almanac/properties/f/filter/) like `blur` come into play. By adding a single line to my stylesheet I was able to smoothen out these images just enough to overcome the ugly.\n\n```diff\n.teaser__bg {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n+ filter: blur(15px);\n  background-repeat: no-repeat;\n  background-size: cover;\n}\n```\n\n{% figure caption:\"Smoothed things out nicely with `filter: blur()`.\" %}\n![blur filtered background images](/assets/images/mm-image-filter-blur-ipad-1124.jpg)\n{% endfigure %}\n\nThe best part, browser [support for CSS filter effects](http://caniuse.com/#search=filter) is quite good.\n\n[^locations]: **Cover images** with a striped pattern overlay. **Background images** in the post pagination links found at the bottom of each page.\n"
  },
  {
    "path": "src/_posts/notes/2016-10-27-oil-pastels.md",
    "content": "---\ntitle: \"Oil pastels are not pencils\"\nimage: \n  path: &image /assets/images/oil-pastel-sunset-finished.jpg\n  width: 1600\n  height: 1103\n  feature: *image\ntwitter:\n  card: summary_large_image\ngallery:\n  - url: /assets/images/oil-pastels-process-1.jpg\n    image_path: /assets/images/oil-pastels-process-1-600.jpg\n    alt: \"Preliminary sketch and taped off paper\"\n  - url: /assets/images/oil-pastels-process-2.jpg\n    image_path: /assets/images/oil-pastels-process-2-600.jpg\n    alt: \"Sketching out the sky\"\n  - url: /assets/images/oil-pastels-process-3.jpg\n    image_path: /assets/images/oil-pastels-process-3-600.jpg\n    alt: \"The finished piece before removing the mask\"\ncategories: [notes]\ntags: [TIL, illustration]\nlast_modified_at: 2019-02-15T15:55:53-05:00\n---\n\nNot to overstate the obvious here, but oil pastels do not behave like colored pencils.\n\nTheir size and shape should have been enough to clue me into that fact, but I proceeded to use them like a pencil anyways. Punished severely for this ignorance I was.\n\nMade a slight recovery when I began using the tool like I would with oil paint. *Globing on specks of color, and letting them mix with each other naturally.* They don't quite have the mixing quality of paint, but with a finger or blending stumps pigment can be pulled about.\n\nAttempting to create form with precise strokes is totally not the way to approach oil pastels.\n\n## Tools Used\n\n- [Pentel Arts Oil Pastels, 25 Count](https://www.amazon.com/Pentel-Arts-Pastels-Count-PHN-25/dp/B01HGYIAT0/ref=as_li_ss_tl?ie=UTF8&qid=1477597424&sr=8-6&keywords=pentel+oil+pastels&linkCode=ll1&tag=2rosebuds-20&linkId=51263f8c62514e85fd039ffcb86934e6)\n- [Jack Richeson Blending Stomp, 3/8\\\"](https://www.amazon.com/Jack-Richeson-Blending-Stomp-8-Inch/dp/B001BYRK1Q/ref=as_li_ss_tl?ie=UTF8&qid=1477597624&sr=8-6&keywords=blending+stumps&linkCode=ll1&tag=2rosebuds-20&linkId=aaaff9e80069ada137c46e2ced713eb5)\n"
  },
  {
    "path": "src/_posts/notes/2016-11-04-github-pages-publishing-source.md",
    "content": "---\ntitle: \"Configuring publishing sources for GitHub Pages\"\ncategories: [notes]\ntags: [TIL, web development, GitHub, Jekyll]\ncomments: true\nsupport: true\nlast_modified_at: 2019-02-15T15:56:02-05:00\n---\n\nYou know what sucks? Maintaining two separate branches of an open source project, just to host its source code and documentation together with GitHub Pages.\n\nFor example, my Jekyll theme's are setup on GitHub with the following branches:\n\n- `master` holds the theme files for cloning and installing\n- `gh-pages` is a dupe of master with example posts and theme documentation\n\nAnytime I push updates to `master` I switch to the `gh-pages` branch, cherry pick commits, and deal with any conflicts. Wouldn't it be nice if there was a better way to keep everything together in a single branch?\n\nWell there is. Under **Settings** there is a drop-down menu under **GitHub Pages/Source** that allows you to choose where to build from[^sources].\n\n[^sources]: You can [configure GitHub Pages](https://help.github.com/articles/configuring-a-publishing-source-for-github-pages/) to publish your site's source files from `master`, `gh-pages`, or a `/docs` folder on your `master` branch for Project Pages and other Pages sites that meet certain criteria.\n\n{% figure caption:\"GitHub Pages settings.\" %}\n![GitHub Pages Sources](/assets/images/github-pages-options.jpg)\n{% endfigure %}\n\nFlip the source to **master branch /docs folder**, move contents of `gh-pages` into **/docs** on `master`, and boom :tada:!\n\nSource code and documentation in a single branch. No more switching branches and \":cherries: cherry picking\" for me :thumbsup:.\n"
  },
  {
    "path": "src/_posts/notes/2016-11-08-kramdown-table-html.md",
    "content": "---\ntitle: \"HTML inside Kramdown table cells\"\nexcerpt: \"The question of how to write a list inside of a table cell with Kramdown recently came up on **Jekyll Talk** --- prompting me to look for a solution.\"\ncategories: [notes]\ntags: [TIL, web development, Jekyll]\ncomments: true\nsupport: true\nlast_modified_at: 2017-09-08T10:33:53-04:00\n---\n\nThe question of how to write a list inside of a table cell with [**Kramdown**](http://kramdown.gettalong.org/) recently came up in a thread on [Jekyll Talk](http://talk.jekyllrb.com/) --- prompting me to look for a solution.\n\nUnfortunately something like this doesn't work:\n\n```markdown\n| Fruit         | Price         | Advantages         |\n| ------------- | ------------- | ------------------ |\n| Bananas       | $1.34         | - built-in wrapper |\n|               |               | - bright color     |\n| ------------- | ------------- | ------------------ |\n| Oranges       | $2.10         | - cures scurvy     |\n|               |               | - tasty            |\n```\n\n**Kramdown** treats each new line as a row and doesn't render the bullet lists properly in the Banana and Oranges rows as can be seen below.\n\n| Fruit         | Price         | Advantages         |\n| ------------- | ------------- | ------------------ |\n| Bananas       | $1.34         | - built-in wrapper |\n|               |               | - bright color     |\n| ------------- | ------------- | ------------------ |\n| Oranges       | $2.10         | - cures scurvy     |\n|               |               | - tasty            |\n\nThrowing HTML at the problem doesn't quite work either.\n\n```markdown\n| Fruit         | Price         | Advantages         |\n| ------------- | ------------- | ------------------ |\n| Bananas       | $1.34         | <ul><li>built-in wrapper</li><li>bright color</li></ul> |\n| ------------- | ------------- | ------------------ |\n| Oranges       | $2.10         | <ul><li>cures scurvy</li><li>tasty</li></ul> |\n```\n\nInstead of rendering the HTML, it is escaped and outputted as a single line of text.\n\n| Fruit         | Price         | Advantages         |\n| ------------- | ------------- | ------------------ |\n| Bananas       | $1.34         | <ul><li>built-in wrapper</li><li>bright color</li></ul> |\n| ------------- | ------------- | ------------------ |\n| Oranges       | $2.10         | <ul><li>cures scurvy</li><li>tasty</li></ul> |\n\nWhat is needed is a way of telling **Kramdown** to leave the HTML alone and output as is. Thankfully there is such a way using the [`nomarkdown` extension](http://kramdown.gettalong.org/syntax.html#extensions).\n\nSimply wrap the HTML with `{% raw %}{::nomarkdown} ... {:/}{% endraw %}` like so:\n\n```markdown\n| Fruit         | Price         | Advantages         |\n| ------------- | ------------- | ------------------ |\n| Bananas       | $1.34         | {::nomarkdown}<ul><li>built-in wrapper</li><li>bright color</li></ul>{:/} |\n| ------------- | ------------- | ------------------ |\n| Oranges       | $2.10         | {::nomarkdown}<ul><li>cures scurvy</li><li>tasty</li></ul>{:/} |\n```\n\nAnd the table will output as expected[^cell-content].\n\n[^cell-content]: Be sure to keep all of your HTML on a single line for this to work properly.\n\n| Fruit         | Price         | Advantages         |\n| ------------- | ------------- | ------------------ |\n| Bananas       | $1.34         | {::nomarkdown}<ul><li>built-in wrapper</li><li>bright color</li></ul>{:/} |\n| ------------- | ------------- | ------------------ |\n| Oranges       | $2.10         | {::nomarkdown}<ul><li>cures scurvy</li><li>tasty</li></ul>{:/} |\n\nWhile not as readable as a pure Markdown solution, it gets the job done.\n\nFrom what I understand [**Pandoc**](http://pandoc.org/) and [**RedCarpet**](https://github.com/vmg/redcarpet) have better support for this sort of thing if you want to use their [flavor of Markdown](http://jekyllrb.com/docs/configuration/#markdown-options).\n\nSince Kramdown is the default renderer used by Jekyll I think I'll just suck it up and stick with this workaround for now :expressionless:.\n"
  },
  {
    "path": "src/_posts/notes/2017-01-30-static-files.md",
    "content": "---\ntitle: \"Accessing static files in Jekyll\"\ncategories: [notes]\ntags: [TIL, web development, Jekyll]\ntoc: true\ncomments: true\nsupport: true\nlast_modified_at: 2018-11-07T10:40:54-05:00\n---\n\nWhile investigating ways of using static files with Jekyll for a site prototype I was building, I learned that `site.static_files` was a thing. What is it and why you should care? Let me take a minute to share...\n\nAccording to the official [Jekyll documentation](https://jekyllrb.com/docs/static-files/), \"a static file is a file that does not contain any YAML front matter. These include images, PDFs, and other un-rendered content.\"\n\n**The useful bit** --- every one of these static files becomes accessible to Jekyll when looping through `site.static_files`. There aren't many reasons why you'd want to do this, but if building \"plugin-free\" image galleries is one of them --- here's how.\n\n## Organize static files\n\nLet's say you have a folder (named `gallery-1`) of images you want to display together on a post or page.\n\n```\n├── assets/\n│   └── images/\n│       └── gallery-1/\n│           ├── foo.jpg\n│           ├── bar.gif\n│           └── yaz.png\n```\n\n## Start a loop\n\nUsing [Liquid](https://shopify.github.io/liquid/)[^liquid] you'd start by looping through `site.static_files` and then narrow down the files based on their paths. In this case we only want to show those images that live together in `assets/images/gallery-1`.\n\n[^liquid]: Liquid is an open-source template language created by Shopify and written in Ruby.\n\n```liquid\n{% raw%}{% for image in site.static_files %}\n  {% if image.path contains 'assets/images/gallery-1' %}\n    <img src=\"{{ image.path }}\" alt=\"\">\n  {% endif %}\n{% endfor %}{% endraw %}\n```\n\nWhich will generate into the following HTML:\n\n```html\n<img src=\"assets/images/gallery-1/bar.gif\" alt=\"\">\n<img src=\"assets/images/gallery-1/foo.jpg\" alt=\"\">\n<img src=\"assets/images/gallery-1/yaz.png\" alt=\"\">\n```\n\n## Build an image gallery with Liquid\n\nWhat if you'd rather spit out a group of thumbnail[^thumbnail] images that link to a full-size version? Completely achievable using the above method --- if you are careful to name these files in a predictable way.\n\n[^thumbnail]: Thumbnails are reduced-size versions of pictures, used to help in recognizing and organizing them, serving the same role for images as a normal text index does for words. \n\nStart by creating thumbnail versions of each image however you'd like. The important part here is to be consistent with the naming of these files. For the sake of this example I'll be adding the suffix `-th` to each filename and storing them in the same location as the full-size assets.\n\n```\n├── assets/\n│   └── images/\n│       └── gallery-1/\n│           ├── foo.jpg\n│           ├── foo-th.jpg\n│           ├── bar.gif\n│           ├── bar-th.gif\n│           ├── yaz.png\n│           └── yaz-th.png\n```\n\nAssuming a thumbnail and full-size image share the same base name, we can construct the gallery's HTML with the following:\n\n```liquid\n{% raw %}{% for image in site.static_files %}\n  {% if image.path contains 'assets/images/gallery-1' %}\n    {% unless image.path contains '-th.' %}\n      <a href=\"{{ image.path }}\">\n        <img src=\"{{ image.basename | append: '-th' | append: image.extname }}\" alt=\"\">\n      </a>\n    {% endunless %}\n  {% endif %}\n{% endfor %}{% endraw %}\n```\n\nNow you may be wondering where `basename` and `extname` came from... simple. Each static file contains metadata accessible via Liquid with the following variables:\n\n| Variable             | Description |\n| --------             | ----------- |\n| `file.path`          | The relative path to the file, e.g. `/assets/img/image.jpg` |\n| `file.modified_time` | The time the file was last modified, e.g. `2016-04-01 16:35:26 +0200` |\n| `file.name`          | The string name of the file e.g. `image.jpg` for `image.jpg` |\n| `file.basename`      | The string basename of the file e.g. `image` for `image.jpg` |\n| `file.extname`       | The extension name for the file, e.g. `.jpg` for `image.jpg` |\n\n{% notice %}\n#### Note: filename consistency is paramount\n\nUsing this method to build a gallery of thumbnail images is fragile. The `image` objects inside of these loops are not validated by Jekyll at all. If you call in paths that don't exist it will silently fail and leave you with missing images on the page.\n{% endnotice %}\n\n## Feedback and improvements\n\nIn the end looping through `site.static_files` became an easy way spitting out a folder of files without having to hard code `<img>` elements.  Sure there are a million different ways to do this with Jekyll, but this served a need and was a quick hack.\n\nCurious if others are using **static files** in cool and interesting ways. Feel free to let me know in the comment section below if you are :smile:.\n"
  },
  {
    "path": "src/_posts/notes/2017-05-16-styling-language-specific-code-blocks.md",
    "content": "---\ntitle: \"Styling language specific code blocks with Jekyll\"\ncategories: [notes]\ntags: [TIL, web development, Jekyll]\ncomments: true\nsupport: true\nlast_modified_at: 2017-05-16T16:24:26-04:00\n---\n\nWhile inspecting the markup of some syntax highlighted code blocks I noticed something I hadn't before, `language-lexer` classes:\n\n```html\n<div class=\"language-css highlighter-rouge\">\n  <pre class=\"highlight\">\n    <code>.foo { color: red; }</code>\n  </pre>\n</div>\n```\n\nThis extra hook[^syntax-highlighting-lang] on the `<div>` element opens up some interesting styling possibilities. A fun use case for this is styling code blocks to look like terminal windows. Simply use `terminal`[^terminal-lexer] as the language/lexer like so:\n\n<div class=\"highlighter-rouge\">\n<pre class=\"highlight\"><code>```terminal\n\n```</code></pre>\n</div>\n\nAdd the following Sass to your site's stylesheet:\n\n```scss\n$terminal-window-height: 30px;\n\n.language-terminal {\n  position: relative;\n  margin-bottom: 1.5em;\n  padding: calc(#{$terminal-window-height} + 1em) 1em 1em;\n  border: 1px solid $border-color;\n  border-radius: $border-radius;\n  box-shadow: 0 0.25em 1em rgba($base-color, 0.25);\n  background-color: $base-color;\n\n  &::before {\n    content: \"\\2022 \\2022 \\2022\";\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: $terminal-window-height;\n    margin: 0;\n    padding: (0.5 * $terminal-window-height) 0;\n    background: mix($base-color, #fff, 25%);\n    color: mix($base-color, #fff, 50%);\n    font-size: (2 * $terminal-window-height);\n    line-height: 0;\n    text-indent: (0.5 * $terminal-window-height);\n  }\n\n  .highlight {\n    margin: 0;\n    padding: 0;\n    background-color: initial;\n    color: #fff;\n  }\n}\n```\n\nAnd you'll get something that looks like this:\n\n```terminal\n[15:34:01] Finished 'site' after 2.18 min\n[15:34:01] Starting 'copy:site'...\n[15:34:06] Finished 'copy:site' after 4.8 s\n[15:34:06] Finished 'build:site' after 2.33 min\n[15:34:06] Starting 'reload'...\n[BS] Reloading Browsers...\n[15:34:06] Finished 'reload' after 5.22 ms\n```\n\nThis isn't limited to `language-terminal`, and can be applied to any of the other [languages and lexers](https://github.com/jneen/rouge/wiki/List-of-supported-languages-and-lexers) supported by [**Rouge**](http://rouge.jneen.net/).\n\n[^syntax-highlighting-lang]: Apparently this was [added into **Kramdown**](https://github.com/gettalong/kramdown/issues/328) a year ago. :neutral_face: Who knew?\n\n[^terminal-lexer]: `terminal` and `console` are aliases for `shell_session` and can be used interchangeably when assigning a language for syntax highlighting.\n"
  },
  {
    "path": "src/_posts/notes/2018-11-12-autumn-refresh.md",
    "content": "---\ntitle: \"Autumn refresh\"\nexcerpt: \"Using CSS Grid Layout Module to redesign a Jekyll site and further improve performance and accessibility.\"\nlayout: post\nimage:\n  path: &image /assets/images/autumn-refresh-feature.jpg\n  width: 1920\n  height: 1059\n  feature: *image\n  caption: \"[Photo by **Aaron Burden** on Unsplash](https://unsplash.com/photos/Ndc6FS9v_hw?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)\"\ntwitter:\n  card: summary_large_image\ncategories: [notes]\ntags: [Jekyll, Gatsby, web development, Netlify]\ncomments: true\nsupport: true\ntoc: true\nlast_modified_at: 2018-11-12T19:56:57-05:00\n---\n\nLately I've been toying with the idea of migrating from [**Jekyll**](https://jekyllrb.com/) to [**GatsbyJS**](https://www.gatsbyjs.org/) (more on that in a future post). Initial tests look promising, but there are [some issues](https://github.com/mmistakes/gatsby-test/issues/1) I'm still working through.\n\nIn the meantime I've taken new visual cues I originally built as [React components](https://reactjs.org/docs/react-component.html) in two experimental Gatsby site repos: [gatsby-wordpress-cms](https://github.com/mmistakes/gatsby-wordpress-cms) and [gatsby-test](https://github.com/mmistakes/gatsby-test), and adapted them here as standard HTML/CSS.\n\n## Design changes\n\nIn [Made Mistakes v12](https://github.com/mmistakes/made-mistakes-jekyll/releases/tag/12.0.0) text and image where large and readible, but didn't exactly fill the canvas elegantly. I wanted to change that with this design refresh.\n\n<figure>\n  <p class=\"browser-frame\">\n    <img src=\"/assets/images/mm-desktop-design-old.jpg\" alt=\"Made Mistakes design before the refresh\">\n  </p>\n  <figcaption>Site design before the refresh.</figcaption>\n</figure>\n\nSince majority of the visitors to my site use modern browsers, I had a good excuse to play with `display: grid`. I've removed the [**Susy** mixins](http://oddbird.net/susy/) and most of the `float` based columns, which cut the amount of CSS I had to write considerably.\n\n<figure>\n  <p class=\"browser-frame\">\n    <img src=\"/assets/images/mm-desktop-design-new.jpg\" alt=\"Made Mistakes design after the refresh\">\n  </p>\n  <figcaption>Site design after the refresh.</figcaption>\n</figure>\n\nTo my eye this new layout breaks up the page better. Content comes into view earlier on the page, and there's plenty of room for ancillary information on the right. With a little `position: sticky` sprinkled on the `aside` column, internal skip links stay fixed in view --- when space allows.\n\n{% notice %}\n#### ProTip: Use the Firefox DevTools when working with CSS grid layouts\n\n![Firefox Grid Inspector screenshot](/assets/images/firefox-grid-inspector-screenshot.jpg)\n{: .browser-frame}\n\nOut of all the major browsers, Firefox's [**Grid Inspector**](https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts) is argubly the best for examining, modifying, or debugging grid layouts.\n{% endnotice %}\n\n## Accessibility improvements\n\nThis refresh prompted me to test how accessible the site is and fix any glaring issues.\n\n### Buttons have an accessible name\n\n> When a button doesn't have an accessible name, screen readers announce it as \"button\", making it unusable for users who rely on screen readers.\n\nDigging in, I discovered [**bigfoot.js**](http://bigfootjs.com/)[^bigfoot] didn't name `<button>` elements that it created. Thankfully the button markup is configurable so I was able replace a set of presentational-only `<svg>` elements with unique names instead.\n\n[^bigfoot]: A jQuery plugin used to make footnotes less visually distracting.\n\n```javascript\n{% raw %}var bigfoot = $.bigfoot({\n  actionOriginalFN: 'delete',\n  buttonMarkup: (\n    '<div class=\"bigfoot-footnote__container\">' +\n    ' <button href=\"#\" class=\"bigfoot-footnote__button\" rel=\"footnote\"' +\n    ' id=\"{{SUP:data-footnote-backlink-ref}}\"' +\n    ' data-footnote-number=\"{{FOOTNOTENUM}}\"' +\n    ' data-footnote-identifier=\"{{FOOTNOTEID}}\"' +\n    ' alt=\"See Footnote {{FOOTNOTENUM}}\"' +\n    ' data-bigfoot-footnote=\"{{FOOTNOTECONTENT}}\">' +\n    ' <span class=\"visually-hidden\">{{FOOTNOTENUM}}</span>' +\n    ' </button>' +\n    '</div>'\n  )\n});{% endraw %}\n```\n\n### Color contrast is satisfactory\n\nThe color of elements like captions and footer text were too light, so I darkened them. I did the same for links by giving them a contrast ratio of `4.77`.\n\n{% figure caption:\"The Color Picker in Chrome's DevTools will show you the contrast ratio of text elements to help make your site more accessible to users with low-vision impairments or color-vision deficiencies.\" %}\n![link color contrast ratio screenshot](/assets/images/mm-link-color-contrast-raio.png)\n{% endfigure %}\n\n## Performance improvements\n\nOptimizations with the biggest impact (minifying, concatenating, inlining critical CSS) I was already doing, but there was still room for improvement.\n\n### Defer offscreen images\n\n> Consider lazy-loading offscreen and hidden images after all critical resources have finished loading to lower time to interactive.\n\nLarge feature images were already lazy-loaded and served responsively using `srcset` and a handful of sized images. Images found in the body `{% raw %}{{ content }}{% endraw %}` of my Markdown files were not.\n\nTaking a cue from [**gatsby-remark-images'**](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-remark-images) playbook, I wrote a small plugin to convert Markdown image syntax into an `<img>` element with synatactically sugar for lazy-loading. To my surprise this actually worked.\n\n```ruby\n# Description: Jekyll plugin to replace Markdown image syntax with lazy-load HTML markup\n\nJekyll::Hooks.register :posts, :pre_render do |post, payload|\n  docExt = post.extname.tr('.', '')\n  # only process Markdown files\n  if payload['site']['markdown_ext'].include? docExt\n    newContent = post.content.gsub(/(?:!\\[(.*?)\\]\\((.*?)\\))/, '<noscript><img src=\"\\2\"></noscript><img src=\"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-src=\"\\2\" alt=\"\\1\" class=\"lazyload fade-in\">')\n    post.content = newContent\n  end\nend\n```\n\n### Avoids an excessive DOM size\n\n> Browser engineers recommend pages contain fewer than ~1,500 DOM nodes. The sweet spot is a tree depth < 32 elements and fewer than 60 children/parent element. A large DOM can increase memory usage, cause longer style calculations, and produce costly layout reflows.\n\nTrimming `<div>` fat where I could helped cut page weight down. Some hefty pages remain (I'm looking at your [PaperFaces gallery]({{ '/paperfaces/' | relative_url }})), but most fall under the 1,500 DOM node threshold. In the future I hope to fix this issue with a [gallery pagination component](https://awesome-lewin-0d1356.netlify.com/grid-example/) when switching to Gatsby.\n\n## Lighthouse audits comparison\n\n{% figure caption:\"**Lighthouse** audit before optimizations.\" %}\n![Made Mistakes audit results before optimizations](/assets/images/mm-lighthouse-audit-before.png)\n{% endfigure %}\n\n{% figure caption:\"**Lighthouse** audit after optimizations.\" %}\n![Made Mistakes audit results after optimizations](/assets/images/mm-lighthouse-audit-after.png)\n{% endfigure %}\n\nNot sure why metrics like *Speed Index* increased. But *Time to Interactive*, *First Meaningful Paint*, and *First CPI Idle* all show improvements, so I guess that's why the site went from a 79 in performance, to an 89. :man_shrugging:\n\n## Build and deploy\n\nAnd if all of this wasn't enough, I also made the switch away from [**Travis CI**](https://travis-ci.org/), to [**Netlify**](https://www.netlify.com/). Instead of a 48 line `.travis.yml` file I now have a three line `netlify.toml`.\n\nThe Netlify builds are about 2-4 minutes faster than those with Travis CI. And look to be even quicker if I leverage undocumented [Netlify cache folders](https://www.contentful.com/blog/2018/05/17/faster-static-site-builds-part-one-process-only-what-you-need/#caching-for-the-win) that persists between builds. Using these to store the thousands of images I pipe through resizing tasks could shave another 6-8 minutes off my build.\n"
  },
  {
    "path": "src/_posts/notes/2019-02-26-faster-netlify-builds.md",
    "content": "---\ntitle: \"Faster Netlify builds\"\nexcerpt:\ncategories: [notes]\ntags: [TIL, Netlify, Jekyll, web development]\nimage:\n  twitter: &image \"/assets/images/netlify-deploy-log.png\"\n  facebook: *image\ntwitter:\n  card: summary_large_image\ncomments: true\nlast_modified_at: 2019-02-26T21:06:25-05:00\n---\n\nSlowly but surely, I've been chipping away at my site's [build time on **Netlify**]({% post_url /notes/2018-11-12-autumn-refresh %}#build-and-deploy).\n\nThere's little left for me to optimize until Jekyll drops some nice updates in [version 4.0](https://github.com/jekyll/jekyll/projects/2). I've [cached the rendering of Liquid includes](https://github.com/mmistakes/made-mistakes-jekyll/issues/629) across `_layouts` via the [`{% raw %}{% include_cached %}{% endraw %}`](https://github.com/benbalter/jekyll-include-cache) tag, limited use of `{% raw %}{% for %}{% endraw %}` loops over large collections like `{% raw %}{% site.posts %}{% endraw %}`, and [stripped Jekyll's duties down]({% post_url /articles/2017-08-30-using-jekyll-2017 %}#optimization) to solely a HTML generator.\n\nThe \"little\" that remains, is about [a gigabyte of images](https://github.com/mmistakes/made-mistakes-images) I pipe through **Gulp**. Thousands of high resolution images are processed by [**Sharp**](https://github.com/lovell/sharp) into various sizes. I've been able to knock this down from 18 minutes, to six on a fresh build...\n\n![Screenshot of Netlify's deploy log for Made Mistakes](/assets/images/netlify-deploy-log.png)\n{: .browser-frame}\n\nWhen building the site locally I store the image artifacts in a temporary folder, and generate new ones only if the source changes. When Netlify builds the site it processes these images each and every build --- regardless if they have changed or not.\n\nBy stashing the processed images in a *secret* Netlify cache folder[^cache-folder] and using [Gulp to move files](https://github.com/mmistakes/made-mistakes-jekyll/tree/master/gulp) around, I cut the build time in half. Which is fantastic since I'm now averaging 5--8 minutes for dependencies to install, Jekyll to run, and Netlify to deploy the site.\n\n[^cache-folder]: Netlify has an undocumented `/opt/build/cache/` folder that is cached and persists between builds. :tophat: [Faster static site builds Part 1](https://www.contentful.com/blog/2018/05/17/faster-static-site-builds-part-one-process-only-what-you-need/#caching-for-the-win)\n\n**Excerpt from my Gulp build task**\n\n```javascript\n// 'gulp copy:images:cached' -- copies cached images from Netlify's `/opt/build/cache/` folder to `/dist/`\n\ngulp.task(\"copy:images:cached\", () => {\n  return gulp\n    .src(paths.imageFilesCachePath + \"/**/*\")\n    .pipe(newer(paths.imageFilesSite))\n    .pipe(gulp.dest(paths.imageFilesSite));\n});\n```\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-01-veganwendy-portrait.md",
    "content": "---\ntitle: \"The First PaperFaces Portrait\"\nexcerpt: \"PaperFaces portrait of my wife that jump started the project. Drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2014-08-28T14:08:21-04:00\nimage: \n  path: &image /assets/images/paperfaces-veganwendy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-veganwendy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, tattoo]\n---\n\nPaperFaces portrait of @veganwendy(https://twitter.com/veganwendy). Don't cover your face. Let the birds flow from your tattoos.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-02-mmistakes-portrait.md",
    "content": "---\ntitle: \"Hey scruffy beard, double exposure self portrait\"\nexcerpt: \"PaperFaces portrait of @mmistakes drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mmistakes-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mmistakes-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, self portrait, Paper for iOS, beard, black and white]\n---\n\nPaperFaces portrait of [@mmistakes](https://twitter.com/mmistakes).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-03-endonend-portrait.md",
    "content": "---\ntitle: \"Red backdrop and beard\"\nexcerpt: \"PaperFaces portrait of @endonend drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-endonend-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-endonend-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@endonend](http://instagram.com/endonend).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-anniejz-portrait.md",
    "content": "---\ntitle: \"Mona Lisa caricature\"\nexcerpt: \"PaperFaces portrait of @anniejz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-anniejz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-anniejz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@anniejz](https://twitter.com/anniejz).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-arialem-portrait.md",
    "content": "---\ntitle: \"Red hair and full of smiles\"\nexcerpt: \"PaperFaces portrait of @arialem drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-arialem-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-arialem-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@arialem](http://instagram.com/arialem).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-ashtonjames-portrait.md",
    "content": "---\ntitle: \"Sketchy strokes, short dark haired fella\"\nexcerpt: \"PaperFaces portrait of @ashtonjames drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ashtonjames-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ashtonjames-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@ashtonjames](https://twitter.com/ashtonjames).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-cellobiafra-portrait.md",
    "content": "---\ntitle: \"Lifting up a white dress in a purple room\"\nexcerpt: \"PaperFaces portrait of @cellobiafra drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cellobiafra-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cellobiafra-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cellobiafra](https://twitter.com/cellobiafra).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-endonend-2-portrait.md",
    "content": "---\ntitle: \"Sepia toned beard\"\nexcerpt: \"PaperFaces portrait of @endonend drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-endonend-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-endonend-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@endonend](https://twitter.com/endonend).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-ohhoe-portrait.md",
    "content": "---\ntitle: \"Long hair and forearm tattoos\"\nexcerpt: \"PaperFaces portrait of @ohhoe drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ohhoe-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ohhoe-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, tattoo]\n---\n\nPaperFaces portrait of [@ohhoe](https://twitter.com/ohhoe).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-pop-ultra-portrait.md",
    "content": "---\ntitle: \"Lens flared friend\"\nexcerpt: \"PaperFaces portrait of @Pop_Ultra drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pop-ultra-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pop-ultra-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Pop_Ultra](https://twitter.com/Pop_Ultra). In the right light she almost looks like Chewbacca --- but not really.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-04-ssgetchel-portrait.md",
    "content": "---\ntitle: \"Sunglasses at the beach\"\nexcerpt: \"PaperFaces portrait of @ssgetchel drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ssgetchel-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ssgetchel-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ssgetchel](http://instagram.com/ssgetchel).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-05-rraacchheeaall-portrait.md",
    "content": "---\ntitle: \"Long hair and geometric patterns\"\nexcerpt: \"PaperFaces portrait of @rraacchheeaall drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rraacchheeaall-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rraacchheeaall-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rraacchheeaall](http://instagram.com/rraacchheeaall).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-05-ryandwillis-portrait.md",
    "content": "---\ntitle: \"Dressed up in the car\"\nexcerpt: \"PaperFaces portrait of @ryandwillis drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ryandwillis-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ryandwillis-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ryandwillis](https://twitter.com/ryandwillis).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-05-sheng-ching-portrait.md",
    "content": "---\ntitle: \"Taking selfies\"\nexcerpt: \"PaperFaces portrait of @sheng_ching drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sheng-ching-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sheng-ching-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sheng_ching](https://twitter.com/sheng_ching).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-06-joaosevilhano-portrait.md",
    "content": "---\ntitle: \"Low contrast at the beach\"\nexcerpt: \"PaperFaces portrait of @joaosevilhano drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joaosevilhano-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joaosevilhano-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@joaosevilhano](https://twitter.com/joaosevilhano).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-06-kennwhite-portrait.md",
    "content": "---\ntitle: \"Bright and muted colors\"\nexcerpt: \"PaperFaces portrait of @kennwhite drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kennwhite-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kennwhite-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@kennwhite](https://twitter.com/kennwhite).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-06-sippey-portrait.md",
    "content": "---\ntitle: \"Purple shirted sir\"\nexcerpt: \"PaperFaces portrait of @sippey drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sippey-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sippey-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sippey](https://twitter.com/sippey).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-06-zainjoyce-portrait.md",
    "content": "---\ntitle: \"Black and white iPhone selfie\"\nexcerpt: \"PaperFaces portrait of @zainjoyce drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-zainjoyce-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-zainjoyce-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@zainjoyce](https://twitter.com/zainjoyce).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-allegedlymark-portrait.md",
    "content": "---\ntitle: \"Cropped face\"\nexcerpt: \"PaperFaces portrait of @allegedlymark drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-allegedlymark-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-allegedlymark-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@allegedlymark](https://twitter.com/allegedlymark).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-dev-jac-portrait.md",
    "content": "---\ntitle: \"Pilot headset\"\nexcerpt: \"PaperFaces portrait of @dev_jac drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dev-jac-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dev-jac-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@dev_jac](https://twitter.com/dev_jac).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-errade-portrait.md",
    "content": "---\ntitle: \"A dude and his dog\"\nexcerpt: \"PaperFaces portrait of @errade drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-errade-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-errade-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@errade](https://twitter.com/errade).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-lsinger-portrait.md",
    "content": "---\ntitle: \"Black and white sir in dark shirt\"\nexcerpt: \"PaperFaces portrait of @lsinger drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lsinger-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lsinger-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of project donator [@lsinger](https://twitter.com/lsinger).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-mitchellnicola-portrait.md",
    "content": "---\ntitle: \"Fancy is a purple dress\"\nexcerpt: \"PaperFaces portrait of @mitchellnicola drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mitchellnicola-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mitchellnicola-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mitchellnicola](https://twitter.com/mitchellnicola).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-paulmwatson-portrait.md",
    "content": "---\ntitle: \"Sitting in gray\"\nexcerpt: \"PaperFaces portrait of @paulmwatson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-paulmwatson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-paulmwatson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@paulmwatson](https://twitter.com/paulmwatson). His young daughter photographed the reference image --- can you believe that?\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-rattazong-portrait.md",
    "content": "---\ntitle: \"Nintendo is mind control\"\nexcerpt: \"PaperFaces portrait of @rattazong drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rattazong-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rattazong-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@rattazong](https://twitter.com/rattazong).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-robinbailey-portrait.md",
    "content": "---\ntitle: \"Black and white with the city making lights\"\nexcerpt: \"PaperFaces portrait of @RobinBailey drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-robinbailey-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-robinbailey-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of project donator [@RobinBailey](https://twitter.com/RobinBailey).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-stephenrevesz-portrait.md",
    "content": "---\ntitle: \"FIU banners away\"\nexcerpt: \"PaperFaces portrait of @stephenrevesz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-stephenrevesz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-stephenrevesz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@stephenrevesz](https://twitter.com/stephenrevesz).\n\nPS. Thanks for the Dribbble invite dude!\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-thebrady-portrait.md",
    "content": "---\ntitle: \"Wearing a hoodie and 3D glasses\"\nexcerpt: \"PaperFaces portrait of @theBrady drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thebrady-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thebrady-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@theBrady](https://twitter.com/theBrady).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-10-theskull-com-portrait.md",
    "content": "---\ntitle: \"Dark hat and flannel coat\"\nexcerpt: \"PaperFaces portrait of theskull-com drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-theskull-com-tumblr.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-theskull-com-tumblr-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of theskull-com.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-13-ashleymnunn-portrait.md",
    "content": "---\ntitle: \"Girl with blonde hair smiling outside\"\nexcerpt: \"PaperFaces portrait of @ashleymnunn drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ashleymnunn-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ashleymnunn-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ashleymnunn](https://twitter.com/ashleymnunn).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-13-frivmo-portrait.md",
    "content": "---\ntitle: \"Black and white in a long overcoat\"\nexcerpt: \"PaperFaces portrait of @frivmo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-frivmo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-frivmo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@frivmo](https://twitter.com/frivmo).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-13-kevinwoodland-portrait.md",
    "content": "---\ntitle: \"Dramatic plaid angle\"\nexcerpt: \"PaperFaces portrait of @kevinwoodland drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kevinwoodland-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kevinwoodland-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@kevinwoodland](https://twitter.com/kevinwoodland).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-13-khollybell-portrait.md",
    "content": "---\ntitle: \"Hiding behind a decorative fan\"\nexcerpt: \"PaperFaces portrait of @khollybell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-khollybell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-khollybell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@khollybell](https://twitter.com/khollybell).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-13-robinbailey-2-portrait.md",
    "content": "---\ntitle: \"Water and skyline\"\nexcerpt: \"PaperFaces portrait of @RobinBailey drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-robinbailey-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-robinbailey-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@RobinBailey](https://twitter.com/RobinBailey).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-13-tedwinder-portrait.md",
    "content": "---\ntitle: \"In blue, in glasses, sitting by some photographs\"\nexcerpt: \"PaperFaces portrait of @tedwinder drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tedwinder-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tedwinder-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@tedwinder](https://twitter.com/tedwinder).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-17-bradleyjp-portrait.md",
    "content": "---\ntitle: \"Beard and black v-neck shirt\"\nexcerpt: \"PaperFaces portrait of @bradleyjp drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bradleyjp-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bradleyjp-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@bradleyjp](https://twitter.com/bradleyjp).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-17-catdrawingguy-portrait.md",
    "content": "---\ntitle: \"Remember when he was on Shark Tank?\"\nexcerpt: \"PaperFaces portrait of @CatDrawingGuy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-CatDrawingGuy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-CatDrawingGuy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@CatDrawingGuy](https://twitter.com/CatDrawingGuy).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-17-kristysf-portrait.md",
    "content": "---\ntitle: \"Fiery blond hair curling about\"\nexcerpt: \"PaperFaces portrait of @kristysf drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kristysf-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kristysf-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@kristysf](https://twitter.com/kristysf).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-17-markgurman-portrait.md",
    "content": "---\ntitle: \"Wearing a backpack\"\nexcerpt: \"PaperFaces portrait of @markgurman drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-markgurman-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-markgurman-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@markgurman](https://twitter.com/markgurman).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-17-natalyokay-portrait.md",
    "content": "---\ntitle: \"Girl balancing on a log in the forest\"\nexcerpt: \"PaperFaces portrait of @natalyokay drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-natalyokay-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-natalyokay-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@natalyokay](https://twitter.com/natalyokay).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-17-tonjac-portrait.md",
    "content": "---\ntitle: \"Long blonde hairs in front of a brick wall\"\nexcerpt: \"PaperFaces portrait of @TonjaC drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-TonjaC-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-TonjaC-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@TonjaC](https://twitter.com/TonjaC).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-17-uwenna-portrait.md",
    "content": "---\ntitle: \"Dark hair and eye glasses\"\nexcerpt: \"PaperFaces portrait of @uwenna drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-uwenna-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-uwenna-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@uwenna](https://twitter.com/uwenna).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-18-eggsteff-portrait.md",
    "content": "---\ntitle: \"Big sunglasses on the beach\"\nexcerpt: \"PaperFaces portrait of @eggsteff drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-eggsteff-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-eggsteff-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@eggsteff](https://twitter.com/eggsteff).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-18-jakesutton-portrait.md",
    "content": "---\ntitle: \"White car and sunglasses\"\nexcerpt: \"PaperFaces portrait of @jakesutton drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jakesutton-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jakesutton-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@jakesutton](https://twitter.com/jakesutton).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-18-mjchamplin-portrait.md",
    "content": "---\ntitle: \"Camera and spooky lighting\"\nexcerpt: \"PaperFaces portrait of @mjchamplin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mjchamplin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mjchamplin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mjchamplin](https://twitter.com/mjchamplin).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-18-zinfiend-portrait.md",
    "content": "---\ntitle: \"Wine and cheese\"\nexcerpt: \"PaperFaces portrait of @zinfiend drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-zinfiend-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-zinfiend-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@zinfiend](https://twitter.com/zinfiend).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-20-clamteeth-portrait.md",
    "content": "---\ntitle: \"Cookie monster on the shirt\"\nexcerpt: \"PaperFaces portrait of @clamteeth drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-clamteeth-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-clamteeth-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@clamteeth](https://twitter.com/clamteeth).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-20-karahesse-portrait.md",
    "content": "---\ntitle: \"Smiling with a hat\"\nexcerpt: \"PaperFaces portrait of @karahesse drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-karahesse-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-karahesse-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@karahesse](https://twitter.com/karahesse).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-20-mike-ftw-portrait.md",
    "content": "---\ntitle: \"Oink oink, blue pig mask\"\nexcerpt: \"PaperFaces portrait of @mike_FTW drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mike-ftw-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mike-ftw-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mike_FTW](https://twitter.com/mike_FTW).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-21-hotdogwithsauce-portrait.md",
    "content": "---\ntitle: \"Light blue hoodies\"\nexcerpt: \"PaperFaces portrait of @hotdogwithsauce drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hotdogwithsauce-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hotdogwithsauce-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@hotdogwithsauce](https://twitter.com/hotdogwithsauce).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-21-jossvalo-portrait.md",
    "content": "---\ntitle: \"Dramatic lighting and a white hoodie\"\nexcerpt: \"PaperFaces portrait of @jossvalo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jossvalo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jossvalo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@jossvalo](https://twitter.com/jossvalo).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-24-cynthia-portrait.md",
    "content": "---\ntitle: \"Sunglasses near some toxic looking water yo!\"\nexcerpt: \"PaperFaces portrait of @cynthia drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cynthia-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cynthia-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cynthia](https://twitter.com/cynthia).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-24-danimal-portrait.md",
    "content": "---\ntitle: \"Goatee\"\nexcerpt: \"PaperFaces portrait of @danimal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-danimal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-danimal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@danimal](https://twitter.com/danimal).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-24-ochaukin-portrait.md",
    "content": "---\ntitle: \"Scuba diving gear\"\nexcerpt: \"PaperFaces portrait of O. Chaukin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ochaukin.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ochaukin-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of project donator O. Chaukin.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-24-therealamylou-portrait.md",
    "content": "---\ntitle: \"Mother and little one\"\nexcerpt: \"PaperFaces portrait of @therealamylou drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-therealamylou-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-therealamylou-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@therealamylou](https://twitter.com/therealamylou).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-24-timespace-portrait.md",
    "content": "---\ntitle: \"Hoodies and beards, a perfect combination\"\nexcerpt: \"PaperFaces portrait of @timespace drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-timespace-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-timespace-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@timespace](https://twitter.com/timespace).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-25-bengiroux-portrait.md",
    "content": "---\ntitle: \"Blue backgrounds\"\nexcerpt: \"PaperFaces portrait of @bengiroux drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bengiroux-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bengiroux-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@bengiroux](https://twitter.com/bengiroux).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-25-bulletproofjen-portrait.md",
    "content": "---\ntitle: \"Striped swimsuit on the beach\"\nexcerpt: \"PaperFaces portrait of @bulletproofjenn drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bulletproofjenn-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bulletproofjenn-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@bulletproofjenn](https://twitter.com/bulletproofjenn).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-25-marissa-portrait.md",
    "content": "---\ntitle: \"Dark hair\"\nexcerpt: \"PaperFaces portrait of @marissa drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-marissa-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-marissa-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@marissa](https://twitter.com/marissa).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-27-4lala-portrait.md",
    "content": "---\ntitle: \"Purple lollipop and sunglasses gal\"\nexcerpt: \"PaperFaces portrait of @4lala drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-4lala-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-4lala-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@4lala](https://twitter.com/4lala).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube xvpF730pDQk %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-27-dhm-portrait.md",
    "content": "---\ntitle: \"Beard and pink hat\"\nexcerpt: \"PaperFaces portrait of @dhm drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dhm-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dhm-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@dhm](https://twitter.com/dhm).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube 8znOwv0XxcI %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-09-27-kessler-portrait.md",
    "content": "---\ntitle: \"Happy beard in plaid\"\nexcerpt: \"PaperFaces portrait of @kessler drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kessler-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kessler-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@kessler](https://twitter.com/kessler).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube g6r-pZY3Awc %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-01-arbitral-portrait.md",
    "content": "---\ntitle: \"Black and white closeup of an eye\"\nexcerpt: \"PaperFaces portrait of @arbitral drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-arbitral-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-arbitral-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@arbitral](https://twitter.com/arbitral).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube 1VpNH3EQUg8 %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-01-eliglazier-portrait.md",
    "content": "---\ntitle: \"On a boat!\"\nexcerpt: \"PaperFaces portrait of @eliglazier drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-eliglazier-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-eliglazier-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@eliglazier](https://twitter.com/eliglazier).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube gV_jopoAsak %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-01-flexbrowne-portrait.md",
    "content": "---\ntitle: \"Smiling in a dark room, does anyone see you?\"\nexcerpt: \"PaperFaces portrait of @flexbrowne drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-flexbrowne-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-flexbrowne-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@flexbrowne](https://twitter.com/flexbrowne).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-01-guylschmidt-portrait.md",
    "content": "---\ntitle: \"Bearded fella in a car\"\nexcerpt: \"PaperFaces portrait of @guylschmidt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-guylschmidt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-guylschmidt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@guylschmidt](https://twitter.com/guylschmidt).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-01-joshuaskaroff-portrait.md",
    "content": "---\ntitle: \"Stretched ears and brick walls\"\nexcerpt: \"PaperFaces portrait of @joshuaskaroff drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joshuaskaroff-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joshuaskaroff-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, time lapse]\n---\n\nPaperFaces portrait of [@joshuaskaroff](https://twitter.com/joshuaskaroff).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube NEOjUwRFtbQ %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-01-marianeville-84-portrait.md",
    "content": "---\ntitle: \"Bokeh of light colors\"\nexcerpt: \"PaperFaces portrait of @marianeville_84 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-marianeville-84-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-marianeville-84-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@marianeville_84](https://twitter.com/marianeville_84).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-04-bi11jon-portrait.md",
    "content": "---\ntitle: \"Orange hat\"\nexcerpt: \"PaperFaces portrait of @bi11jon drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bi11jon-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bi11jon-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@bi11jon](https://twitter.com/bi11jon).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube dRIxg-RYJ9g %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-04-brohatch-portrait.md",
    "content": "---\ntitle: \"Red hair, green sunglases, not quite Christmas\"\nexcerpt: \"PaperFaces portrait of @brohatch drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-brohatch-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-brohatch-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@brohatch](https://twitter.com/brohatch).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube Csxhdfrtbuo %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-04-cranekicker-portrait.md",
    "content": "---\ntitle: \"Sweep the leg Johnny\"\nexcerpt: \"PaperFaces portrait of @cranekicker drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cranekicker-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cranekicker-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cranekicker](https://twitter.com/cranekicker).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-08-dereklakin-portrait.md",
    "content": "---\ntitle: \"Resting glasses\"\nexcerpt: \"PaperFaces portrait of @dereklakin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dereklakin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dereklakin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@dereklakin](https://twitter.com/dereklakin).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-08-lightnessalways-portrait.md",
    "content": "---\ntitle: \"Vamped out in costume\"\nexcerpt: \"PaperFaces portrait of @lightnessalways drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lightnessalways-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lightnessalways-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@lightnessalways](https://twitter.com/lightnessalways).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-08-matt-mullin-portrait.md",
    "content": "---\ntitle: \"Free Boosie\"\nexcerpt: \"PaperFaces portrait of @matt-mullin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-matt-mullin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-matt-mullin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@matt-mullin](https://twitter.com/matt-mullin).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-08-niall-obrien-portrait.md",
    "content": "---\ntitle: \"Baby in light blue\"\nexcerpt: \"PaperFaces portrait of @niall-obrien drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-niall-obrien-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-niall-obrien-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@niall-obrien](https://twitter.com/niall-obrien).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-10-editorialism-portrait.md",
    "content": "---\ntitle: \"Red lips and shirt\"\nexcerpt: \"PaperFaces portrait of @editorialism drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-editorialism-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-editorialism-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@editorialism](https://twitter.com/editorialism).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-10-fostermatt-portrait.md",
    "content": "---\ntitle: \"LA cap on the beach\"\nexcerpt: \"PaperFaces portrait of @fostermatt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fostermatt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fostermatt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@fostermatt](https://twitter.com/fostermatt).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-10-karensd-portrait.md",
    "content": "---\ntitle: \"Black and white girl\"\nexcerpt: \"PaperFaces portrait of @karensd drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-karensd-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-karensd-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@karensd](https://twitter.com/karensd).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-10-melchoyce-portrait.md",
    "content": "---\ntitle: \"Surprise face hiding in a sweater\"\nexcerpt: \"PaperFaces portrait of @melchoyce drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-melchoyce-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-melchoyce-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@melchoyce](https://twitter.com/melchoyce).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube 8znOwv0XxcI %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-15-andreikharlanov-portrait.md",
    "content": "---\ntitle: \"Bright lighting and glasses\"\nexcerpt: \"PaperFaces portrait of @andreikharlanov drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andreikharlanov-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andreikharlanov-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@andreikharlanov](https://twitter.com/andreikharlanov).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-15-fenderf4i-portrait.md",
    "content": "---\ntitle: \"Big black glasses\"\nexcerpt: \"PaperFaces portrait of @fenderf4i drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fenderf4i-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fenderf4i-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@fenderf4i](https://twitter.com/fenderf4i).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-15-jbenton-portrait.md",
    "content": "---\ntitle: \"Monochromatic blue beard\"\nexcerpt: \"PaperFaces portrait of @jbenton drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jbenton-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jbenton-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@jbenton](https://twitter.com/jbenton).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-15-ladygeekgeek-portrait.md",
    "content": "---\ntitle: \"Girl with the curl, and some ducks\"\nexcerpt: \"PaperFaces portrait of @ladygeekgeek drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ladygeekgeek-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ladygeekgeek-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ladygeekgeek](https://twitter.com/ladygeekgeek).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-15-marianoabdala-portrait.md",
    "content": "---\ntitle: \"White headphone chillaxin\"\nexcerpt: \"PaperFaces portrait of @marianoabdala drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-marianoabdala-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-marianoabdala-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@marianoabdala](https://twitter.com/marianoabdala).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-15-maxquattromani-portrait.md",
    "content": "---\ntitle: \"Black and white beard formal\"\nexcerpt: \"PaperFaces portrait of @maxquattromani drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-maxquattromani-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-maxquattromani-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@maxquattromani](https://twitter.com/maxquattromani).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-15-mommanofool-portrait.md",
    "content": "---\ntitle: \"Dangling earrings\"\nexcerpt: \"PaperFaces portrait of @mommanofool drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mommanofool-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mommanofool-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mommanofool](https://twitter.com/mommanofool).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-17-cassini-portrait.md",
    "content": "---\ntitle: \"Solar flares and blue lighting\"\nexcerpt: \"PaperFaces portrait of @cassini_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cassini-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cassini-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@cassini_](https://twitter.com/cassini_).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube suObiibat7A %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-17-hugeshark-portrait.md",
    "content": "---\ntitle: \"Short hair, pink bangs\"\nexcerpt: \"PaperFaces portrait of @hugeshark drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hugeshark-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hugeshark-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@hugeshark](https://twitter.com/hugeshark).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-17-sarakenobi-portrait.md",
    "content": "---\ntitle: \"Kids in 3D glasses and red hats\"\nexcerpt: \"PaperFaces portrait of @sarakenobi drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sarakenobi-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sarakenobi-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait avatar for [@sarakenobi](https://twitter.com/sarakenobi).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-22-M1RRN-portrait.md",
    "content": "---\ntitle: \"Red shirt on a train\"\nexcerpt: \"PaperFaces portrait of @M1RRN drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-M1RRN-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-M1RRN-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@M1RRN](https://twitter.com/M1RRN).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-22-allara-portrait.md",
    "content": "---\ntitle: \"In gray on a bridge in the wilderness\"\nexcerpt: \"PaperFaces portrait of @allara drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-allara-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-allara-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@allara](https://twitter.com/allara).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-22-brackin-portrait.md",
    "content": "---\ntitle: \"Dude in blue\"\nexcerpt: \"PaperFaces portrait of @brackin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-brackin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-brackin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@brackin](https://twitter.com/brackin).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-22-ewalshe2-portrait.md",
    "content": "---\ntitle: \"Adorned with a flower\"\nexcerpt: \"PaperFaces portrait of @ewalshe2 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ewalshe2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ewalshe2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ewalshe2](https://twitter.com/ewalshe2).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-22-faresf-portrait.md",
    "content": "---\ntitle: \"All suited up\"\nexcerpt: \"PaperFaces portrait of @faresf drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-faresf-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-faresf-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@faresf](https://twitter.com/faresf).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-22-hallaek-portrait.md",
    "content": "---\ntitle: \"Unicorn hair flowing on the floor\"\nexcerpt: \"PaperFaces portrait of @hallaek drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hallaek-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hallaek-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@hallaek](https://twitter.com/hallaek).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube RlvDlCAjWsk %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-22-moonflowerchild-portrait.md",
    "content": "---\ntitle: \"Sunglasses and bangs\"\nexcerpt: \"PaperFaces portrait of @moonflowerchild drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-moonflowerchild-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-moonflowerchild-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@moonflowerchild](https://twitter.com/moonflowerchild).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-26-choise-portrait.md",
    "content": "---\ntitle: \"Black and white glasses hat\"\nexcerpt: \"PaperFaces portrait of @choise drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-choise-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-choise-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@choise](https://twitter.com/choise).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-26-morganmiller250-portrait.md",
    "content": "---\ntitle: \"Pink stripes against blue backdrops\"\nexcerpt: \"PaperFaces portrait of @morganmiller250 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-morganmiller250-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-morganmiller250-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@morganmiller250](https://twitter.com/morganmiller250).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-26-ncfc-mad-portrait.md",
    "content": "---\ntitle: \"Sports cap in a gray room\"\nexcerpt: \"PaperFaces portrait of @NCFC_Mad drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ncfc-mad-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ncfc-mad-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@NCFC_Mad](https://twitter.com/NCFC_Mad).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-26-ruth-goodwin-2-portrait.md",
    "content": "---\ntitle: \"Sunglass chillin friends\"\nexcerpt: \"PaperFaces portrait of @Ruth_Goodwin and friend drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ruth-goodwin-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ruth-goodwin-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@Ruth_Goodwin](https://twitter.com/Ruth_Goodwin).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-26-ruth-goodwin-portrait.md",
    "content": "---\ntitle: \"Long hair spathetti straps\"\nexcerpt: \"PaperFaces portrait of @Ruth_Goodwin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ruth-goodwin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ruth-goodwin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@Ruth_Goodwin](https://twitter.com/Ruth_Goodwin).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-29-jfskjaerbaek-portrait.md",
    "content": "---\ntitle: \"Black and white stubble\"\nexcerpt: \"PaperFaces portrait of @JFSkjaerbaek drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jfskjaerbaek-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jfskjaerbaek-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@JFSkjaerbaek](https://twitter.com/JFSkjaerbaek).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-29-kealey-portrait.md",
    "content": "---\ntitle: \"That's a really large atmark\"\nexcerpt: \"PaperFaces portrait of @kealey drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kealey-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kealey-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@kealey](https://twitter.com/kealey).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-29-the-boii-portrait.md",
    "content": "---\ntitle: \"Blue collard shirt with muted backdrop\"\nexcerpt: \"PaperFaces portrait of @the_boii drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-the-boii-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-the-boii-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@the_boii](https://twitter.com/the_boii).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-29-toberl-portrait.md",
    "content": "---\ntitle: \"Black and white bearded fella wearing glasses\"\nexcerpt: \"PaperFaces portrait of @toberl drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-toberl-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-toberl-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@toberl](https://twitter.com/toberl).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-30-bdf413-portrait.md",
    "content": "---\ntitle: \"Wear a scarf in this moody lit room\"\nexcerpt: \"PaperFaces portrait of @BDF413 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bdf413-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bdf413-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@BDF413](https://twitter.com/BDF413).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-30-eternallife-portrait.md",
    "content": "---\ntitle: \"Heart shaped earrings\"\nexcerpt: \"PaperFaces portrait of @eternallife_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-eternallife-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-eternallife-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@eternallife_](https://twitter.com/eternallife_).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-10-30-farrenbennett-portrait.md",
    "content": "---\ntitle: \"Suit and tie against gray\"\nexcerpt: \"PaperFaces portrait of @farrenbennett drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-farrenbennett-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-farrenbennett-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@farrenbennett](https://twitter.com/farrenbennett).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-andrew-shaw23-portrait.md",
    "content": "---\ntitle: \"What do vegan werewolves eat?\"\nexcerpt: \"PaperFaces portrait of @andrew-shaw23 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andrew-shaw23-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andrew-shaw23-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@andrew-shaw23](https://twitter.com/andrew-shaw23).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-fitt-kimberley-portrait.md",
    "content": "---\ntitle: \"Lady in red\"\nexcerpt: \"PaperFaces portrait of @Fitt_Kimberley drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fitt-kimberley-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fitt-kimberley-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Fitt_Kimberley](https://twitter.com/Fitt_Kimberley).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-joshthecantor-portrait.md",
    "content": "---\ntitle: \"Goatee and blue v-neck shirt\"\nexcerpt: \"PaperFaces portrait of @joshthecantor drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joshthecantor-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joshthecantor-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@joshthecantor](https://twitter.com/joshthecantor).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-karen-melgar-portrait.md",
    "content": "---\ntitle: \"Face mask without the face\"\nexcerpt: \"PaperFaces portrait of @Karen_Melgar drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-karen-melgar-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-karen-melgar-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Karen_Melgar](https://twitter.com/Karen_Melgar).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-laurel-renne-portrait.md",
    "content": "---\ntitle: \"Dark hair and glasses\"\nexcerpt: \"PaperFaces portrait of @Laurel_Renee drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-laurel-renee-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-laurel-renee-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Laurel_Renee](https://twitter.com/Laurel_Renee).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-mr-craig-portrait.md",
    "content": "---\ntitle: \"In front of book shelves\"\nexcerpt: \"PaperFaces portrait of @mr_craig drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mr-craig-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mr-craig-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mr_craig](https://twitter.com/mr_craig).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-rbartolome-portrait.md",
    "content": "---\ntitle: \"Glasses and dark spikes\"\nexcerpt: \"PaperFaces portrait of @rbartolome drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rbartolome-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rbartolome-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rbartolome](https://twitter.com/rbartolome).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-05-realpaul8rown-portrait.md",
    "content": "---\ntitle: \"Wearing an orange afro\"\nexcerpt: \"PaperFaces portrait of @RealPaul8rown drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-realpaul8rown-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-realpaul8rown-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@RealPaul8rown](https://twitter.com/RealPaul8rown).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-07-ajkonieckijr-portrait.md",
    "content": "---\ntitle: \"Life guard smoking a cigar\"\nexcerpt: \"PaperFaces portrait of @ajkonieckijr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ajkonieckijr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ajkonieckijr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@ajkonieckijr](https://twitter.com/ajkonieckijr).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-07-carriehammer-portrait.md",
    "content": "---\ntitle: \"Long Hair Faceless in Grayscale\"\nexcerpt: \"PaperFaces portrait of @carriehammer drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-carriehammer-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-carriehammer-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@carriehammer](https://twitter.com/carriehammer).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-07-curlycrazy-portrait.md",
    "content": "---\ntitle: \"Curly locks of hair\"\nexcerpt: \"PaperFaces portrait of @curlycrazy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-curlycrazy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-curlycrazy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@curlycrazy](https://twitter.com/curlycrazy).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-07-raquibahasan-portrait.md",
    "content": "---\ntitle: \"iPhone man in a suit\"\nexcerpt: \"PaperFaces portrait of @raquibahasan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-raquibahasan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-raquibahasan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@raquibahasan](https://twitter.com/raquibahasan).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-12-geekbabe-portrait.md",
    "content": "---\ntitle: \"In a black top\"\nexcerpt: \"PaperFaces portrait of @geekbabe drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-geekbabe-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-geekbabe-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@geekbabe](https://twitter.com/geekbabe).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-12-jen-portrait.md",
    "content": "---\ntitle: \"Bright red lips\"\nexcerpt: \"PaperFaces portrait of @jen drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jen-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jen-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@jen](https://twitter.com/jen).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-12-kerby-portrait.md",
    "content": "---\ntitle: \"Blue shirt\"\nexcerpt: \"PaperFaces portrait of @kerby drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kerby-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kerby-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@kerby](https://twitter.com/kerby).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-12-mh-portrait.md",
    "content": "---\ntitle: \"Sunglasses and a hoodie\"\nexcerpt: \"PaperFaces portrait of @mh drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mh-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mh-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@mh](https://twitter.com/mh).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-12-tasselflower-portrait.md",
    "content": "---\ntitle: \"3/4 view in grayscale\"\nexcerpt: \"PaperFaces portrait of @tasselflower drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tasselflower-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tasselflower-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@tasselflower](https://twitter.com/tasselflower).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-14-akaheini-portrait.md",
    "content": "---\ntitle: \"Muted tones\"\nexcerpt: \"PaperFaces portrait of @akaheini drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-akaheini-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-akaheini-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@akaheini](https://twitter.com/akaheini).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-14-d-agostino-portrait.md",
    "content": "---\ntitle: \"Water pistol\"\nexcerpt: \"PaperFaces portrait of @d_agostino drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-d-agostino-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-d-agostino-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@d_agostino](https://twitter.com/d_agostino).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-14-davidpoblador-portrait.md",
    "content": "---\ntitle: \"Rockin' some Spotify tunes in a scarf\"\nexcerpt: \"PaperFaces portrait of @davidpoblador drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-davidpoblador-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-davidpoblador-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@davidpoblador](https://twitter.com/davidpoblador).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-14-meggandeth-portrait.md",
    "content": "---\ntitle: \"Metal, dark hair\"\nexcerpt: \"PaperFaces portrait of @meggandeth drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-meggandeth-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-meggandeth-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@meggandeth](https://twitter.com/meggandeth).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-14-theordovician-portrait.md",
    "content": "---\ntitle: \"Dark hair, red lips\"\nexcerpt: \"PaperFaces portrait of @theordovician drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-theordovician-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-theordovician-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@theordovician](https://twitter.com/theordovician).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-19-katypegg-portrait.md",
    "content": "---\ntitle: \"Clapping. Let's clap.\"\nexcerpt: \"PaperFaces portrait of @katypegg drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-katypegg-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-katypegg-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@katypegg](https://twitter.com/katypegg).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-19-neckbeard-portrait.md",
    "content": "---\ntitle: \"Upside down\"\nexcerpt: \"PaperFaces portrait of @_neckbeard drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-neckbeard-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-neckbeard-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@_neckbeard](https://twitter.com/_neckbeard).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-19-pepfre-portrait.md",
    "content": "---\ntitle: \"In a nice suit\"\nexcerpt: \"PaperFaces portrait of @pepfre drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pepfre-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pepfre-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@pepfre](https://twitter.com/pepfre).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-19-soaps-portrait.md",
    "content": "---\ntitle: \"Blonde black and white\"\nexcerpt: \"PaperFaces portrait of @_soaps drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-soaps-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-soaps-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@_soaps](https://twitter.com/_soaps).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-19-superbeffie-portrait.md",
    "content": "---\ntitle: \"Dark haired girl in purple\"\nexcerpt: \"PaperFaces portrait of @superbeffie drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-superbeffie-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-superbeffie-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@superbeffie](https://twitter.com/superbeffie).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-19-torop4in-portrait.md",
    "content": "---\ntitle: \"In front of a rock wall\"\nexcerpt: \"PaperFaces portrait of @torop4in drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-torop4in-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-torop4in-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@torop4in](https://twitter.com/torop4in).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-19-unlockthedoc-portrait.md",
    "content": "---\ntitle: \"Dude with a beard\"\nexcerpt: \"PaperFaces portrait of @unlockthedoc drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-unlockthedoc-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-unlockthedoc-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@unlockthedoc](https://twitter.com/unlockthedoc).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-21-commadelimited-portrait.md",
    "content": "---\ntitle: \"Epic beard\"\nexcerpt: \"PaperFaces portrait of @commadelimited drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-commadelimited-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-commadelimited-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@commadelimited](https://twitter.com/commadelimited).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-21-sarelrivera-portrait.md",
    "content": "---\ntitle: \"Girl in gray\"\nexcerpt: \"PaperFaces portrait of @sarelrivera drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sarelrivera-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sarelrivera-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait commissioned of [@sarelrivera](https://twitter.com/sarelrivera).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube YS3Ylg3fcoA %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-acostamt-portrait.md",
    "content": "---\ntitle: \"Fellow iPad illustrator\"\nexcerpt: \"PaperFaces portrait of @acostamt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-acostamt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-acostamt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@acostamt](https://twitter.com/acostamt).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-alittlebluestar-portrait.md",
    "content": "---\ntitle: \"Girl in dark, in front of a blue background\"\nexcerpt: \"PaperFaces portrait of @alittlebluestar drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alittlebluestar-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alittlebluestar-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@alittlebluestar](https://twitter.com/alittlebluestar).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-chris-obyrne-portrait.md",
    "content": "---\ntitle: \"Wearing an orange safety cone can be fun\"\nexcerpt: \"PaperFaces portrait of @chris_Obyrne drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chris-obyrne-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chris-obyrne-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@chris_Obyrne](https://twitter.com/chris_Obyrne).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-jaceanderson-portrait.md",
    "content": "---\ntitle: \"Brick wall beards\"\nexcerpt: \"PaperFaces portrait of @jaceanderson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jaceanderson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jaceanderson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@jaceanderson](https://twitter.com/jaceanderson).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-jarrardcole-portrait.md",
    "content": "---\ntitle: \"Doing video editing in a theater\"\nexcerpt: \"PaperFaces portrait of @jarrardcole drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jarrardcole-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jarrardcole-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@jarrardcole](https://twitter.com/jarrardcole).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-omri-mor-portrait.md",
    "content": "---\ntitle: \"Sitting on some steps in black and white\"\nexcerpt: \"PaperFaces portrait of @omri_mor drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-omri-mor-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-omri-mor-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@omri_mor](https://twitter.com/omri_mor).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube c2sYfotHIl0 %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-pjrvswp-portrait.md",
    "content": "---\ntitle: \"Full sleeve of tattoos\"\nexcerpt: \"PaperFaces portrait of @pjrvswp drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pjrvswp-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pjrvswp-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, tattoo, time lapse]\n---\n\nPaperFaces portrait of project donator [@pjrvswp](https://twitter.com/pjrvswp).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube UA9t52T0Aec %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-theejana-portrait.md",
    "content": "---\ntitle: \"Black and white wearing a hood\"\nexcerpt: \"PaperFaces portrait of @theejana drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-theejana-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-theejana-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@theejana](https://twitter.com/theejana).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-26-xavdog-portrait.md",
    "content": "---\ntitle: \"Standing in front of wood paneling\"\nexcerpt: \"PaperFaces portrait of @xavdog drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-xavdog-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-xavdog-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@xavdog](https://twitter.com/xavdog).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-27-parisba-portrait.md",
    "content": "---\ntitle: \"Goofy grey cat\"\nexcerpt: \"PaperFaces portrait of @parisba drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-parisba-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-parisba-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces avatar portrait for [@parisba](https://twitter.com/parisba).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-30-benjaminzamayo-portrait.md",
    "content": "---\ntitle: \"Jean jacket and hood\"\nexcerpt: \"PaperFaces portrait of @BenjaminZAMayo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-benjaminzamayo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-benjaminzamayo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@BenjaminZAMayo](https://twitter.com/BenjaminZAMayo).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-30-dave-buxton-portrait.md",
    "content": "---\ntitle: \"Wearing a suit\"\nexcerpt: \"PaperFaces portrait of @Dave_Buxton drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dave-buxton-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dave-buxton-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@Dave_Buxton](https://twitter.com/Dave_Buxton).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-30-ichris-portrait.md",
    "content": "---\ntitle: \"Drawn in black and white\"\nexcerpt: \"PaperFaces portrait of @ichris drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ichris-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ichris-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ichris](https://twitter.com/ichris).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-30-joelmartinez-portrait.md",
    "content": "---\ntitle: \"Sweaters in office cubes\"\nexcerpt: \"PaperFaces portrait of @joelmartinez drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joelmartinez-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joelmartinez-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@joelmartinez](https://twitter.com/joelmartinez).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-30-karenkho-portrait.md",
    "content": "---\ntitle: \"Smiling girl\"\nexcerpt: \"PaperFaces portrait of @karenkho drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-karenkho-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-karenkho-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@karenkho](https://twitter.com/karenkho).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-30-liamdaly-portrait.md",
    "content": "---\ntitle: \"Black and white, full frame\"\nexcerpt: \"PaperFaces portrait of @liamdaly drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-liamdaly-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-liamdaly-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@liamdaly](https://twitter.com/liamdaly).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-11-30-stottle-portrait.md",
    "content": "---\ntitle: \"Silhouette of a man\"\nexcerpt: \"PaperFaces portrait of @Stottle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-stottle-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-stottle-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Stottle](https://twitter.com/Stottle).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-03-jloupe-portrait.md",
    "content": "---\ntitle: \"In front of a face\"\nexcerpt: \"PaperFaces portrait of @jloupe drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jloupe-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jloupe-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@jloupe](https://twitter.com/jloupe).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-03-kennedysgarage-portrait.md",
    "content": "---\ntitle: \"In a car at night\"\nexcerpt: \"PaperFaces portrait of @kennedysgarage drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kennedysgarage-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kennedysgarage-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@kennedysgarage](https://twitter.com/kennedysgarage).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-06-annraoiod-portrait.md",
    "content": "---\ntitle: \"Beret in black\"\nexcerpt: \"PaperFaces portrait of @AnnraoiOD drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-annraoiod-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-annraoiod-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@AnnraoiOD](https://twitter.com/AnnraoiOD).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-06-berniecakez-portrait.md",
    "content": "---\ntitle: \"Brightly colored hair\"\nexcerpt: \"PaperFaces portrait of @berniecakez drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-berniecakez-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-berniecakez-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@berniecakez](https://twitter.com/berniecakez).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-06-chelseawears-portrait.md",
    "content": "---\ntitle: \"Standing in front of vines and branches\"\nexcerpt: \"PaperFaces portrait of @ChelseaWears drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chelseawears-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chelseawears-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ChelseaWears](https://twitter.com/ChelseaWears).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-06-christyxcore-portrait.md",
    "content": "---\ntitle: \"Dr. Who Superfan\"\nexcerpt: \"PaperFaces portrait of @christyxcore drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-christyxcore-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-christyxcore-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@christyxcore](https://twitter.com/christyxcore).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-06-daigansf-portrait.md",
    "content": "---\ntitle: \"Holding a fan in sepia tones\"\nexcerpt: \"PaperFaces portrait of @Daigansf drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-daigansf-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-daigansf-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@Daigansf](https://twitter.com/Daigansf).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-06-krkwd-portrait.md",
    "content": "---\ntitle: \"In front of a lime green background\"\nexcerpt: \"PaperFaces portrait of @krkwd drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-krkwd-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-krkwd-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@krkwd](https://twitter.com/krkwd).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-10-a-farlow44-portrait.md",
    "content": "---\ntitle: \"High contrast blue and yellow composition\"\nexcerpt: \"PaperFaces portrait of @A_Farlow44 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-a-farlow44-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-a-farlow44-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@A_Farlow44](https://twitter.com/A_Farlow44).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-10-bradenransome-portrait.md",
    "content": "---\ntitle: \"High contrast blue and yellow composition part deux\"\nexcerpt: \"PaperFaces portrait of @BradenRansome drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bradenransome-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bradenransome-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@BradenRansome](https://twitter.com/BradenRansome).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-10-getoutyourmap-portrait.md",
    "content": "---\ntitle: \"Wearing a green knit hat\"\nexcerpt: \"PaperFaces portrait of @getoutyourmap drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-getoutyourmap-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-getoutyourmap-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@getoutyourmap](https://twitter.com/getoutyourmap).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-10-jkusunoki-portrait.md",
    "content": "---\ntitle: \"Drinking wine in an argyle sweater\"\nexcerpt: \"PaperFaces portrait of @jkusunoki drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jkusunoki-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jkusunoki-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@jkusunoki](https://twitter.com/jkusunoki).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-10-mattdusenbury-portrait.md",
    "content": "---\ntitle: \"The iPad has become a face\"\nexcerpt: \"PaperFaces portrait of @mattdusenbury drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mattdusenbury-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mattdusenbury-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mattdusenbury](https://twitter.com/mattdusenbury).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-10-vilkina-portrait.md",
    "content": "---\ntitle: \"Floral dress outside the steps\"\nexcerpt: \"PaperFaces portrait of @vilkina drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vilkina-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vilkina-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@vilkina](https://twitter.com/vilkina).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-10-zachfulkerson-portrait.md",
    "content": "---\ntitle: \"Bearded sir in a striped scarf\"\nexcerpt: \"PaperFaces portrait of @zachfulkerson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-zachfulkerson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-zachfulkerson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@zachfulkerson](https://twitter.com/zachfulkerson)\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-alextrott-portrait.md",
    "content": "---\ntitle: \"Sitting in the dark wearing a hoodie\"\nexcerpt: \"PaperFaces portrait of @alextrott_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alextrott-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alextrott-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@alextrott_](https://twitter.com/alextrott_).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-ameeko-portrait.md",
    "content": "---\ntitle: \"Long flowing hair in a red tank top\"\nexcerpt: \"PaperFaces portrait of @ameeko drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ameeko-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ameeko-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ameeko](https://twitter.com/ameeko).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-benmarsh-portrait.md",
    "content": "---\ntitle: \"A study in gray\"\nexcerpt: \"PaperFaces portrait of @benmarsh drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-benmarsh-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-benmarsh-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@benmarsh](https://twitter.com/benmarsh).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-chetyeary-portrait.md",
    "content": "---\ntitle: \"Muted Tones in an Earthy Room\"\nexcerpt: \"PaperFaces portrait of @chetyeary drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chetyeary-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chetyeary-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@chetyeary](https://twitter.com/chetyeary).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-eberth-portrait.md",
    "content": "---\ntitle: \"Drawing in black and white\"\nexcerpt: \"PaperFaces portrait of @eberth drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-eberth-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-eberth-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@eberth](https://twitter.com/eberth).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-f5point6-portrait.md",
    "content": "---\ntitle: \"Pasta strainer over the head\"\nexcerpt: \"PaperFaces portrait of @f5point6 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-f5point6-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-f5point6-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@f5point6](https://twitter.com/f5point6).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-jonikorpi-portrait.md",
    "content": "---\ntitle: \"Looking at a mobile device intensely\"\nexcerpt: \"PaperFaces portrait of @jonikorpi drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jonikorpi-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jonikorpi-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@jonikorpi](https://twitter.com/jonikorpi).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-lyetz-portrait.md",
    "content": "---\ntitle: \"Plain white T, another study in gray\"\nexcerpt: \"PaperFaces portrait of @Lyetz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lyetz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lyetz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@Lyetz](https://twitter.com/Lyetz).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-mandrl-portrait.md",
    "content": "---\ntitle: \"3/4 view in rust tones\"\nexcerpt: \"PaperFaces portrait of @mandrl drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mandrl-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mandrl-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@mandrl](https://twitter.com/mandrl).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-ninomh-portrait.md",
    "content": "---\ntitle: \"I wear my sunglasses at night…\"\nexcerpt: \"PaperFaces portrait of @ninoMH drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ninomh-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ninomh-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ninoMH](https://twitter.com/ninoMH).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-roblawton-portrait.md",
    "content": "---\ntitle: \"Man of Steel\"\nexcerpt: \"PaperFaces portrait of @roblawton drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-roblawton-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-roblawton-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@roblawton](https://twitter.com/roblawton).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-stefstivala-portrait.md",
    "content": "---\ntitle: \"Cap, eye glasses, and tie\"\nexcerpt: \"PaperFaces portrait of @stefstivala drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-stefstivala-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-stefstivala-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@stefstivala](https://twitter.com/stefstivala).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-tarungangwani-portrait.md",
    "content": "---\ntitle: \"In a blue dress shirt\"\nexcerpt: \"PaperFaces portrait of @tarungangwani drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tarungangwani-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tarungangwani-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@tarungangwani](https://twitter.com/tarungangwani).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube 1Q6fjg5G_GA %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-thetombell-portrait.md",
    "content": "---\ntitle: \"Yellow and blue stripes, view from below\"\nexcerpt: \"PaperFaces portrait of @thetombell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thetombell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thetombell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@thetombell](https://twitter.com/thetombell).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-13-yaraher-portrait.md",
    "content": "---\ntitle: \"3/4 view against an orange background\"\nexcerpt: \"PaperFaces portrait of @Yaraher drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-yaraher-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-yaraher-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Yaraher](https://twitter.com/Yaraher).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-19-fra-cek-portrait.md",
    "content": "---\ntitle: \"Plaid in glasses\"\nexcerpt: \"PaperFaces portrait of @fra_cek drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fra-cek-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fra-cek-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@fra_cek](https://twitter.com/fra_cek).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-19-maique-portrait.md",
    "content": "---\ntitle: \"Framed stuck tongue\"\nexcerpt: \"PaperFaces portrait of @maique drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-maique-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-maique-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nLarge ornate frames are the best for sticking out your tongue in. PaperFaces portrait of project donator [@maique](https://twitter.com/maique).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-adeirra-portrait.md",
    "content": "---\ntitle: \"Fancy pants hat tip\"\nexcerpt: \"PaperFaces portrait of @adeirra drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-adeirra-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-adeirra-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@adeirra](https://twitter.com/adeirra).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-amy-lew-portrait.md",
    "content": "---\ntitle: \"Long hair in violet\"\nexcerpt: \"PaperFaces portrait of @amy_lew drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-amy-lew-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-amy-lew-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@amy_lew](https://twitter.com/amy_lew).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-aragost-portrait.md",
    "content": "---\ntitle: \"Big grin on those orange hues\"\nexcerpt: \"PaperFaces portrait of @aragost drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-aragost-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-aragost-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@aragost](https://twitter.com/aragost).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-carlfriend-portrait.md",
    "content": "---\ntitle: \"A man and his dog\"\nexcerpt: \"PaperFaces portrait of @Carlfriend drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-carlfriend-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-carlfriend-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Carlfriend](https://twitter.com/Carlfriend).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-kimkimcachoo-portrait.md",
    "content": "---\ntitle: \"Long hair leaning forward\"\nexcerpt: \"PaperFaces portrait of @kimkimcachoo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kimkimcachoo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kimkimcachoo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@kimkimcachoo](https://twitter.com/kimkimcachoo).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-leahchu-portrait.md",
    "content": "---\ntitle: \"Frosty blue snowflake bokeh\"\nexcerpt: \"PaperFaces portrait of @leahchu drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-leahchu-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-leahchu-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@leahchu](https://twitter.com/leahchu).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-londonwebdev-portrait.md",
    "content": "---\ntitle: \"Goatee earlobe tugging\"\nexcerpt: \"PaperFaces portrait of @LondonWebDev drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-londonwebdev-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-londonwebdev-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@LondonWebDev](https://twitter.com/LondonWebDev).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-m0rph3v5-portrait.md",
    "content": "---\ntitle: \"Gray and blue striped hoodie\"\nexcerpt: \"PaperFaces portrait of @m0rph3v5 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-m0rph3v5-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-m0rph3v5-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@m0rph3v5](https://twitter.com/m0rph3v5).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-mattlawton87-portrait.md",
    "content": "---\ntitle: \"A couple\"\nexcerpt: \"PaperFaces portrait of @mattlawton87 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mattlawton87-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mattlawton87-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@mattlawton87](https://twitter.com/mattlawton87).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-michaeltomko-portrait.md",
    "content": "---\ntitle: \"Just married mustache lip disguises\"\nexcerpt: \"PaperFaces portrait of @michaeltomko drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-michaeltomko-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-michaeltomko-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@michaeltomko](https://twitter.com/michaeltomko).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-mriddickw-portrait.md",
    "content": "---\ntitle: \"Steam punk aesthetic, in a hat\"\nexcerpt: \"PaperFaces portrait of @MriddickW drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mriddickw-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mriddickw-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@MriddickW](https://twitter.com/MriddickW).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-mukealicious-portrait.md",
    "content": "---\ntitle: \"Camo hat and floral wallpapers\"\nexcerpt: \"PaperFaces portrait of @mukealicious drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mukealicious-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mukealicious-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mukealicious](https://twitter.com/mukealicious).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-ottmark-portrait.md",
    "content": "---\ntitle: \"Dramatic lighting in a brown room\"\nexcerpt: \"PaperFaces portrait of @ottmark drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ottmark-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ottmark-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ottmark](https://twitter.com/ottmark).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-psychoticmilkma-portrait.md",
    "content": "---\ntitle: \"Raiden wins. Flawless victory!\"\nexcerpt: \"PaperFaces portrait of @psychoticmilkma drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-psychoticmilkma-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-psychoticmilkma-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, time lapse]\n---\n\nPaperFaces portrait of project donator [@psychoticmilkma](https://twitter.com/psychoticmilkma).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube x6ok6e3DERE %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-quimeraimantada-portrait.md",
    "content": "---\ntitle: \"Flower girl in a grass field\"\nexcerpt: \"PaperFaces portrait of @quimeraimantada drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-quimeraimantada-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-quimeraimantada-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@quimeraimantada](https://twitter.com/quimeraimantada).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-santa-claus-portrait.md",
    "content": "---\ntitle: \"The big man in red\"\nexcerpt: \"PaperFaces portrait of Santa Claus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-santa-claus.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-santa-claus-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of Santa Claus. Ho ho ho!\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-sushobhan-portrait.md",
    "content": "---\ntitle: \"Gray tones and striped shirts\"\nexcerpt: \"PaperFaces portrait of @sushobhan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sushobhan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sushobhan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sushobhan](https://twitter.com/sushobhan).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-wiremum-portrait.md",
    "content": "---\ntitle: \"iPhone holding purple blouse\"\nexcerpt: \"PaperFaces portrait of @wiremum drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-wiremum-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-wiremum-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commissioned of [@wiremum](https://twitter.com/wiremum).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2012-12-31-wiretillidie-portrait.md",
    "content": "---\ntitle: \"Holding a baby on a leather couch\"\nexcerpt: \"PaperFaces portrait of @wiretillidie drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-wiretillidie-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-wiretillidie-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commissioned of [@wiretillidie](https://twitter.com/wiretillidie).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-01-bradyv-portrait.md",
    "content": "---\ntitle: \"Wearing a bright orange knit hat\"\nexcerpt: \"PaperFaces portrait of @bradyv drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bradyv-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bradyv-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@bradyv](https://twitter.com/bradyv).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-01-eighthree-portrait.md",
    "content": "---\ntitle: \"High brightness front view\"\nexcerpt: \"PaperFaces portrait of @eighthree drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-eighthree-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-eighthree-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@eighthree](https://twitter.com/eighthree).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-01-ihatealexwright-portrait.md",
    "content": "---\ntitle: \"Furry hat snuggling a Siamese cat\"\nexcerpt: \"PaperFaces portrait of @ihatealexwright drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ihatealexwright-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ihatealexwright-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ihatealexwright](https://twitter.com/ihatealexwright).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-01-jamesslock-portrait.md",
    "content": "---\ntitle: \"Swallow neck tattoos and glasses\"\nexcerpt: \"PaperFaces portrait of @jamesslock drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jamesslock-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jamesslock-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@jamesslock](https://twitter.com/jamesslock).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-01-keyflake-portrait.md",
    "content": "---\ntitle: \"Ferris wheel at night\"\nexcerpt: \"PaperFaces portrait of @keyflake drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-keyflake-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-keyflake-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@keyflake](https://twitter.com/keyflake).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube 6yUmJRwXAdE %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-01-michael-rose-portrait.md",
    "content": "---\ntitle: \"Self portrait of the scruffy artist\"\nexcerpt: \"PaperFaces portrait of a scruffy @mmistakes drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2013-06-05\nimage: \n  path: &image /assets/images/paperfaces-michael-rose.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-michael-rose-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, self portrait, beard, time lapse]\n---\n\nSelf portrait of [@mmistakes](https://twitter.com/mmistakes) (hey that's me) in an autumn field.\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube NqcGVymOiPo %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-01-patrickleary-portrait.md",
    "content": "---\ntitle: \"Standing in a field of sunflowers\"\nexcerpt: \"PaperFaces portrait of @PatrickLeary drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-patrickleary-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-patrickleary-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@PatrickLeary](https://twitter.com/PatrickLeary).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-03-campbell-soupp-portrait.md",
    "content": "---\ntitle: \"Blonde hair taking a selfie\"\nexcerpt: \"PaperFaces portrait of @campbell_soupp drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-campbell-soupp-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-campbell-soupp-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@campbell_soupp](https://twitter.com/campbell_soupp).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-03-lemon-lime-portrait.md",
    "content": "---\ntitle: \"Yellow lime colored shirt\"\nexcerpt: \"PaperFaces portrait of @lemon_lime drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lemon-lime-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lemon-lime-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@lemon_lime](https://twitter.com/lemon_lime).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-03-njklas-portrait.md",
    "content": "---\ntitle: \"Sunglasses with side swiped hair\"\nexcerpt: \"PaperFaces portrait of @njklas drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-njklas-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-njklas-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@njklas](https://twitter.com/njklas).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-03-thebrady-khollybell-portrait.md",
    "content": "---\ntitle: \"Batman and his girl\"\nexcerpt: \"PaperFaces portrait of @theBrady and @khollybell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thebrady-khollybell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thebrady-khollybell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@theBrady](https://twitter.com/theBrady) and [@khollybell](https://twitter.com/khollybell).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-06-calwahab-portrait.md",
    "content": "---\ntitle: \"Laying on a blanket at the beach\"\nexcerpt: \"PaperFaces portrait of @calwahab drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-calwahab-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-calwahab-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@calwahab](https://twitter.com/calwahab).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-06-chrbutler-portrait.md",
    "content": "---\ntitle: \"Yellow and blue tones\"\nexcerpt: \"PaperFaces portrait of @chrbutler drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chrbutler-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chrbutler-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@chrbutler](https://twitter.com/chrbutler).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-06-munkimatt-portrait.md",
    "content": "---\ntitle: \"Hand eyes with a curly mustache\"\nexcerpt: \"PaperFaces portrait of @munkimatt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-munkimatt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-munkimatt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@munkimatt](https://twitter.com/munkimatt).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-06-ssetlik-portrait.md",
    "content": "---\ntitle: \"Listening to music, window style\"\nexcerpt: \"PaperFaces portrait of @ssetlik drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ssetlik-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ssetlik-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ssetlik](https://twitter.com/ssetlik).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-09-slicknet-portrait.md",
    "content": "---\ntitle: \"In a suit and hat talking mobile phones\"\nexcerpt: \"PaperFaces portrait of @slicknet drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-slicknet-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-slicknet-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@slicknet](https://twitter.com/slicknet).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-09-swiftkickcoach-portrait.md",
    "content": "---\ntitle: \"Sunglasses with green stuffed animal\"\nexcerpt: \"PaperFaces portrait of @SwiftKickCoach_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-swiftkickcoach-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-swiftkickcoach-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@SwiftKickCoach_](https://twitter.com/SwiftKickCoach_).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-09-tellyoumore-portrait.md",
    "content": "---\ntitle: \"In a scarf thinking lots of orange hues\"\nexcerpt: \"PaperFaces portrait of @TellYouMore drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tellyoumore-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tellyoumore-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@TellYouMore](https://twitter.com/TellYouMore).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-10-aaronrustad-portrait.md",
    "content": "---\ntitle: \"Glasses in front of green water\"\nexcerpt: \"PaperFaces portrait of @aaronrustad drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-aaronrustad-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-aaronrustad-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@aaronrustad](https://twitter.com/aaronrustad).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube zrpoGw7A_hY %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-10-gothamity-portrait.md",
    "content": "---\ntitle: \"Short hair and red lipstick\"\nexcerpt: \"PaperFaces portrait of @gothamity drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gothamity-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gothamity-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@gothamity](https://twitter.com/gothamity).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-13-cenk-portrait.md",
    "content": "---\ntitle: \"Black and white beard\"\nexcerpt: \"PaperFaces portrait of @Cenk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cenk-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cenk-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@Cenk](https://twitter.com/Cenk).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-13-moriartied-portrait.md",
    "content": "---\ntitle: \"Glasses and short hair\"\nexcerpt: \"PaperFaces portrait of @moriartied drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-moriartied-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-moriartied-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@moriartied](https://twitter.com/moriartied).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-13-rasmusfisker-portrait.md",
    "content": "---\ntitle: \"Yellow and violet tones\"\nexcerpt: \"PaperFaces portrait of @rasmusfisker drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rasmusfisker-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rasmusfisker-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rasmusfisker](https://twitter.com/rasmusfisker).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-13-slace-portrait.md",
    "content": "---\ntitle: \"In a hat\"\nexcerpt: \"PaperFaces portrait of @slace drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-slace-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-slace-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@slace](https://twitter.com/slace).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-17-genevasands-portrait.md",
    "content": "---\ntitle: \"Long hair wearing a striped shirt\"\nexcerpt: \"PaperFaces portrait of @genevasands drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-genevasands-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-genevasands-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@genevasands](https://twitter.com/genevasands).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-17-melaniejcooke-portrait.md",
    "content": "---\ntitle: \"Long hair and red lipstick\"\nexcerpt: \"PaperFaces portrait of @melaniejcooke drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-melaniejcooke-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-melaniejcooke-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@melaniejcooke](https://twitter.com/melaniejcooke).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-17-rudy-portrait.md",
    "content": "---\ntitle: \"In a black motorcycle jacket\"\nexcerpt: \"PaperFaces portrait of Rudy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rudy.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rudy-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nCommissioned portrait of \"Rudy\".\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube jP7X4ELctX8 %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-17-shinfu-portrait.md",
    "content": "---\ntitle: \"Jumping really high in the blue sky\"\nexcerpt: \"PaperFaces portrait of @Shinfu drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-shinfu-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-shinfu-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@Shinfu](https://twitter.com/Shinfu) jumping really high in a blue sky landscape.\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube eg7iMJTe_U0 %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-17-vragal-portrait.md",
    "content": "---\ntitle: \"In a gray hoodie\"\nexcerpt: \"PaperFaces portrait of @Vragal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vragal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vragal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Vragal](https://twitter.com/Vragal).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-20-miemzzz-portrait.md",
    "content": "---\ntitle: \"MiemZzz Drawn in Black and White\"\nexcerpt: \"PaperFaces portrait of @MiemZzz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-miemzzz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-miemzzz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@MiemZzz](https://twitter.com/MiemZzz).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-20-oog-portrait.md",
    "content": "---\ntitle: \"In shadows, black and white\"\nexcerpt: \"PaperFaces portrait of @Oog drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-oog-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-oog-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@Oog](https://twitter.com/Oog).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube bHp3aHMQxA0 %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-23-cynthia-2-portrait.md",
    "content": "---\ntitle: \"Long hair in grayscale\"\nexcerpt: \"PaperFaces portrait of @cynthia drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cynthia-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cynthia-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cynthia](https://twitter.com/cynthia).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-23-gimmeapuck-portrait.md",
    "content": "---\ntitle: \"In sunglasses\"\nexcerpt: \"PaperFaces portrait of @gimmeapuck drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gimmeapuck-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gimmeapuck-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@gimmeapuck](https://twitter.com/gimmeapuck).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-23-guy1067-portrait.md",
    "content": "---\ntitle: \"Light orange toned background\"\nexcerpt: \"PaperFaces portrait of @guy1067 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-guy1067-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-guy1067-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@guy1067](https://twitter.com/guy1067).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-23-parisba-2-portrait.md",
    "content": "---\ntitle: \"In a hat, but not a cowboy\"\nexcerpt: \"PaperFaces portrait of @parisba drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-parisba-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-parisba-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@parisba](https://twitter.com/parisba).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-25-bradykent-portrait.md",
    "content": "---\ntitle: \"Plaid in front of some architecture\"\nexcerpt: \"PaperFaces portrait of @bradykent drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bradykent-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bradykent-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of [@bradykent](https://twitter.com/bradykent).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube M5Ya9B-a0Mk %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-25-jamesonroot-portrait.md",
    "content": "---\ntitle: \"Couple in front of water\"\nexcerpt: \"PaperFaces portrait of @jamesonroot drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jamesonroot-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jamesonroot-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@jamesonroot](https://twitter.com/jamesonroot).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-25-ryandawidjan-portrait.md",
    "content": "---\ntitle: \"Suit in a landscape\"\nexcerpt: \"PaperFaces portrait of @ryandawidjan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ryandawidjan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ryandawidjan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@ryandawidjan](https://twitter.com/ryandawidjan).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube OhQJoyX-t0w %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-28-andrewjbryk-portrait.md",
    "content": "---\ntitle: \"Three boys sitting side by side\"\nexcerpt: \"PaperFaces portrait of @andrewjbryk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andrewjbryk-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andrewjbryk-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait for project donator [@andrewjbryk](https://twitter.com/andrewjbryk).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-28-b-sheehan-portrait.md",
    "content": "---\ntitle: \"Fire fighter\"\nexcerpt: \"PaperFaces portrait of @B_Sheehan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-b-sheehan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-b-sheehan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@B_Sheehan](https://twitter.com/B_Sheehan).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-28-coffeeplz-portrait.md",
    "content": "---\ntitle: \"3/4 pose\"\nexcerpt: \"PaperFaces portrait of @Coffeeplz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-coffeeplz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-coffeeplz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Coffeeplz](https://twitter.com/Coffeeplz).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-01-28-kyle-bridget-portrait.md",
    "content": "---\ntitle: \"Happy couple sitting on the grass\"\nexcerpt: \"PaperFaces portrait of Kyle and Bridget drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kyle-bridget.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kyle-bridget-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator Kyle and Bridget.\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube wWHJPy9FIhA %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-01-juanrod82-portrait.md",
    "content": "---\ntitle: \"Happy couple and their two dogs\"\nexcerpt: \"PaperFaces portrait of @juanrod82 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-juanrod82-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-juanrod82-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@juanrod82](https://twitter.com/juanrod82).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube ao7naXkW72Y %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-01-manjumadhav93-portrait.md",
    "content": "---\ntitle: \"Sunglasses chilling in the street\"\nexcerpt: \"PaperFaces portrait of @manjumadhav93 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-manjumadhav93-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-manjumadhav93-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@manjumadhav93](https://twitter.com/manjumadhav93).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-01-nick-aylward-portrait.md",
    "content": "---\ntitle: \"Guy and his gal in Washington DC\"\nexcerpt: \"PaperFaces portrait of @nick-aylward drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nick-aylward-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nick-aylward-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@nick_aylward](https://twitter.com/nick_aylward).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-01-shamaiela-portrait.md",
    "content": "---\ntitle: \"Long hair against a bright red background\"\nexcerpt: \"PaperFaces portrait of @shamaiela drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-shamaiela-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-shamaiela-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@shamaiela](https://twitter.com/shamaiela).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-01-sjr-online-portrait.md",
    "content": "---\ntitle: \"Black and white 3/4 view\"\nexcerpt: \"PaperFaces portrait of @SJR_online drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sjr-online-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sjr-online-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@SJR_online](https://twitter.com/SJR_online).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-01-slaunchaman-portrait.md",
    "content": "---\ntitle: \"Purple long sleeve dress shirt\"\nexcerpt: \"PaperFaces portrait of @slaunchaman drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-slaunchaman-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-slaunchaman-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@slaunchaman](https://twitter.com/slaunchaman).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-06-antoninygaard-portrait.md",
    "content": "---\ntitle: \"In front of an ornate frame and candle holder\"\nexcerpt: \"PaperFaces portrait of @antoninygaard drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-antoninygaard-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-antoninygaard-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@antoninygaard](https://twitter.com/antoninygaard).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-06-justkimolly-portrait.md",
    "content": "---\ntitle: \"Sunglasses in black and white\"\nexcerpt: \"PaperFaces portrait of @justkimolly drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-justkimolly-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-justkimolly-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@justkimolly](https://twitter.com/justkimolly).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-06-lisablackler-portrait.md",
    "content": "---\ntitle: \"Pink and bright violet tones\"\nexcerpt: \"PaperFaces portrait of @Lisablackler drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lisablackler-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lisablackler-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Lisablackler](https://twitter.com/Lisablackler).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-06-padulantonio-portrait.md",
    "content": "---\ntitle: \"Dramatic looking gray bricks\"\nexcerpt: \"PaperFaces portrait of @padulantonio drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-padulantonio-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-padulantonio-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@padulantonio](https://twitter.com/padulantonio).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-06-pichfl-portrait.md",
    "content": "---\ntitle: \"Glasses wearing a plaid scarf\"\nexcerpt: \"PaperFaces portrait of @pichfl drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pichfl-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pichfl-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@pichfl](https://twitter.com/pichfl).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-06-rt44man-portrait.md",
    "content": "---\ntitle: \"Plaid shirt leaning against a blue wall\"\nexcerpt: \"PaperFaces portrait of @Rt44man drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rt44man-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rt44man-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Rt44man](https://twitter.com/Rt44man).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-07-jamesiii-portrait.md",
    "content": "---\ntitle: \"The king has risen\"\nexcerpt: \"PaperFaces portrait of @jamesIII drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jamesiii-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jamesiii-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@jamesIII](https://twitter.com/jamesIII).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube ntWqGHiApsE %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-08-ihamzadev-portrait.md",
    "content": "---\ntitle: \"Glasses with red headphones\"\nexcerpt: \"PaperFaces portrait of @ihamzadev drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ihamzadev-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ihamzadev-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ihamzadev](https://twitter.com/ihamzadev).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-12-jupiter909-portrait.md",
    "content": "---\ntitle: \"Playing strings in the forest\"\nexcerpt: \"PaperFaces portrait of @jupiter909 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jupiter909-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jupiter909-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@jupiter909](https://twitter.com/jupiter909).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-12-sbach-portrait.md",
    "content": "---\ntitle: \"Dark jacket looking downward\"\nexcerpt: \"PaperFaces portrait of @sbach drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sbach-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sbach-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sbach](https://twitter.com/sbach).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-12-tr4y-portrait.md",
    "content": "---\ntitle: \"S basecball cap in black and white\"\nexcerpt: \"PaperFaces portrait of @tr4y drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tr4y-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tr4y-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@tr4y](https://twitter.com/tr4y).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-17-generala-ron-portrait.md",
    "content": "---\ntitle: \"Tony Stark look-a-like\"\nexcerpt: \"PaperFaces portrait of @GeneralA_Ron-ron drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-generala-ron-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-generala-ron-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@GeneralA_Ron](https://twitter.com/GeneralA_Ron).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-17-kendallina-portrait.md",
    "content": "---\ntitle: \"High contrast beautiful long hair\"\nexcerpt: \"PaperFaces portrait of @kendallina drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kendallina-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kendallina-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@kendallina](https://twitter.com/kendallina).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-17-mscynthialee-portrait.md",
    "content": "---\ntitle: \"Long black hair and dark clothing\"\nexcerpt: \"PaperFaces portrait of @mscynthialee-ron drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mscynthialee-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mscynthialee-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mscynthialee](https://twitter.com/mscynthialee).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-17-vmasto-2-portrait.md",
    "content": "---\ntitle: \"V-neck in black and white\"\nexcerpt: \"PaperFaces portrait of @vmasto drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vmasto-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vmasto-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@vmasto](https://twitter.com/vmasto).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube -Y9tUzWIcGs %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-17-vmasto-portrait.md",
    "content": "---\ntitle: \"Beard in golden yellow tones\"\nexcerpt: \"PaperFaces portrait of @vmasto drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vmasto-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vmasto-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@vmasto](https://twitter.com/vmasto).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-20-doertedev-portrait.md",
    "content": "---\ntitle: \"More metal than a toaster\"\nexcerpt: \"PaperFaces portrait of @doertedev drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-doertedev-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-doertedev-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@doertedev](https://twitter.com/doertedev).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-20-ijango-portrait.md",
    "content": "---\ntitle: \"Van dyke moustachio drinking cat\"\nexcerpt: \"PaperFaces portrait of @ijango drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ijango-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ijango-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@ijango](https://twitter.com/ijango).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube 9XA2_0nysm8 %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-20-itonus-portrait.md",
    "content": "---\ntitle: \"Bowtie and nerd glasses\"\nexcerpt: \"PaperFaces portrait of @itonus-ron drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-itonus-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-itonus-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@itonus](https://twitter.com/itonus).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-20-mlucus-portrait.md",
    "content": "---\ntitle: \"Blonde up against a dark red background\"\nexcerpt: \"PaperFaces portrait of @mlucus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mlucus-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mlucus-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mlucus](https://twitter.com/mlucus).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-20-neikura-portrait.md",
    "content": "---\ntitle: \"Long hair purple and red highlights\"\nexcerpt: \"PaperFaces portrait of @neikura drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-neikura-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-neikura-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@neikura](https://twitter.com/neikura).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-26-cliquesaurus-portrait.md",
    "content": "---\ntitle: \"Pink hoodie hearted hand\"\nexcerpt: \"PaperFaces portrait of @cliqueasaurus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cliqueasaurus-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cliqueasaurus-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cliqueasaurus](https://twitter.com/cliqueasaurus).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-26-designhawg-portrait.md",
    "content": "---\ntitle: \"Large goggles in black and white\"\nexcerpt: \"PaperFaces portrait of @designhawg drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-designhawg-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-designhawg-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@designhawg](https://twitter.com/designhawg).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-26-josephdjohn-portrait.md",
    "content": "---\ntitle: \"Winter wonderland couple outside\"\nexcerpt: \"PaperFaces portrait of @josephedjohn drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-josephedjohn-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-josephedjohn-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@josephedjohn](https://twitter.com/josephedjohn).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-26-tinyrach-portrait.md",
    "content": "---\ntitle: \"Rosey cheeks against an illustrative background\"\nexcerpt: \"PaperFaces portrait of @tinyrach drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tinyrach-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tinyrach-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@tinyrach](https://twitter.com/tinyrach).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-02-26-tylr-portrait.md",
    "content": "---\ntitle: \"Mustache sitting in the dark\"\nexcerpt: \"PaperFaces portrait of @tylr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tylr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tylr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@tylr](https://twitter.com/tylr).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-03-danmurillo-portrait.md",
    "content": "---\ntitle: \"In a suit\"\nexcerpt: \"PaperFaces portrait of @danmurillo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-danmurillo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-danmurillo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@danmurillo](https://twitter.com/danmurillo).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-03-fraulein-doktor-portrait.md",
    "content": "---\ntitle: \"Drinking from a red plastic cup\"\nexcerpt: \"PaperFaces portrait of @fraulein_doktor drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fraulein-doktor-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fraulein-doktor-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@fraulein_doktor](https://twitter.com/fraulein_doktor).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-03-kilsey-portrait.md",
    "content": "---\ntitle: \"Bacon mustached\"\nexcerpt: \"PaperFaces portrait of @kilsey drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kilsey-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kilsey-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@kilsey](https://twitter.com/kilsey).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-03-lovisaslife-portrait.md",
    "content": "---\ntitle: \"Long hair and blue striped shirt\"\nexcerpt: \"PaperFaces portrait of @lovisaslife drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lovisaslife-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lovisaslife-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@lovisaslife](https://twitter.com/lovisaslife).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-03-macjaeger-portrait.md",
    "content": "---\ntitle: \"Orange tones\"\nexcerpt: \"PaperFaces portrait of @macjaeger drawn with Paper for iOS on an iPad.\"\nimage:   \n  path: &image /assets/images/paperfaces-macjaeger-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-macjaeger-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@macjaeger](https://twitter.com/macjaeger).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-03-stefanhartwig-portrait.md",
    "content": "---\ntitle: \"Circles behind grayscale\"\nexcerpt: \"PaperFaces portrait of @stefanhartwig drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-stefanhartwig-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-stefanhartwig-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@stefanhartwig](https://twitter.com/stefanhartwig).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-ancratyne-portrait.md",
    "content": "---\ntitle: \"Blue dress curved\"\nexcerpt: \"PaperFaces portrait of @ancratyne drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ancratyne-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ancratyne-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ancratyne](https://twitter.com/ancratyne).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-asinrope-portrait.md",
    "content": "---\ntitle: \"Tight winter hat\"\nexcerpt: \"PaperFaces portrait of @asinrope drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-asinrope-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-asinrope-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@asinrope](https://twitter.com/asinrope).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-dopplegl-portrait.md",
    "content": "---\ntitle: \"Illustrated in purble and blue tones\"\nexcerpt: \"PaperFaces portrait of @dopplegl drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dopplegl-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dopplegl-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@dopplegl](https://twitter.com/dopplegl).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-ferisb-portrait.md",
    "content": "---\ntitle: \"Red and purple illuminated side\"\nexcerpt: \"PaperFaces portrait of @FerisB drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ferisb-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ferisb-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@FerisB](https://twitter.com/FerisB).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-gudmundur-portrait.md",
    "content": "---\ntitle: \"Mouth open in muted tones\"\nexcerpt: \"PaperFaces portrait of @gudmundur drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gudmundur-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gudmundur-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@gudmundur](https://twitter.com/gudmundur).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-missrachilli-portrait.md",
    "content": "---\ntitle: \"Long hair wearing a fashionable scarf\"\nexcerpt: \"PaperFaces portrait of @missrachilli drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-missrachilli-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-missrachilli-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@missrachilli](https://twitter.com/missrachilli).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-n8foo-portrait.md",
    "content": "---\ntitle: \"Holding a camera in front\"\nexcerpt: \"PaperFaces portrait of @n8foo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-n8foo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-n8foo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@n8foo](https://twitter.com/n8foo).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-sdtechgirl-portrait.md",
    "content": "---\ntitle: \"Blonde in the dark cuddling a white pussy cat\"\nexcerpt: \"PaperFaces portrait of @SDTechGirl drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sdtechgirl-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sdtechgirl-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@SDTechGirl](https://twitter.com/SDTechGirl).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-11-togsy-portrait.md",
    "content": "---\ntitle: \"Bug fur hat\"\nexcerpt: \"PaperFaces portrait of @togsy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-togsy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-togsy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@togsy](https://twitter.com/togsy).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-15-agentkyle-portrait.md",
    "content": "---\ntitle: \"Scuba mask underwater\"\nexcerpt: \"PaperFaces portrait of @AgentKyle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-agentkyle-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-agentkyle-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@AgentKyle](https://twitter.com/AgentKyle).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-15-ginacrat-portrait.md",
    "content": "---\ntitle: \"Holding a Twister DVD\"\nexcerpt: \"PaperFaces portrait of @ginacrat drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ginacrat-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ginacrat-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ginacrat](https://twitter.com/ginacrat).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-15-h3pps-portrait.md",
    "content": "---\ntitle: \"Lips in a dull green hoodie\"\nexcerpt: \"PaperFaces portrait of @h3pps drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-h3pps-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-h3pps-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@h3pps](https://twitter.com/h3pps).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-15-hamkate-portrait.md",
    "content": "---\ntitle: \"Hair drawn like fire\"\nexcerpt: \"PaperFaces portrait of @hamkate drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hamkate-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hamkate-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@hamkate](https://twitter.com/hamkate).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-15-lord-faethor-portrait.md",
    "content": "---\ntitle: \"Don't I know this guy from somewhere…\"\nexcerpt: \"PaperFaces portrait of @Lord_Faethor drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lord-faethor-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lord-faethor-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Lord_Faethor](https://twitter.com/Lord_Faethor).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-21-aarongreenlee-portrait.md",
    "content": "---\ntitle: \"Blue Man Group look-a-like\"\nexcerpt: \"PaperFaces portrait of @aarongreenlee drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-aarongreenlee-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-aarongreenlee-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\ncomments: true\n---\n\nPaperFaces portrait of [@aarongreenlee](https://twitter.com/aarongreenlee).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-21-aripalo-portrait.md",
    "content": "---\ntitle: \"Developer slash designer\"\nexcerpt: \"PaperFaces portrait of @aripalo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-aripalo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-aripalo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@aripalo](https://twitter.com/aripalo).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-21-blumentoast-portrait.md",
    "content": "---\ntitle: \"Painted joker smile\"\nexcerpt: \"PaperFaces portrait of @blumentoast drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-blumentoast-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-blumentoast-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\n*Why so serious?* PaperFaces portrait of [@blumentoast](https://twitter.com/blumentoast).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-21-dicappucinos-portrait.md",
    "content": "---\ntitle: \"No eyes, bright red lipstick\"\nexcerpt: \"PaperFaces portrait of @dicappucinos drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dicappucinos-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dicappucinos-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@dicappucinos](https://twitter.com/dicappucinos).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-21-fiips-portrait.md",
    "content": "---\ntitle: \"Cat face bathroom selfie\"\nexcerpt: \"PaperFaces portrait of @Fiips_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fiips-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fiips-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Fiips_](https://twitter.com/Fiips_).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-21-likejunx-portrait.md",
    "content": "---\ntitle: \"Side swept in a  hoodie\"\nexcerpt: \"PaperFaces portrait of @likejunx drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-likejunx-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-likejunx-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@likejunx](https://twitter.com/likejunx).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-21-rdewind151-portrait.md",
    "content": "---\ntitle: \"Knit hat wearing sunglasses\"\nexcerpt: \"PaperFaces portrait of @rdewind151 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rdewind151-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rdewind151-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rdewind151](https://twitter.com/rdewind151).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-26-gattermann-portrait.md",
    "content": "---\ntitle: \"Black and white face in shadow\"\nexcerpt: \"PaperFaces portrait of @gattermann drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gattermann-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gattermann-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@gattermann](https://twitter.com/gattermann).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-26-rwangsa-portrait.md",
    "content": "---\ntitle: \"Backpacking in a scarf\"\nexcerpt: \"PaperFaces portrait of @rwangsa drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rwangsa-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rwangsa-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rwangsa](https://twitter.com/rwangsa).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-26-shamaiela-2-portrait.md",
    "content": "---\ntitle: \"Violets and purples\"\nexcerpt: \"PaperFaces portrait of @Shamaiela drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-shamaiela-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-shamaiela-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Shamaiela](https://twitter.com/Shamaiela).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-26-timonus-portrait.md",
    "content": "---\ntitle: \"Glasses in a washed out palette\"\nexcerpt: \"PaperFaces portrait of @timonus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-timonus-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-timonus-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@timonus](https://twitter.com/timonus).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-26-xshordiex-portrait.md",
    "content": "---\ntitle: \"Against striped walls\"\nexcerpt: \"PaperFaces portrait of @xShordiex drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-xshordiex-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-xshordiex-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@xShordiex](https://twitter.com/xShordiex).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-30-jonarnold-portrait.md",
    "content": "---\ntitle: \"Glasses wearing v-neck\"\nexcerpt: \"PaperFaces portrait of @jonarnold drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jonarnold-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jonarnold-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@jonarnold](https://twitter.com/jonarnold).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-30-pixelgraphix-portrait.md",
    "content": "---\ntitle: \"Red hoodie and glasses in the shadows\"\nexcerpt: \"PaperFaces portrait of @pixelgraphix drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pixelgraphix-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pixelgraphix-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@pixelgraphix](https://twitter.com/pixelgraphix).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-30-ryanfarrellstl-portrait.md",
    "content": "---\ntitle: \"Guy and gal all bloodied up\"\nexcerpt: \"PaperFaces portrait of @RyanFarrellStl drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ryanfarrellstl-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ryanfarrellstl-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@RyanFarrellStl](https://twitter.com/RyanFarrellStl).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-03-30-voidet-portrait.md",
    "content": "---\ntitle: \"Long curly hair in a red scarf\"\nexcerpt: \"PaperFaces portrait of @voidet drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-voidet-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-voidet-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@voidet](https://twitter.com/voidet).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-03-a-erza-portrait.md",
    "content": "---\ntitle: \"Glasses wearing houndstooth\"\nexcerpt: \"PaperFaces portrait of @A_Erza drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-a-erza-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-a-erza-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@A_Erza](https://twitter.com/A_Erza).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-03-gaptone-portrait.md",
    "content": "---\ntitle: \"Beard wearing a bowtie\"\nexcerpt: \"PaperFaces portrait of @gaptone drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gaptone-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gaptone-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@gaptone](https://twitter.com/gaptone).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-03-jpkoudstaal-portrait.md",
    "content": "---\ntitle: \"Slenderman look a like?\"\nexcerpt: \"PaperFaces portrait of @JPKoudstaal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jpkoudstaal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jpkoudstaal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@JPKoudstaal](https://twitter.com/JPKoudstaal).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-10-bookety-portrait.md",
    "content": "---\ntitle: \"Shag cut in plaid\"\nexcerpt: \"PaperFaces portrait of @Bookety drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bookety-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bookety-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Bookety](https://twitter.com/Bookety).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-10-kingspacelaser-portrait.md",
    "content": "---\ntitle: \"Getting grabby at those heart shaped glasses\"\nexcerpt: \"PaperFaces portrait of @KingSpaceLaser drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kingspacelaser-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kingspacelaser-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@KingSpaceLaser](https://twitter.com/KingSpaceLaser).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-10-mstr-dee-portrait.md",
    "content": "---\ntitle: \"Neon green short sleeve shirt\"\nexcerpt: \"PaperFaces portrait of @Mstr_Dee drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mstr-dee-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mstr-dee-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Mstr_Dee](https://twitter.com/Mstr_Dee).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-10-normanholz-portrait.md",
    "content": "---\ntitle: \"In shadows with dramatic lighting\"\nexcerpt: \"PaperFaces portrait of @normanholz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-normanholz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-normanholz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@normanholz](https://twitter.com/normanholz).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-10-soulxheart-portrait.md",
    "content": "---\ntitle: \"Glasses wearing a pair of headphones\"\nexcerpt: \"PaperFaces portrait of @soulxheart drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-soulxheart-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-soulxheart-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@soulxheart](https://twitter.com/soulxheart).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-10-the-wards-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of The In Laws\"\nexcerpt: \"PaperFaces portrait of The In Laws drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-the-wards.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-the-wards-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nOn our wedding day I took a photograph of my in laws. Some years later I used it to create this black and white illustration for a birthday present.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-10-zoecho-portrait.md",
    "content": "---\ntitle: \"Long brown hair\"\nexcerpt: \"PaperFaces portrait of @_ZoeCho drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-zoecho-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-zoecho-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@_ZoeCho](https://twitter.com/_ZoeCho).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-16-alec-eiffel-portrait.md",
    "content": "---\ntitle: \"Shirtless military\"\nexcerpt: \"PaperFaces portrait of Alec Eiffel drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alec-eiffel-facebook.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alec-eiffel-facebook-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nShirtless wearing military helmet in black and white. Drawn for [Selfless Portraits](http://selflessportraits.com).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-16-bjoerndemming-portrait.md",
    "content": "---\ntitle: \"In shadow on an overcast day\"\nexcerpt: \"PaperFaces portrait of @bjoerndemming drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bjoerndemming-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bjoerndemming-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@bjoerndemming](https://twitter.com/bjoerndemming).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-16-charlietuna-portrait.md",
    "content": "---\ntitle: \"Bride and groom posing by a trolley car… I think\"\nexcerpt: \"PaperFaces portrait of @charlietuna drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-charlietuna-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-charlietuna-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@charlietuna](https://twitter.com/charlietuna).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-16-etowow-portrait.md",
    "content": "---\ntitle: \"Restaurant green lights the hair\"\nexcerpt: \"PaperFaces portrait of @etowow drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-etowow-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-etowow-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@etowow](https://twitter.com/etowow).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-16-tylerflowers-portrait.md",
    "content": "---\ntitle: \"Curly hair drawn in sepia tones\"\nexcerpt: \"PaperFaces portrait of @tylerflowers drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tylerflowers-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tylerflowers-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@tylerflowers](https://twitter.com/tylerflowers).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-codeprincess-portrait.md",
    "content": "---\ntitle: \"Glasses in red hair\"\nexcerpt: \"PaperFaces portrait of @codePrincess drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-codeprincess-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-codeprincess-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@codePrincess](https://twitter.com/codePrincess).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-elektrojunge-portrait.md",
    "content": "---\ntitle: \"Tattooed in trees\"\nexcerpt: \"PaperFaces portrait of @Elektrojunge drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-elektrojunge-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-elektrojunge-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Elektrojunge](https://twitter.com/Elektrojunge).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-hergimerc-portrait.md",
    "content": "---\ntitle: \"Pretty sunset\"\nexcerpt: \"PaperFaces portrait of @hergimerc drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hergimerc-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hergimerc-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@hergimerc](https://twitter.com/hergimerc).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-imnk-portrait.md",
    "content": "---\ntitle: \"Grayscale mustache\"\nexcerpt: \"PaperFaces portrait of @imnk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-imnk-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-imnk-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@imnk](https://twitter.com/imnk).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-katebudko-portrait.md",
    "content": "---\ntitle: \"Wearing a cheetah print headband\"\nexcerpt: \"PaperFaces portrait of @katebudko drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-katebudko-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-katebudko-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@katebudko](https://twitter.com/katebudko).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-lsanza-portrait.md",
    "content": "---\ntitle: \"In a blue wintery scene\"\nexcerpt: \"PaperFaces portrait of @lsanza drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lsanza-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lsanza-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@lsanza](https://twitter.com/lsanza).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-missloulouxx-portrait.md",
    "content": "---\ntitle: \"Sideways down on a red leather couch\"\nexcerpt: \"PaperFaces portrait of @MissLoulouxx drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-missloulouxx-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-missloulouxx-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@MissLoulouxx](https://twitter.com/MissLoulouxx).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-pauladamdavis-portrait.md",
    "content": "---\ntitle: \"Mail Chimp shirt at the bowling alley\"\nexcerpt: \"PaperFaces portrait of @pauladamdavis drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pauladamdavis-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pauladamdavis-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@pauladamdavis](https://twitter.com/pauladamdavis).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-rgheissari-portrait.md",
    "content": "---\ntitle: \"Dark hair in gray\"\nexcerpt: \"PaperFaces portrait of @rgheissari drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rgheissari-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rgheissari-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rgheissari](https://twitter.com/rgheissari).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-superlucyj-portrait.md",
    "content": "---\ntitle: \"Blonde hair in red\"\nexcerpt: \"PaperFaces portrait of @superlucyj drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-superlucyj-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-superlucyj-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@superlucyj](https://twitter.com/superlucyj).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-04-26-twe4ked-portrait.md",
    "content": "---\ntitle: \"Faux pipe smoking in a sweet hat\"\nexcerpt: \"PaperFaces portrait of @twe4ked drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-twe4ked-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-twe4ked-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@twe4ked](https://twitter.com/twe4ked).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-01-cthrin-portrait.md",
    "content": "---\ntitle: \"Long hair outside in nature\"\nexcerpt: \"PaperFaces portrait of @cthrin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cthrin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cthrin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cthrin](https://twitter.com/cthrin).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-01-cyrisxd-portrait.md",
    "content": "---\ntitle: \"Blazer and t-shirt\"\nexcerpt: \"PaperFaces portrait of @CyrisXD drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cyrisxd-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cyrisxd-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@CyrisXD](https://twitter.com/CyrisXD).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-01-focusaurus-portrait.md",
    "content": "---\ntitle: \"Pink mohawk\"\nexcerpt: \"PaperFaces portrait of @focusaurus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-focusaurus-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-focusaurus-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@focusaurus](https://twitter.com/focusaurus).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-01-natraybould-portrait.md",
    "content": "---\ntitle: \"Pew Pew Pew!\"\nexcerpt: \"PaperFaces portrait of @NatRaybould drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-natraybould-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-natraybould-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nGlasses shooting lasers. PaperFaces portrait of [@NatRaybould](https://twitter.com/NatRaybould).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-01-taylorotwell-portrait.md",
    "content": "---\ntitle: \"Speaking at a conference\"\nexcerpt: \"PaperFaces portrait of @taylorotwell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-taylorotwell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-taylorotwell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@taylorotwell](https://twitter.com/taylorotwell).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-04-boba-fett-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Boba Fett\"\nexcerpt: \"PaperFaces portrait of Boba Fett drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-boba-fett.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-boba-fett-150.jpg\ncategories: [paperfaces]\ntags: [Star Wars, portrait, illustration, Paper for iOS, time lapse]\n---\n\nStarting Star Wars Day off with a portrait of my dude Boba. May the 4th be with you! Speed painting video is embedded below for your viewing pleasure.\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube XvVoXgxwrMA %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-04-chewbacca-leia-boob-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Chewbacca and Princess Leia\"\nexcerpt: \"PaperFaces portrait of Chewbacca and Princess Leia drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chewbacca-leia-boob.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chewbacca-leia-boob-150.jpg\ncategories: [paperfaces]\ntags: [Star Wars, portrait, illustration, Paper for iOS]\n---\n\nJust for giggles. Because hey, Chewbacca is a perv. *May the 4th be with you!*\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-04-darth-vader-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Darth Vader\"\nexcerpt: \"PaperFaces portrait of Darth Vader drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-darth-vader.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-darth-vader-150.jpg\ncategories: [paperfaces]\ntags: [Star Wars, portrait, illustration, Paper for iOS]\n---\n\nMay the 4th be with you!\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-04-slave-leia-jabba-the-hutt-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Slave Leia and Jabba the Hutt\"\nexcerpt: \"PaperFaces portrait of Slave Leia and Jabba the Hutt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-slave-leia-jabba-the-hutt.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-slave-leia-jabba-the-hutt-150.jpg\ncategories: [paperfaces]\ntags: [Star Wars, portrait, illustration, Paper for iOS]\n---\n\n\"Yang chas Solo chone Wookiee!\" *May the 4th be with you!*\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-04-yoda-luke-skywalker-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Yoda and Luke Skywalker\"\nexcerpt: \"PaperFaces portrait of Yoda and Luke Skywalker drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-yoda-luke-skywalker.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-yoda-luke-skywalker-150.jpg\ncategories: [paperfaces]\ntags: [Star Wars, portrait, illustration, Paper for iOS]\n---\n\nLuke Skywalker training with Jedi Master Yoda down in Nilbog, I mean the Dagoba system. *May the 4th be with you!*\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-05-asthehospturns-portrait.md",
    "content": "---\ntitle: \"Thumbs up Giants\"\nexcerpt: \"PaperFaces portrait of @asthehosptuRNs drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-asthehospturns-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-asthehospturns-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@asthehosptuRNs](https://twitter.com/asthehosptuRNs).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-05-prasad84-portrait.md",
    "content": "---\ntitle: \"Mute colored wall\"\nexcerpt: \"PaperFaces portrait of @prasad84 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-prasad84-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-prasad84-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@prasad84](https://twitter.com/prasad84).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-05-xochristianna-portrait.md",
    "content": "---\ntitle: \"Dressed up all fancy\"\nexcerpt: \"PaperFaces portrait of @xochristianna drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-xochristianna-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-xochristianna-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@xochristianna](https://twitter.com/xochristianna).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-06-du-vs-ich-portrait.md",
    "content": "---\ntitle: \"Long flowing fire hair\"\nexcerpt: \"PaperFaces portrait of @du_vs_ich drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-du-vs-ich-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-du-vs-ich-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@du_vs_ich](https://twitter.com/du_vs_ich). If I drew this two days later, the new zoom tool added to Paper for iOS would have made my life a million times easier when working on the hair.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-07-mmoutenot-portrait.md",
    "content": "---\ntitle: \"Remember to always wear a helmet\"\nexcerpt: \"PaperFaces portrait of @mmoutenot drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mmoutenot-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mmoutenot-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mmoutenot](https://twitter.com/mmoutenot).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-08-iron-man-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Iron Man\"\nexcerpt: \"PaperFaces portrait of Iron Man drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-iron-man-3.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-iron-man-3-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nSaw Iron Man 3 last night and figured I'd challenge myself by drawing the Iron Man himself --- Tony Stark. Those post credit scenes always leave me wanting more Marvel film goodness…\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress sketches.\" class:\"gallery-3-col\" %}\n[![Background complete. Outlining the figure in pencil.](/assets/images/paperfaces-iron-man-3-wip-1-230.jpg)](/assets/images/paperfaces-iron-man-3-wip-1-lg.jpg)\n[![Blocking out shapes with the fountain pen.](/assets/images/paperfaces-iron-man-3-wip-2-230.jpg)](/assets/images/paperfaces-iron-man-3-wip-2-lg.jpg)\n[![Filling in shapes with the marker.](/assets/images/paperfaces-iron-man-3-wip-3-230.jpg)](/assets/images/paperfaces-iron-man-3-wip-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-08-vanessatsmiles-portrait.md",
    "content": "---\ntitle: \"Long hair with a slight curl\"\nexcerpt: \"PaperFaces portrait of @VanessaTSmiles drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vanessatsmiles-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vanessatsmiles-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@VanessaTSmiles](https://twitter.com/VanessaTSmiles). First illustration done with the newly updated Paper for iOS app. Really like how zoom was implemented and the explore feature.\n\nI also recorded my iPad's screen for this portrait that shows the new zoom tool in action. <del>Just have to edit the raw capture in Adobe AfterEffects and then post to YouTube. Should be up soon…</del>\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% youtube PWf4WUoMXwg %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-10-xoalexo-portrait.md",
    "content": "---\ntitle: \"Muted tones in a cozy sweater\"\nexcerpt: \"PaperFaces portrait of @xoalexo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-xoalexo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-xoalexo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@xoalexo](https://twitter.com/xoalexo). So glad FiftyThree added a zoom tool because that [iPad zoom trick](http://chris.pirillo.com/unlock-the-ipad-zoom-feature/) just wasn't cutting it.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-11-garlick-1989-portrait.md",
    "content": "---\ntitle: \"A couple of war paint faces\"\nexcerpt: \"PaperFaces portrait of @Garlick_1989 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-garlick-1989-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-garlick-1989-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Garlick_1989](https://twitter.com/Garlick_1989).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-11-toblr-portrait.md",
    "content": "---\ntitle: \"Hold the iPhone steady as you frame your shot\"\nexcerpt: \"PaperFaces portrait of @toblr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-toblr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-toblr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@toblr](https://twitter.com/toblr).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-12-veganwendy-mothers-day-portrait.md",
    "content": "---\ntitle: \"A Mother's Day PaperFaces portrait of @veganwendy\"\nexcerpt: \"PaperFaces portrait of new mom @veganwendy and twin girls for Mother's Day.\"\nimage: \n  path: &image /assets/images/paperfaces-veganwendy-mothers-day.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-veganwendy-mothers-day-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, twins]\n---\n\n[For her](http://2littlerosebuds.com) first Mother's Day as a new mom, a drawing of my wife and twin girls. Babies without faces kind of look extra creepy huh?\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-14-skinny-whiteguy-portrait.md",
    "content": "---\ntitle: \"Deal with it\"\nexcerpt: \"PaperFaces portrait of @skinny_whiteguy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-skinny-whiteguy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-skinny-whiteguy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@skinny_whiteguy](https://twitter.com/skinny_whiteguy).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-15-christynicol-portrait.md",
    "content": "---\ntitle: \"Put a bird on it\"\nexcerpt: \"PaperFaces portrait of @christynicol drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-christynicol-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-christynicol-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPut a bird on it... or your shoulder in the case of this illustration. PaperFaces portrait of [@christynicol](https://twitter.com/christynicol).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-16-chadtafolla-portrait.md",
    "content": "---\ntitle: \"Scarf beard\"\nexcerpt: \"PaperFaces portrait of @chadtafolla drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chadtafolla-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chadtafolla-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@chadtafolla](https://twitter.com/chadtafolla).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-17-afflictedevents-portrait.md",
    "content": "---\ntitle: \"Goatee reflected glasses\"\nexcerpt: \"PaperFaces portrait of @afflictedevents drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-afflictedevents-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-afflictedevents-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@afflictedevents](https://twitter.com/afflictedevents).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-17-juleshughan-portrait.md",
    "content": "---\ntitle: \"At the salon\"\nexcerpt: \"PaperFaces portrait of @juleshughan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-juleshughan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-juleshughan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@juleshughan](https://twitter.com/juleshughan).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-18-spock-captain-kirk-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Mr. Spock and Captain Kirk\"\nexcerpt: \"PaperFaces portrait of Mr. Spock and Captain Kirk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-spock-kirk-star-trek.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-spock-kirk-star-trek-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nMr. Spock and Captain Kirk --- a scene from the motion picture, **Star Trek Into Darkness**.\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-20-jeffchausse-portrait.md",
    "content": "---\ntitle: \"Grinning in front of a red curtain\"\nexcerpt: \"PaperFaces portrait of @JeffChausse drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jeffchausse-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jeffchausse-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@JeffChausse](https://twitter.com/JeffChausse).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-21-folktrash-portrait.md",
    "content": "---\ntitle: \"Working in grayscale is totally my jam\"\nexcerpt: \"PaperFaces portrait of @folktrash drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-folktrash-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-folktrash-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, black and white]\n---\n\nPaperFaces portrait of [@folktrash](https://twitter.com/folktrash).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-24-johnawells-portrait.md",
    "content": "---\ntitle: \"Kind of looks like Slenderman no?\"\nexcerpt: \"PaperFaces portrait of @johnawells drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-johnawells-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-johnawells-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@johnawells](https://twitter.com/johnawells).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-24-nat-skipper-portrait.md",
    "content": "---\ntitle: \"365th PaperFaces portrait\"\nexcerpt: \"PaperFaces portrait of @Nat_Skipper drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nat-skipper-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nat-skipper-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nHalfway to my goal… PaperFaces portrait of [@Nat_Skipper](https://twitter.com/Nat_Skipper).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-24-sailajak-portrait.md",
    "content": "---\ntitle: \"Blouse made of turquoise\"\nexcerpt: \"PaperFaces portrait of @sailajak drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sailajak-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sailajak-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\naperFaces portrait of [@sailajak](https://twitter.com/sailajak).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-28-evhip10-portrait.md",
    "content": "---\ntitle: \"Glowing glasses made from glowsticks\"\nexcerpt: \"PaperFaces portrait of @EvHip10 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-evhip10-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-evhip10-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@EvHip10](https://twitter.com/EvHip10).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-28-glennsharron-portrait.md",
    "content": "---\ntitle: \"Purple glow\"\nexcerpt: \"PaperFaces portrait of @glennsharron drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-glennsharron-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-glennsharron-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@glennsharron](https://twitter.com/glennsharron).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-28-morgantj-portrait.md",
    "content": "---\ntitle: \"For my next trick…\"\nexcerpt: \"PaperFaces portrait of @morgantj drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-morgantj-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-morgantj-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@morgantj](https://twitter.com/morgantj).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-28-suhairykz-portrait.md",
    "content": "---\ntitle: \"Brightly colored by the sky\"\nexcerpt: \"PaperFaces portrait of @suhairykz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-suhairykz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-suhairykz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@suhairykz](https://twitter.com/suhairykz).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-29-michael-rose-beard-portrait.md",
    "content": "---\ntitle: \"PaperFaces self portrait of Michael Rose\"\nexcerpt: \"PaperFaces portrait of a bearded Michael Rose drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-michael-rose-beard.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-michael-rose-beard-150.jpg\nlast_modified_at: 2013-06-05\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, self portrait]\n---\n\nThirty-four years and still kicking --- a PaperFaces self portrait on my birthday. Loving the new zoom tool that made added small details to my beard fun and painless. Thanks FiftyThree!\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"In process sketching. Rough out shapes with watercolor and define them with pencil.\" class:\"gallery-3-col\" %}\n[![Screenshot. Painting the background with watercolor.](/assets/images/michael-rose-beard-process-1-600.jpg)](/assets/images/michael-rose-beard-process-1-lg.jpg)\n[![Screenshot. Sketching out the figure.](/assets/images/michael-rose-beard-process-2-600.jpg)](/assets/images/michael-rose-beard-process-2-lg.jpg)\n[![Screenshot. Adding detail with watercolor.](/assets/images/michael-rose-beard-process-3-600.jpg)](/assets/images/michael-rose-beard-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"The new zoom tool is a beast and makes adding beard detail fun and easy.\" %}\n[![Screenshot. Adding beard detail with the pencil.](/assets/images/michael-rose-beard-process-4-600.jpg)](/assets/images/michael-rose-beard-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-30-thebrady-khollybell-2-portrait.md",
    "content": "---\ntitle: \"She said yes\"\nexcerpt: \"Engagement PaperFaces portrait of @theBrady and @khollybell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thebrady-khollybell-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thebrady-khollybell-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donators [@theBrady](https://twitter.com/theBrady) and [@khollybell](https://twitter.com/khollybell).\n\nBroke in a [Pogo Connect stylus](http://www.amazon.com/gp/product/B009K448L4/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B009K448L4&linkCode=as2&tag=mademist-20) drawing this illustration and so far really enjoy it. There are some hinky issues with it losing connection or freezing up Paper for iOS, but for the most part it works flawlessly. Being able to control the thickness of watercolor strokes is a major plus, as is the dedicated undo button[^1].\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% youtube SqYiglufb8Y %}\n\n[^1]: Those of you who have problems with or hate the rewind gesture will love the Pogo Connect. Just push the button on the stylus and it undos your most recent marks.\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-05-31-bradersk8r-portrait.md",
    "content": "---\ntitle: \"Overcast day at the beach\"\nexcerpt: \"PaperFaces portrait of @BraderSk8r drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bradersk8r-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bradersk8r-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@BraderSk8r](https://twitter.com/BraderSk8r).\n\n{% include_cached boilerplate/paperfaces.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-01-davglass-portrait.md",
    "content": "---\ntitle: \"Work shirting it\"\nexcerpt: \"PaperFaces portrait of @davglass drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-davglass-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-davglass-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@davglass](https://twitter.com/davglass).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-01-fiftythree-portraits.md",
    "content": "---\ntitle: \"A PaperFaces Thank You for FiftyThree\"\nexcerpt: \"PaperFaces portraits of the makers at FiftyThree using Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fiftythree.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fiftythree-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nThank you to everyone at FiftyThree for developing such a fantastic tool for creation. And for building a community around it that inspires me everyday to create. Here's a small token of my appreciation in the only way I know --- faces without faces of all the makers.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-03-cruz-ce-portrait.md",
    "content": "---\ntitle: \"Long hair near them stairs\"\nexcerpt: \"PaperFaces portrait of @cruz_ce drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cruz-ce-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cruz-ce-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@cruz_ce](https://twitter.com/cruz_ce).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-03-ginader-portrait.md",
    "content": "---\ntitle: \"Floating head in grayscale\"\nexcerpt: \"PaperFaces portrait of @ginader drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ginader-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ginader-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@ginader](https://twitter.com/ginader).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-03-joeavella-portrait.md",
    "content": "---\ntitle: \"Look up, graffiti wall and sunglasses\"\nexcerpt: \"PaperFaces portrait of @joeavella drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joeavella-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joeavella-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@joeavella](https://twitter.com/joeavella).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-04-grategatsby-portrait.md",
    "content": "---\ntitle: \"Brand New shirt pulling a light switch\"\nexcerpt: \"PaperFaces portrait of @Grategatsby drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-grategatsby-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-grategatsby-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Grategatsby](https://twitter.com/Grategatsby).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-05-go-master-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of a Go master\"\nexcerpt: \"PaperFaces portrait of a Go master drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-go-master.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-go-master-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\n**Project Donator** [@brianjolive](https://twitter.com/brianjolive) commissioned this portrait of his great friend and long time teacher of *Go*. Below are some in process screen captures over the course of an hour as I worked on the illustration. Let me just say this, drawing straight lines on glass and getting the correct perspective isn't easy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Laying down a base coat of watercolor using pencil to outline the game board and figure.\" %}\n[![](/assets/images/paperfaces-go-master-process-1-600.jpg)](/assets/images/paperfaces-go-master-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Building the foreground with layers of watercolor and pencil. I find that using lighter colors painted with 3--4 coats produces better results than one medium to dark coat.\" class:\"gallery-2-col\" %}\n[![Building the foreground with layers of watercolor and pencil.](/assets/images/paperfaces-go-master-process-2-600.jpg)](/assets/images/paperfaces-go-master-process-2-lg.jpg)\n[![Building the foreground with layers of watercolor and pencil.](/assets/images/paperfaces-go-master-process-3-600.jpg)](/assets/images/paperfaces-go-master-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Adding foreground and background elements like the stacks of paper and game pieces. The zoom tool was especially helpful when drawing each piece and allowed for accurate placement on the game board.\" class:\"gallery-2-col\" %}\n[![Adding detail with the pencil tool.](/assets/images/paperfaces-go-master-process-4-600.jpg)](/assets/images/paperfaces-go-master-process-4-lg.jpg)\n[![Using the zoom tool to draw the black and white game pieces.](/assets/images/paperfaces-go-master-process-5-600.jpg)](/assets/images/paperfaces-go-master-process-5-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Adding highlights and filling in the blue shirt with the pencil --- starting light and darkening with watercolor along the way.\" class:\"gallery-2-col\" %}\n[![Adding highlights to the game pieces.](/assets/images/paperfaces-go-master-process-6-600.jpg)](/assets/images/paperfaces-go-master-process-6-lg.jpg)\n[![Blocking out the figure using the pencil.](/assets/images/paperfaces-go-master-process-7-600.jpg)](/assets/images/paperfaces-go-master-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-06-lulomx-portrait.md",
    "content": "---\ntitle: \"I am from the future, Google Glass\"\nexcerpt: \"PaperFaces portrait of @lulomx drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lulomx-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lulomx-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@lulomx](https://twitter.com/lulomx).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-10-benbrignell-portrait.md",
    "content": "---\ntitle: \"Please excuse the face, sometimes I draw them\"\nexcerpt: \"PaperFaces portrait of @benbrignell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-benbrignell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-benbrignell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@benbrignell](https://twitter.com/benbrignell).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Blocking out facial features and gradually adding tones using the watercolor brush.\" class:\"gallery-2-col\" %}\n[![Adding detail with the pencil tool.](/assets/images/paperfaces-benbrignell-process-1-600.jpg)](/assets/images/paperfaces-benbrignell-process-1-lg.jpg)\n[![Using the zoom tool to draw the black and white game pieces.](/assets/images/paperfaces-benbrignell-process-2-600.jpg)](/assets/images/paperfaces-benbrignell-process-2-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Adding detail and refining edges using the pencil and zoom tools.\" class:\"gallery-2-col\" %}\n[![Adding detail with the pencil tool.](/assets/images/paperfaces-benbrignell-process-3-600.jpg)](/assets/images/paperfaces-benbrignell-process-3-lg.jpg)\n[![Using the zoom tool to draw the black and white game pieces.](/assets/images/paperfaces-benbrignell-process-4-600.jpg)](/assets/images/paperfaces-benbrignell-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-10-caziebaby-portrait.md",
    "content": "---\ntitle: \"Hey, my eyes are up here!\"\nexcerpt: \"PaperFaces portrait of @caziebaby drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-caziebaby-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-caziebaby-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, tattoo]\n---\n\nPaperFaces portrait of [@caziebaby](https://twitter.com/caziebaby).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-10-jakemoore-portrait.md",
    "content": "---\ntitle: \"Sun lights the hair in a bokeh filled afternoon\"\nexcerpt: \"PaperFaces portrait of @JakeMoore drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jakemoore-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jakemoore-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait of [@JakeMoore](https://twitter.com/JakeMoore).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-10-mishcrashh-portrait.md",
    "content": "---\ntitle: \"Long hair in a dark room\"\nexcerpt: \"PaperFaces portrait of @mishcrashh drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mishcrashh-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mishcrashh-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mishcrashh](https://twitter.com/mishcrashh).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-10-pepkapepich-portrait.md",
    "content": "---\ntitle: \"Shirt and tie in black and white\"\nexcerpt: \"PaperFaces portrait of @PepkaPepich drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pepkapepich-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pepkapepich-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@PepkaPepich](https://twitter.com/PepkaPepich).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-10-vidalia-portrait.md",
    "content": "---\ntitle: \"Hungry for a knuckle sandwich?\"\nexcerpt: \"PaperFaces portrait of @Vidalia drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vidalia-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vidalia-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Vidalia](https://twitter.com/Vidalia).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-11-mates-of-state-portrait.md",
    "content": "---\ntitle: \"PaperFaces portrait of Mates of State\"\nexcerpt: \"PaperFaces portrait of Mates of State drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mates-of-state.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mates-of-state-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nKorie and Jason from the band Mates of State. Drawn predominantly with the pencil tool on a light orange background, with a hint of watercolor.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-14-andy-h-portrait.md",
    "content": "---\ntitle: \"Eye eye captain\"\nexcerpt: \"PaperFaces portrait of @_andy_h_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andy-h-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andy-h-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@_andy_h_](https://twitter.com/_andy_h_).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-14-lovesweetsex-portrait.md",
    "content": "---\ntitle: \"Blanket party with puppy\"\nexcerpt: \"PaperFaces portrait of @lovesweetsex drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lovesweetsex-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lovesweetsex-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@lovesweetsex](https://twitter.com/lovesweetsex).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Using the pencil to lightly outline the figure before painting.\" class:\"gallery-2-col\" %}\n[![Drawing lightly with the pencil](/assets/images/paperfaces-lovesweetsex-process-1-600.jpg)](/assets/images/paperfaces-lovesweetsex-process-1-lg.jpg)\n[![Blocking out the background with watercolor](/assets/images/paperfaces-lovesweetsex-process-2-600.jpg)](/assets/images/paperfaces-lovesweetsex-process-2-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Blocking out facial features and gradually adding tones using the watercolor brush.\" class:\"gallery-2-col\" %}\n[![Painting the face with a dull red](/assets/images/paperfaces-lovesweetsex-process-3-600.jpg)](/assets/images/paperfaces-lovesweetsex-process-3-lg.jpg)\n[![Adding a base coat of black to shape hair](/assets/images/paperfaces-lovesweetsex-process-4-600.jpg)](/assets/images/paperfaces-lovesweetsex-process-4-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Adding more watercolor layers and refining edges with the pencil.\" class:\"gallery-2-col\" %}\n[![Building shadows with gray](/assets/images/paperfaces-lovesweetsex-process-5-600.jpg)](/assets/images/paperfaces-lovesweetsex-process-5-lg.jpg)\n[![Adding hair highlights with the pencil](/assets/images/paperfaces-lovesweetsex-process-6-600.jpg)](/assets/images/paperfaces-lovesweetsex-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-14-who-her-portrait.md",
    "content": "---\ntitle: \"Orange and blue\"\nexcerpt: \"PaperFaces portrait of @Who_Her drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-who-her-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-who-her-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nOrange and blue are complementary colors. PaperFaces portrait of [@Who_Her](https://twitter.com/Who_Her).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-17-idpro-portrait.md",
    "content": "---\ntitle: \"Winking, but you can't tell\"\nexcerpt: \"PaperFaces portrait of @idPro drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-idpro-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-idpro-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nOops, I didn't paint any eyes. PaperFaces portrait of [@idPro](https://twitter.com/idPro).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-17-minormiracle-portrait.md",
    "content": "---\ntitle: \"Nose ring smirk\"\nexcerpt: \"PaperFaces portrait of @minormiracle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-minormiracle-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-minormiracle-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@minormiracle](https://twitter.com/minormiracle).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-17-studioprisoner-portrait.md",
    "content": "---\ntitle: \"Horse head drinky the beer\"\nexcerpt: \"PaperFaces portrait of @studioprisoner drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-studioprisoner-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-studioprisoner-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@studioprisoner](https://twitter.com/studioprisoner).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-18-hepikkat-portrait.md",
    "content": "---\ntitle: \"Neon look of blue and green\"\nexcerpt: \"PaperFaces portrait of @hepikkat drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hepikkat-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hepikkat-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@hepikkat](https://twitter.com/hepikkat).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-19-dismanntled-portrait.md",
    "content": "---\ntitle: \"Using your imagination to see a smile\"\nexcerpt: \"PaperFaces portrait of @dismanntled drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dismanntled-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dismanntled-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@dismanntled](https://twitter.com/dismanntled).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshot. Sketching out the body.\" %}\n![In process screenshot](/assets/images/paperfaces-dismanntled-process-1-600.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-20-alfredormz-portrait.md",
    "content": "---\ntitle: \"On the gray everything is enhanced\"\nexcerpt: \"PaperFaces portrait of @alfredormz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alfredormz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alfredormz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@alfredormz](https://twitter.com/alfredormz).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-21-gustafsonlisa-portrait.md",
    "content": "---\ntitle: \"Long hair in black and white\"\nexcerpt: \"PaperFaces portrait of @Gustafsonlisa drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gustafsonlisa-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gustafsonlisa-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Gustafsonlisa](https://twitter.com/Gustafsonlisa). For you Instagram lovers out there I shot a [15 second time lapse](http://instagram.com/p/azMK1xgU09/) using the new video feature added yesterday to the app. I'll probably experiment with it some more and record work in process sketches if I can get the iPad's screen to look less reflective.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-24-invalididentity-portrait.md",
    "content": "---\ntitle: \"Blue tinted eye\"\nexcerpt: \"PaperFaces portrait of @invalididentity drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-invalididentity-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-invalididentity-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@invalididentity](https://twitter.com/invalididentity). Another eye closeup for your viewing pleasure.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-24-jmkcc-portrait.md",
    "content": "---\ntitle: \"Look up, the sky is falling\"\nexcerpt: \"PaperFaces portrait of @jmkcc drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jmkcc-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jmkcc-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@jmkcc](https://twitter.com/jmkcc). Skyscapes are some of my favorite scapes to draw with Paper for iOS.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-24-nikkiccross-portrait.md",
    "content": "---\ntitle: \"All flipped up\"\nexcerpt: \"PaperFaces portrait of @nikkiccross drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nikkiccross-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nikkiccross-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@nikkiccross](https://twitter.com/nikkiccross).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-26-endouz-portrait.md",
    "content": "---\ntitle: \"Flickering lights of rain\"\nexcerpt: \"PaperFaces portrait of @endouz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-endouz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-endouz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait of [@endouz](https://twitter.com/endouz). Using white to paint lights that could be rain drop refractions… or not.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"I start each drawing the same way, backgrounds first y'all.\" %}\n[![Background in process screenshot](/assets/images/paperfaces-endouz-process-1-600.jpg)](/assets/images/paperfaces-endouz-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Outline the face in pencil and then block it out with a variation of white.\" class:\"gallery-3-col\" %}\n[![In process screenshot](/assets/images/paperfaces-endouz-process-2-600.jpg)](/assets/images/paperfaces-endouz-process-2-lg.jpg)\n[![In process screenshot](/assets/images/paperfaces-endouz-process-3-600.jpg)](/assets/images/paperfaces-endouz-process-3-lg.jpg)\n[![In process screenshot](/assets/images/paperfaces-endouz-process-4-600.jpg)](/assets/images/paperfaces-endouz-process-4-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"You know the drill. Pencil for refinement, watercolor for shading.\" class:\"gallery-3-col\" %}\n[![In process screenshot](/assets/images/paperfaces-endouz-process-5-600.jpg)](/assets/images/paperfaces-endouz-process-5-lg.jpg)\n[![In process screenshot](/assets/images/paperfaces-endouz-process-6-600.jpg)](/assets/images/paperfaces-endouz-process-6-lg.jpg)\n[![In process screenshot](/assets/images/paperfaces-endouz-process-7-600.jpg)](/assets/images/paperfaces-endouz-process-7-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Block in clothing with the fountain pen and marker tools and apply any shadows with gradual applications of watercolor.\" %}\n[![In process screenshot](/assets/images/paperfaces-endouz-process-8-600.jpg)](/assets/images/paperfaces-endouz-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-26-joelmartinez-2-portrait.md",
    "content": "---\ntitle: \"Wind blowing blue green skies\"\nexcerpt: \"PaperFaces portrait of @joelmartinez drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joelmartinez-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joelmartinez-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, time lapse]\n---\n\nPaperFaces portrait of project donator [@joelmartinez](https://twitter.com/joelmartinez). Check out the making of video capture below where I compress a hour's worth of drawing in Paper for iOS into 5 minutes.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% youtube WjmQYBgHjFI %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-28-bobbydharrell-portrait.md",
    "content": "---\ntitle: \"Hats in a car\"\nexcerpt: \"PaperFaces portrait of @bobbydharrell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bobbydharrell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bobbydharrell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of project donator [@bobbydharrell](https://twitter.com/bobbydharrell).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Tried something different this time. Roughed out the face first using a pencil and then started on the background. Usually I approach an illustration the other way around but really wanted to nail the face this time.\" class:\"gallery-2-col\" %}\n[![In process screenshot](/assets/images/paperfaces-bobbydharrell-process-1-600.jpg)](/assets/images/paperfaces-bobbydharrell-process-1-lg.jpg)\n[![In process screenshot](/assets/images/paperfaces-bobbydharrell-process-2-600.jpg)](/assets/images/paperfaces-bobbydharrell-process-2-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Rendering the face with various shades of gray and dull and dirty reds.\" class:\"gallery-2-col\" %}\n[![In process screenshot](/assets/images/paperfaces-bobbydharrell-process-3-600.jpg)](/assets/images/paperfaces-bobbydharrell-process-3-lg.jpg)\n[![In process screenshot](/assets/images/paperfaces-bobbydharrell-process-4-600.jpg)](/assets/images/paperfaces-bobbydharrell-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-06-28-sironfoot-portrait.md",
    "content": "---\ntitle: \"Some sort of furry\"\nexcerpt: \"PaperFaces of @sironfoot's avatar drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sironfoot-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sironfoot-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sironfoot's](https://twitter.com/sironfoot) avatar. I think this is a hamster, but the lack of ears has me unsure. Drawing all the fuzzy fur sure was fun.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Working on the background first, before I draw in the little guy.\" %}\n[![In process screenshot](/assets/images/paperfaces-sironfoot-process-600.jpg)](/assets/images/paperfaces-sironfoot-process-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-01-josearato-portrait.md",
    "content": "---\ntitle: \"No eyes, 95% face\"\nexcerpt: \"PaperFaces portrait of @josearato drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-josearato-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-josearato-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of project donator [@josearato](https://twitter.com/josearato). Why did I almost draw the entire face this team --- because well, I had to leave something unfinished.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Lightly sketch out the composition to act as a guide for painting with watercolor.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-josearato-process-1-600.jpg)](/assets/images/paperfaces-josearato-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Render the face gradually and move quickly to soften each stroke. Use the pencil to tighten up edges and add shadows in small places.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-josearato-process-2-600.jpg)](/assets/images/paperfaces-josearato-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-josearato-process-3-600.jpg)](/assets/images/paperfaces-josearato-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"No need to be precise with lighter base coats in the face. You can always refine later when painting in the clothing.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-josearato-process-4-600.jpg)](/assets/images/paperfaces-josearato-process-4-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Short quick pencil marks can make for convincing facial hair. Pinch to zoom in and work dark to light from the edge in.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-josearato-process-5-600.jpg)](/assets/images/paperfaces-josearato-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-01-m7z-portrait.md",
    "content": "---\ntitle: \"Faking light leakages and green hats\"\nexcerpt: \"PaperFaces portrait of @m7z drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-m7z-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-m7z-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@m7z](https://twitter.com/m7z). To simulate the light leakage vintage effect on the right, I layered orange and yellow watercolor strokes over each other --- the more layers, the richer the color.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-01-mikkelmarius-portrait.md",
    "content": "---\ntitle: \"Busy streets drawn less chaotic\"\nexcerpt: \"PaperFaces portrait of @mikkelmarius drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mikkelmarius-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mikkelmarius-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mikkelmarius](https://twitter.com/mikkelmarius).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-01-web-martin-portrait.md",
    "content": "---\ntitle: \"Blurring backgrounds and curling hair\"\nexcerpt: \"PaperFaces portrait of @web_martin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-web-martin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-web-martin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@web_martin](https://twitter.com/web_martin).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Use soft quick watercolor strokes layered on top of each other to simulate a blurred background. Helps add contrast to the composition when drawing crisp lines in the figures' hair.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-web-martin-process-1-600.jpg)](/assets/images/paperfaces-web-martin-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Render the face gradually and move quickly to soften each stroke. Apply white as needed to lighten darker tones.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-web-martin-process-2-600.jpg)](/assets/images/paperfaces-web-martin-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-03-alexkaessner-portrait.md",
    "content": "---\ntitle: \"Full half face\"\nexcerpt: \"PaperFaces portrait of @alexkaessner drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alexkaessner-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alexkaessner-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@alexkaessner](https://twitter.com/alexkaessner). On occasion, I'll attempt a more detailed portrait that actually includes an eye, a nose, or a mouth. It's easier to fake being an artist when you only half to draw half… \n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-03-pcperini-portrait.md",
    "content": "---\ntitle: \"Ghost faces by spiraling staircases\"\nexcerpt: \"PaperFaces portrait of @pcperini drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pcperini-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pcperini-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@pcperini](https://twitter.com/pcperini). Perspective might be off and if you tried to walk up these stairs I'm sure you'd fall on your face.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-06-jin-woojooin-portrait.md",
    "content": "---\ntitle: \"Holding a bottle by a wall of orange light\"\nexcerpt: \"PaperFaces portrait of @JIN_woojooin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jin-woojooin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jin-woojooin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@JIN_woojooin](https://twitter.com/JIN_woojooin).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Lightly outlining the face before using watercolor to render forms.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jin-woojooin-process-1-600.jpg)](/assets/images/paperfaces-jin-woojooin-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Watercolor all day everyday. Using a Pogo Connect pen stylus let's you taper edges like you never thought possible.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jin-woojooin-process-2-600.jpg)](/assets/images/paperfaces-jin-woojooin-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jin-woojooin-process-3-600.jpg)](/assets/images/paperfaces-jin-woojooin-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jin-woojooin-process-4-600.jpg)](/assets/images/paperfaces-jin-woojooin-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-06-melissabalkon-portrait.md",
    "content": "---\ntitle: \"Wanna fight?\"\nexcerpt: \"PaperFaces portrait of @melissabalkon drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-melissabalkon-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-melissabalkon-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@melissabalkon](https://twitter.com/melissabalkon) holding a boxing stance.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Drawing in grays is one of my favorite pastimes.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-melissabalkon-process-1-600.jpg)](/assets/images/paperfaces-melissabalkon-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-melissabalkon-process-2-600.jpg)](/assets/images/paperfaces-melissabalkon-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-06-vmalloc-portrait.md",
    "content": "---\ntitle: \"Look ma, I'm a Sim!\"\nexcerpt: \"PaperFaces portrait of @vmalloc drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vmalloc-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vmalloc-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@vmalloc](https://twitter.com/vmalloc).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Lightly outlining the face before using watercolor to render forms.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-vmalloc-process-1-600.jpg)](/assets/images/paperfaces-vmalloc-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"The zoom tool is my friend, let's me use the pencil with greater precision.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-vmalloc-process-2-600.jpg)](/assets/images/paperfaces-vmalloc-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vmalloc-process-3-600.jpg)](/assets/images/paperfaces-vmalloc-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vmalloc-process-4-600.jpg)](/assets/images/paperfaces-vmalloc-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vmalloc-process-5-600.jpg)](/assets/images/paperfaces-vmalloc-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-09-floraworks-portrait.md",
    "content": "---\ntitle: \"Shading hair with blue and magenta\"\nexcerpt: \"PaperFaces portrait of @floraworks drawn with Paper for iOS on an iPad.\"\nimage:   \n  path: &image /assets/images/paperfaces-floraworks-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-floraworks-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@floraworks](https://twitter.com/floraworks).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching and outlining the portrait.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-floraworks-process-1-600.jpg)](/assets/images/paperfaces-floraworks-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-floraworks-process-2-600.jpg)](/assets/images/paperfaces-floraworks-process-2-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Building up the hair one strand at a time.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-floraworks-process-3-600.jpg)](/assets/images/paperfaces-floraworks-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-floraworks-process-4-600.jpg)](/assets/images/paperfaces-floraworks-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-09-mentalground0-portrait.md",
    "content": "---\ntitle: \"Chillin' at the game\"\nexcerpt: \"PaperFaces portrait of @mentalground0 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mentalground0-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mentalground0-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@mentalground0](https://twitter.com/mentalground0).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Quickly sketching things out and laying down some watercolor.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mentalground0-process-1-600.jpg)](/assets/images/paperfaces-mentalground0-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Building up the faces and background with watercolor.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mentalground0-process-2-600.jpg)](/assets/images/paperfaces-mentalground0-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-09-nvshah-portrait.md",
    "content": "---\ntitle: \"Painterly skylines\"\nexcerpt: \"PaperFaces portrait of @nvshah drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nvshah-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nvshah-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@nvshah](https://twitter.com/nvshah).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-11-kayeong15-portrait.md",
    "content": "---\ntitle: \"Rotated the composition\"\nexcerpt: \"PaperFaces portrait of @kayeong15 drawn with Paper for iOS on an iPad.\"\nimage:   \n  path: &image /assets/images/paperfaces-kayeong15-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kayeong15-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@kayeong15](https://twitter.com/kayeong15).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-11-lmichelleinc-portrait.md",
    "content": "---\ntitle: \"Curly hair on the grass\"\nexcerpt: \"PaperFaces portrait of @lmichelleinc drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lmichelleinc-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lmichelleinc-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@lmichelleinc](https://twitter.com/lmichelleinc).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Quick sketch with the pencil tool to solidify the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lmichelleinc-process-1-600.jpg)](/assets/images/paperfaces-lmichelleinc-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Building up the face with watercolor and penciling in grass highlights.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lmichelleinc-process-2-600.jpg)](/assets/images/paperfaces-lmichelleinc-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lmichelleinc-process-3-600.jpg)](/assets/images/paperfaces-lmichelleinc-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Working the hair by lightly drawing curls and wisps in pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lmichelleinc-process-4-600.jpg)](/assets/images/paperfaces-lmichelleinc-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-12-andispringer-portrait.md",
    "content": "---\ntitle: \"Dramatic contrast and a hint of smile\"\nexcerpt: \"PaperFaces portrait of @andispringer drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andispringer-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andispringer-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@andispringer](https://twitter.com/andispringer). If you haven't noticed a theme yet --- I tend to draw a full face when working in black and white.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Quick sketch with the pencil tool to figure out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-andispringer-process-1-600.jpg)](/assets/images/paperfaces-andispringer-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Simple background with layered watercolor strokes to create a vignette effect.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-andispringer-process-2-600.jpg)](/assets/images/paperfaces-andispringer-process-2-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Zooming in to capture facial feature details using a pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-andispringer-process-3-600.jpg)](/assets/images/paperfaces-andispringer-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-15-jhummel-portrait.md",
    "content": "---\ntitle: \"Posterization\"\nexcerpt: \"PaperFaces portrait of @jhummel drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jhummel-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jhummel-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@jhummel](https://twitter.com/jhummel).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Started by filling the background with black and then sketching over it in white. If I made a mistake or didn't like the shape of a line I used black to *erase* it.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jhummel-process-1-600.jpg)](/assets/images/paperfaces-jhummel-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"If you mix enough white into a color it because opaque and can *erase* the color beneath.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jhummel-process-2-600.jpg)](/assets/images/paperfaces-jhummel-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-15-leviwintering-portrait.md",
    "content": "---\ntitle: \"A full face in low contrast\"\nexcerpt: \"PaperFaces portrait of @leviwintering drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-leviwintering-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-leviwintering-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@leviwintering](https://twitter.com/leviwintering).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-15-miriamchadwick-portrait.md",
    "content": "---\ntitle: \"Curly hair in a knit hat\"\nexcerpt: \"PaperFaces portrait of @miriamchadwick drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-miriamchadwick-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-miriamchadwick-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@miriamchadwick](http://instagram.com/miriamchadwick).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"99.9% of the time I start with the background first.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-miriamchadwick-process-1-600.jpg)](/assets/images/paperfaces-miriamchadwick-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Build up the figure with pencil first, watercolor second, and back to pencil for refinements.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-miriamchadwick-process-2-600.jpg)](/assets/images/paperfaces-miriamchadwick-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-miriamchadwick-process-3-600.jpg)](/assets/images/paperfaces-miriamchadwick-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-miriamchadwick-process-4-600.jpg)](/assets/images/paperfaces-miriamchadwick-process-4-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Using a pencil to add detail gradually. Using a Pogo Connect pen that supports pressure sensitivity makes this much easier.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-miriamchadwick-process-5-600.jpg)](/assets/images/paperfaces-miriamchadwick-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-miriamchadwick-process-6-600.jpg)](/assets/images/paperfaces-miriamchadwick-process-6-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Rendering hair in Paper can be a lot of fun if you take your time. Start dark and gradually mix white or yellow into the color mixer to make strands that are highlighted.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-miriamchadwick-process-7-600.jpg)](/assets/images/paperfaces-miriamchadwick-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-16-kasperstenbom-portrait.md",
    "content": "---\ntitle: \"Another eye and half face\"\nexcerpt: \"PaperFaces portrait of @KasperStenbom drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kasperstenbom-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kasperstenbom-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@KasperStenbom](https://twitter.com/KasperStenbom).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Using white to lighten and gradually render cheeks and eye sockets.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kasperstenbom-process-1-600.jpg)](/assets/images/paperfaces-kasperstenbom-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Zooming in to color the eye and pencil in eyebrow hairs.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kasperstenbom-process-2-600.jpg)](/assets/images/paperfaces-kasperstenbom-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-18-rhp7-portrait.md",
    "content": "---\ntitle: \"A face of pixels\"\nexcerpt: \"PaperFaces portrait of @rhp7 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rhp7-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rhp7-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rhp7](https://twitter.com/rhp7). This was hands down the hardest drawing I've done in the series to date --- wink wink, nudge nudge.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-18-surjithctly-portrait.md",
    "content": "---\ntitle: \"Trading drawings for a feature\"\nexcerpt: \"PaperFaces portrait of @surjithctly drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-surjithctly-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-surjithctly-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@surjithctly](https://twitter.com/surjithctly) for featuring my project on [Side Projects](http://sideprojects.web3canvas.com/post/55332574657/paperfaces-project-an-experiment-in-humanizing).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil outline.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-surjithctly-process-1-600.jpg)](/assets/images/paperfaces-surjithctly-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Building up the face with layers of watercolor.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-surjithctly-process-2-600.jpg)](/assets/images/paperfaces-surjithctly-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-19-luxepain-portrait.md",
    "content": "---\ntitle: \"Half of this drawing is blonde hair\"\nexcerpt: \"PaperFaces portrait of @LuxePain drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-luxepain-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-luxepain-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@luxepain](https://twitter.com/luxepain). Always looking to further perfect my hair drawing skills --- boy was there a bunch of hair for me to practice on in this sketch! I'm including a few work in progress screen grabs below showing how I built up the hair with pencil line after pencil line after pencil line.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Drawing the face pencil first, watercolor second.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-luxepain-process-1-600.jpg)](/assets/images/paperfaces-luxepain-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luxepain-process-2-600.jpg)](/assets/images/paperfaces-luxepain-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luxepain-process-3-600.jpg)](/assets/images/paperfaces-luxepain-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"A well placed stroke of white reflection can add a bunch of realism to an eye.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-luxepain-process-4-600.jpg)](/assets/images/paperfaces-luxepain-process-4-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Drawing hair all day every day.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-luxepain-process-5-600.jpg)](/assets/images/paperfaces-luxepain-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luxepain-process-6-600.jpg)](/assets/images/paperfaces-luxepain-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luxepain-process-7-600.jpg)](/assets/images/paperfaces-luxepain-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-20-lizziebeth-portrait.md",
    "content": "---\ntitle: \"Drawing hairs before midnight\"\nexcerpt: \"PaperFaces portrait of @LizzieBeth_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lizziebeth-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lizziebeth-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of <a href=\"http://twiter.com/LizzieBeth_\">@LizzieBeth_</a>. For this portrait I decided to make one of those most excellent speed drawing videos you see all over YouTube. In the past I used AirPlay on my iPad to mirror its display to my iMac that was running [**Reflector**](http://www.airsquirrels.com/reflector/) to capture the screen. This process has worked out great but since it only records the screen you miss out on actually seeing how I draw with a stylus.\n\nTo record the video below I used some knowledge I picked up last year when I created a [pregnancy time lapse](https://www.youtube.com/watch?v=yXd5oe_vOBE) of [my wife and twin girls](http://2littlerosebuds.com). Basically I setup my dSLR camera on a tripod behind me and tethered it to my iMac through a USB cable so I could use software to snap photographs every couple of seconds.\n\nAfter grabbing around 1,000 images I imported them into **Adobe AfterEffects** as an image sequence, did some quick color corrections, added titles and music, and uploaded to YouTube.\n\nThe lighting kind of sucks and the focus is off in a few parts, but I think it came out ok for my second time lapse attempt. Next time I'll take more care to get my white balance correct upfront and make sure I don't bump into the tripod midway through the shoot.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% youtube FGCPOimgdb4 %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-22-glitchpoke-portrait.md",
    "content": "---\ntitle: \"A pixelated hoodie and face\"\nexcerpt: \"PaperFaces portrait of @Glitchpoke drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-glitchpoke-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-glitchpoke-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Glitchpoke](https://twitter.com/Glitchpoke). Drawing straight lines can be quite difficult on an iPad. The key is to take it slow and constantly refine your edges by coloring over mistakes with neighboring colors. To being this illustration I roughed out all the pixels in pencil and then used a combination of the fountain and ink pens to darken in each of the squares.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-22-technacity-portrait.md",
    "content": "---\ntitle: \"Long walks on the beach\"\nexcerpt: \"PaperFaces portrait of @technacity drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-technacity-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-technacity-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@technacity](https://twitter.com/technacity). Drawing clouds and waves is actually quite easy when using Paper for iOS's pencil and watercolor brush. I like to lay down a few wash layers with a color that makes up a majority of the sky or water. Then using white I quickly and lightly brush in the clouds and wave foam. To finish I went along the edges with a white pencil and lightly defined the clouds and splashes.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-technacity-process-1-600.jpg)](/assets/images/paperfaces-technacity-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Watercolor brush to block out shapes to build on.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-technacity-process-2-600.jpg)](/assets/images/paperfaces-technacity-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-technacity-process-3-600.jpg)](/assets/images/paperfaces-technacity-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Lightly shading with the pencil to create clouds and waves.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-technacity-process-4-600.jpg)](/assets/images/paperfaces-technacity-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-technacity-process-5-600.jpg)](/assets/images/paperfaces-technacity-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-technacity-process-6-600.jpg)](/assets/images/paperfaces-technacity-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-25-herzbescheuert-portrait.md",
    "content": "---\ntitle: \"Intersecting lines and long hair\"\nexcerpt: \"PaperFaces portrait of @herzbescheuert drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-herzbescheuert-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-herzbescheuert-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@herzbescheuert](https://twitter.com/herzbescheuert). Another faceless portrait of a girl with long hair. Bored of these yet?\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![Work in progress screenshot](/assets/images/paperfaces-herzbescheuert-process-1-600.jpg)](/assets/images/paperfaces-herzbescheuert-process-1-lg.jpg)\n[![Work in progress screenshot](/assets/images/paperfaces-herzbescheuert-process-2-600.jpg)](/assets/images/paperfaces-herzbescheuert-process-2-lg.jpg)\n[![Work in progress screenshot](/assets/images/paperfaces-herzbescheuert-process-3-600.jpg)](/assets/images/paperfaces-herzbescheuert-process-3-lg.jpg)\n[![Work in progress screenshot](/assets/images/paperfaces-herzbescheuert-process-4-600.jpg)](/assets/images/paperfaces-herzbescheuert-process-4-lg.jpg)\n[![Work in progress screenshot](/assets/images/paperfaces-herzbescheuert-process-5-600.jpg)](/assets/images/paperfaces-herzbescheuert-process-5-lg.jpg)\n[![Work in progress screenshot](/assets/images/paperfaces-herzbescheuert-process-6-600.jpg)](/assets/images/paperfaces-herzbescheuert-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-25-jackmcdade-portrait.md",
    "content": "---\ntitle: \"Blurry foliage portrait\"\nexcerpt: \"PaperFaces portrait of @jackmcdade drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jackmcdade-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jackmcdade-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait of [@jackmcdade](https://twitter.com/jackmcdade). Went all choppy with my watercolor strokes in the background to simulate a bokeh effect and add dimension to the composition.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jackmcdade-process-1-600.jpg)](/assets/images/paperfaces-jackmcdade-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Short and controlled watercolor strokes to avoid sharp edges and keep the trees nice and blurry.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jackmcdade-process-2-600.jpg)](/assets/images/paperfaces-jackmcdade-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jackmcdade-process-3-600.jpg)](/assets/images/paperfaces-jackmcdade-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Here comes the face...\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jackmcdade-process-4-600.jpg)](/assets/images/paperfaces-jackmcdade-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-25-rockdanne-portrait.md",
    "content": "---\ntitle: \"Tying ties in the woods\"\nexcerpt: \"PaperFaces portrait of @rockdanne drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rockdanne-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rockdanne-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@rockdanne](https://twitter.com/rockdanne). Was almost tempted to draw a full face this time…\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in process screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-rockdanne-process-1-600.jpg)](/assets/images/paperfaces-rockdanne-process-1-lg.jpg)\n[![](/assets/images/paperfaces-rockdanne-process-2-600.jpg)](/assets/images/paperfaces-rockdanne-process-2-lg.jpg)\n[![](/assets/images/paperfaces-rockdanne-process-3-600.jpg)](/assets/images/paperfaces-rockdanne-process-3-lg.jpg)\n[![](/assets/images/paperfaces-rockdanne-process-4-600.jpg)](/assets/images/paperfaces-rockdanne-process-4-lg.jpg)\n[![](/assets/images/paperfaces-rockdanne-process-5-600.jpg)](/assets/images/paperfaces-rockdanne-process-5-lg.jpg)\n[![](/assets/images/paperfaces-rockdanne-process-6-600.jpg)](/assets/images/paperfaces-rockdanne-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-26-parkr-portrait.md",
    "content": "---\ntitle: \"Sidewalk stroll\"\nexcerpt: \"PaperFaces portrait of @parkr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-parkr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-parkr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@parkr](https://twitter.com/parkr). Thought this Twitter name looked familiar, and then it hit me --- @parkr is one of the dudes doing solid development work on [Jekyll](http://jekyllrb.com), my favorite static site generator.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition lightly in pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-parkr-process-1-600.jpg)](/assets/images/paperfaces-parkr-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-parkr-process-2-600.jpg)](/assets/images/paperfaces-parkr-process-2-lg.jpg)\n[![](/assets/images/paperfaces-parkr-process-3-600.jpg)](/assets/images/paperfaces-parkr-process-3-lg.jpg)\n[![](/assets/images/paperfaces-parkr-process-4-600.jpg)](/assets/images/paperfaces-parkr-process-4-lg.jpg)\n[![](/assets/images/paperfaces-parkr-process-5-600.jpg)](/assets/images/paperfaces-parkr-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-29-hipster-parade-portrait.md",
    "content": "---\ntitle: \"A gaggle of big headed hipsters\"\nexcerpt: \"PaperFaces portrait of some random hipsters drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hipsters.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hipsters-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard, time lapse]\n---\n\nPaperFaces portrait of some random hipsters I came up with to fill the entire canvas for a change. You can achieve some realistic effects just working with grays and white.\n\n{% youtube CD9uoa96nKQ %}\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-29-jinthagerman-portrait.md",
    "content": "---\ntitle: \"Mountains or hill tops?\"\nexcerpt: \"PaperFaces portrait of @jinthagerman drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jinthagerman-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jinthagerman-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-09-07T16:16:05-04:00\n---\n\nPaperFaces portrait of [@jinthagerman](https://twitter.com/jinthagerman). Landscapes are more forgiving, I think that's why I spend time drawing them over facial features.\n\nAnd just so it's recorded, this is the illustration I was working on when my [Pogo Connect Smart Pen]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) died. Was trying to paint a large continous tone to define the mountains and instead was left with choppy marks. Examined the Pogo's tip and noticed a metal contact that should be attached to the internal circuit board was instead stuck to the magnetic tip. Bummer.\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-jinthagerman-process-1-600.jpg)](/assets/images/paperfaces-jinthagerman-process-1-lg.jpg)\n[![](/assets/images/paperfaces-jinthagerman-process-2-600.jpg)](/assets/images/paperfaces-jinthagerman-process-2-lg.jpg)\n[![](/assets/images/paperfaces-jinthagerman-process-3-600.jpg)](/assets/images/paperfaces-jinthagerman-process-3-lg.jpg)\n[![](/assets/images/paperfaces-jinthagerman-process-4-600.jpg)](/assets/images/paperfaces-jinthagerman-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-29-sbrolins-portrait.md",
    "content": "---\ntitle: \"Sitting on the beach at sunset\"\nexcerpt: \"PaperFaces portrait of @sbrolins drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sbrolins-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sbrolins-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sbrolins](https://twitter.com/sbrolins). Painting a sky or water is very rewarding with Paper for iOS, because with little effort you can create a masterpiece.\n\nThere really wasn't much to this landscape --- just a few layers of light red orange that fade into the horizon, and pink pencil strokes for the clouds. The beach is made up of dull blue violet watercolor layers, topped with light pencil strokes to create a sand texture.\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-sbrolins-process-1-600.jpg)](/assets/images/paperfaces-sbrolins-process-1-lg.jpg)\n[![](/assets/images/paperfaces-sbrolins-process-2-600.jpg)](/assets/images/paperfaces-sbrolins-process-2-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshot.\" %}\n[![](/assets/images/paperfaces-sbrolins-process-3-600.jpg)](/assets/images/paperfaces-sbrolins-process-3-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-sbrolins-process-4-600.jpg)](/assets/images/paperfaces-sbrolins-process-4-lg.jpg)\n[![](/assets/images/paperfaces-sbrolins-process-5-600.jpg)](/assets/images/paperfaces-sbrolins-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-29-syropian-portrait.md",
    "content": "---\ntitle: \"Low contrast is the best contrast\"\nexcerpt: \"PaperFaces portrait of @syropian drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-syropian-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-syropian-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@syropian](https://twitter.com/syropian). Felt like pushing myself to draw a full face so I dove in with just a pencil and watercolor brush. Had to adjust the color often to get lighter tones since I didn't have a working pressure sensitive stylus at my disposal. I forgot how quick using a pen like the Pogo Connect can be when shading compared to a normal capacitive stylus.\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-syropian-process-1-600.jpg)](/assets/images/paperfaces-syropian-process-1-lg.jpg)\n[![](/assets/images/paperfaces-syropian-process-2-600.jpg)](/assets/images/paperfaces-syropian-process-2-lg.jpg)\n[![](/assets/images/paperfaces-syropian-process-3-600.jpg)](/assets/images/paperfaces-syropian-process-3-lg.jpg)\n[![](/assets/images/paperfaces-syropian-process-4-600.jpg)](/assets/images/paperfaces-syropian-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-07-31-spasstiii-portrait.md",
    "content": "---\ntitle: \"Invisibility is a white shirt on a white wall\"\nexcerpt: \"PaperFaces portrait of @spasstiii drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-spasstiii-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-spasstiii-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@spasstiii](https://twitter.com/spasstiii).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-spasstiii-process-1-600.jpg)](/assets/images/paperfaces-spasstiii-process-1-lg.jpg)\n[![](/assets/images/paperfaces-spasstiii-process-2-600.jpg)](/assets/images/paperfaces-spasstiii-process-2-lg.jpg)\n[![](/assets/images/paperfaces-spasstiii-process-3-600.jpg)](/assets/images/paperfaces-spasstiii-process-3-lg.jpg)\n[![](/assets/images/paperfaces-spasstiii-process-4-600.jpg)](/assets/images/paperfaces-spasstiii-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-02-thatmiddleway-portrait.md",
    "content": "---\ntitle: \"Plant something\"\nexcerpt: \"PaperFaces portrait of @thatmiddleway drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thatmiddleway-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thatmiddleway-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@thatmiddleway](https://twitter.com/thatmiddleway).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-thatmiddleway-process-1-600.jpg)](/assets/images/paperfaces-thatmiddleway-process-1-lg.jpg)\n[![](/assets/images/paperfaces-thatmiddleway-process-2-600.jpg)](/assets/images/paperfaces-thatmiddleway-process-2-lg.jpg)\n[![](/assets/images/paperfaces-thatmiddleway-process-3-600.jpg)](/assets/images/paperfaces-thatmiddleway-process-3-lg.jpg)\n[![](/assets/images/paperfaces-thatmiddleway-process-4-600.jpg)](/assets/images/paperfaces-thatmiddleway-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-05-colmsmyth-portrait.md",
    "content": "---\ntitle: \"Hoodies from the future\"\nexcerpt: \"PaperFaces portrait of @colmsmyth drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-colmsmyth-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-colmsmyth-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@colmsmyth](https://twitter.com/colmsmyth).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress screenshot.\" %}\n[![](/assets/images/paperfaces-colmsmyth-process-1-600.jpg)](/assets/images/paperfaces-colmsmyth-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshot.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-colmsmyth-process-2-600.jpg)](/assets/images/paperfaces-colmsmyth-process-2-lg.jpg)\n[![](/assets/images/paperfaces-colmsmyth-process-3-600.jpg)](/assets/images/paperfaces-colmsmyth-process-3-lg.jpg)\n[![](/assets/images/paperfaces-colmsmyth-process-4-600.jpg)](/assets/images/paperfaces-colmsmyth-process-4-lg.jpg)\n[![](/assets/images/paperfaces-colmsmyth-process-5-600.jpg)](/assets/images/paperfaces-colmsmyth-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-05-davecowart-portrait.md",
    "content": "---\ntitle: \"Painterly backdrop and beard\"\nexcerpt: \"PaperFaces portrait of @davecowart drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-davecowart-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-davecowart-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@davecowart](https://twitter.com/davecowart). Was feeling under the weather when I painted this, but the show must go on!\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Work in progress screenshot.\" %}\n[![](/assets/images/paperfaces-davecowart-process-1-600.jpg)](/assets/images/paperfaces-davecowart-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-davecowart-process-2-600.jpg)](/assets/images/paperfaces-davecowart-process-2-lg.jpg)\n[![](/assets/images/paperfaces-davecowart-process-3-600.jpg)](/assets/images/paperfaces-davecowart-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-05-edwinvdbogert-portrait.md",
    "content": "---\ntitle: \"Looks like an airplane window\"\nexcerpt: \"PaperFaces portrait of @edwinvdbogert drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-edwinvdbogert-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-edwinvdbogert-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-09-07T16:14:51-04:00\n---\n\nPaperFaces portrait of [@edwinvdbogert](https://twitter.com/edwinvdbogert). A replacement [Pogo Connect Smart Pen]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) arrived just in time for me to complete this drawing with a degree of realism I wouldn't have been able to without it. Thank's *Ten One Design* for taking care of my defective Pogo Connect so fast!\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshot.\" %}\n[![](/assets/images/paperfaces-edwinvdbogert-process-1-600.jpg)](/assets/images/paperfaces-edwinvdbogert-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-edwinvdbogert-process-2-600.jpg)](/assets/images/paperfaces-edwinvdbogert-process-2-lg.jpg)\n[![](/assets/images/paperfaces-edwinvdbogert-process-3-600.jpg)](/assets/images/paperfaces-edwinvdbogert-process-3-lg.jpg)\n[![](/assets/images/paperfaces-edwinvdbogert-process-4-600.jpg)](/assets/images/paperfaces-edwinvdbogert-process-4-lg.jpg)\n[![](/assets/images/paperfaces-edwinvdbogert-process-5-600.jpg)](/assets/images/paperfaces-edwinvdbogert-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-05-jenny-smyth-portrait.md",
    "content": "---\ntitle: \"Folding a menu in a gray room\"\nexcerpt: \"PaperFaces portrait of @Jenny_Smyth drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jenny-smyth-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jenny-smyth-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Jenny_Smyth](https://twitter.com/Jenny_Smyth).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-jenny-smyth-process-1-600.jpg)](/assets/images/paperfaces-jenny-smyth-process-1-lg.jpg)\n[![](/assets/images/paperfaces-jenny-smyth-process-2-600.jpg)](/assets/images/paperfaces-jenny-smyth-process-2-lg.jpg)\n[![](/assets/images/paperfaces-jenny-smyth-process-3-600.jpg)](/assets/images/paperfaces-jenny-smyth-process-3-lg.jpg)\n[![](/assets/images/paperfaces-jenny-smyth-process-4-600.jpg)](/assets/images/paperfaces-jenny-smyth-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-06-veganwendy-birthday-portrait.md",
    "content": "---\ntitle: \"A birthday bokeh\"\nexcerpt: \"PaperFaces portrait of @veganwendy for her birthday drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-veganwendy-birthday-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-veganwendy-birthday-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [my wife Wendy](http://2littlerosebuds.com) for her birthday. As you may have noticed I used the entire canvas this time and didn't follow the usual square cropped format. Just one of the many perks of being married to me. Har har…\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"It all starts with a pencil sketch followed by many layers of watercolor.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-veganwendy-birthday-process-1-600.jpg)](/assets/images/paperfaces-veganwendy-birthday-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-veganwendy-birthday-process-2-600.jpg)](/assets/images/paperfaces-veganwendy-birthday-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-veganwendy-birthday-process-3-600.jpg)](/assets/images/paperfaces-veganwendy-birthday-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-veganwendy-birthday-process-4-600.jpg)](/assets/images/paperfaces-veganwendy-birthday-process-4-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshot.\" %}\n[![](/assets/images/paperfaces-veganwendy-birthday-process-5-750.jpg)](/assets/images/paperfaces-veganwendy-birthday-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-08-iainspad-portrait.md",
    "content": "---\ntitle: \"Mohawk in gray\"\nexcerpt: \"PaperFaces portrait of @iainspad drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-iainspad-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-iainspad-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@iainspad](https://twitter.com/iainspad). Up the punx.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots.\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-iainspad-process-1-600.jpg)](/assets/images/paperfaces-iainspad-process-1-lg.jpg)\n[![](/assets/images/paperfaces-iainspad-process-2-600.jpg)](/assets/images/paperfaces-iainspad-process-2-lg.jpg)\n[![](/assets/images/paperfaces-iainspad-process-3-600.jpg)](/assets/images/paperfaces-iainspad-process-3-lg.jpg)\n[![](/assets/images/paperfaces-iainspad-process-4-600.jpg)](/assets/images/paperfaces-iainspad-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-08-sodevious-portrait.md",
    "content": "---\ntitle: \"Curls in the sun\"\nexcerpt: \"PaperFaces portrait of @sodevious drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sodevious-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sodevious-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait of project donator [@sodevious](https://twitter.com/sodevious). Check out the making of video capture below where I compress 2 hours worth of drawing down into 4 minutes.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% youtube fC_yATccHmk %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-12-dannowatts-portrait.md",
    "content": "---\ntitle: \"Hooded figure\"\nexcerpt: \"PaperFaces portrait of @dannowatts drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dannowatts-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dannowatts-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@dannowatts](https://twitter.com/dannowatts). Black and white mixed with some creepy trees makes for a perfect combination.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-dannowatts-process-1-600.jpg)](/assets/images/paperfaces-dannowatts-process-1-lg.jpg)\n[![](/assets/images/paperfaces-dannowatts-process-2-600.jpg)](/assets/images/paperfaces-dannowatts-process-2-lg.jpg)\n[![](/assets/images/paperfaces-dannowatts-process-3-600.jpg)](/assets/images/paperfaces-dannowatts-process-3-lg.jpg)\n[![](/assets/images/paperfaces-dannowatts-process-4-600.jpg)](/assets/images/paperfaces-dannowatts-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-12-genelocklin-portrait.md",
    "content": "---\ntitle: \"Dramatic mustache\"\nexcerpt: \"PaperFaces portrait of @genelocklin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-genelocklin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-genelocklin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@genelocklin](https://twitter.com/genelocklin).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-genelocklin-process-1-600.jpg)](/assets/images/paperfaces-genelocklin-process-1-lg.jpg)\n[![](/assets/images/paperfaces-genelocklin-process-2-600.jpg)](/assets/images/paperfaces-genelocklin-process-2-lg.jpg)\n[![](/assets/images/paperfaces-genelocklin-process-3-600.jpg)](/assets/images/paperfaces-genelocklin-process-3-lg.jpg)\n[![](/assets/images/paperfaces-genelocklin-process-4-600.jpg)](/assets/images/paperfaces-genelocklin-process-4-lg.jpg)\n[![](/assets/images/paperfaces-genelocklin-process-5-600.jpg)](/assets/images/paperfaces-genelocklin-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-12-klebeluft-portrait.md",
    "content": "---\ntitle: \"Some of my favorite colors\"\nexcerpt: \"PaperFaces portrait of @klebeluft drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-klebeluft-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-klebeluft-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@klebeluft](https://twitter.com/klebeluft).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-klebeluft-process-1-600.jpg)](/assets/images/paperfaces-klebeluft-process-1-lg.jpg)\n[![](/assets/images/paperfaces-klebeluft-process-2-600.jpg)](/assets/images/paperfaces-klebeluft-process-2-lg.jpg)\n[![](/assets/images/paperfaces-klebeluft-process-3-600.jpg)](/assets/images/paperfaces-klebeluft-process-3-lg.jpg)\n[![](/assets/images/paperfaces-klebeluft-process-4-600.jpg)](/assets/images/paperfaces-klebeluft-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-12-thesugarmonster-portrait.md",
    "content": "---\ntitle: \"Summer popsicle\"\nexcerpt: \"PaperFaces portrait of @thesugarmonster drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thesugarmonster-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thesugarmonster-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@thesugarmonster](https://twitter.com/thesugarmonster).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-thesugarmonster-process-1-600.jpg)](/assets/images/paperfaces-thesugarmonster-process-1-lg.jpg)\n[![](/assets/images/paperfaces-thesugarmonster-process-2-600.jpg)](/assets/images/paperfaces-thesugarmonster-process-2-lg.jpg)\n[![](/assets/images/paperfaces-thesugarmonster-process-3-600.jpg)](/assets/images/paperfaces-thesugarmonster-process-3-lg.jpg)\n[![](/assets/images/paperfaces-thesugarmonster-process-4-600.jpg)](/assets/images/paperfaces-thesugarmonster-process-4-lg.jpg)\n[![](/assets/images/paperfaces-thesugarmonster-process-5-600.jpg)](/assets/images/paperfaces-thesugarmonster-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-14-svendahlstrand-portrait.md",
    "content": "---\ntitle: \"Smile, you're on candid camera\"\nexcerpt: \"PaperFaces portrait of @svendahlstrand drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-svendahlstrand-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-svendahlstrand-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@svendahlstrand](https://twitter.com/svendahlstrand).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-svendahlstrand-process-1-600.jpg)](/assets/images/paperfaces-svendahlstrand-process-1-lg.jpg)\n[![](/assets/images/paperfaces-svendahlstrand-process-2-600.jpg)](/assets/images/paperfaces-svendahlstrand-process-2-lg.jpg)\n[![](/assets/images/paperfaces-svendahlstrand-process-3-600.jpg)](/assets/images/paperfaces-svendahlstrand-process-3-lg.jpg)\n[![](/assets/images/paperfaces-svendahlstrand-process-4-600.jpg)](/assets/images/paperfaces-svendahlstrand-process-4-lg.jpg)\n[![](/assets/images/paperfaces-svendahlstrand-process-5-600.jpg)](/assets/images/paperfaces-svendahlstrand-process-5-lg.jpg)\n[![](/assets/images/paperfaces-svendahlstrand-process-6-600.jpg)](/assets/images/paperfaces-svendahlstrand-process-6-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Working on them eyes.\" %}\n[![Work in progress screenshot](/assets/images/paperfaces-svendahlstrand-process-7-750.jpg)](/assets/images/paperfaces-svendahlstrand-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-14-wefreema-portrait.md",
    "content": "---\ntitle: \"Fiesta!\"\nexcerpt: \"PaperFaces portrait of @wefreema drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-wefreema-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-wefreema-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commissioned by [@wefreema](https://twitter.com/wefreema).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-wefreema-process-1-600.jpg)](/assets/images/paperfaces-wefreema-process-1-lg.jpg)\n[![](/assets/images/paperfaces-wefreema-process-2-600.jpg)](/assets/images/paperfaces-wefreema-process-2-lg.jpg)\n[![](/assets/images/paperfaces-wefreema-process-3-600.jpg)](/assets/images/paperfaces-wefreema-process-3-lg.jpg)\n[![](/assets/images/paperfaces-wefreema-process-4-600.jpg)](/assets/images/paperfaces-wefreema-process-4-lg.jpg)\n[![](/assets/images/paperfaces-wefreema-process-5-600.jpg)](/assets/images/paperfaces-wefreema-process-5-lg.jpg)\n[![](/assets/images/paperfaces-wefreema-process-6-600.jpg)](/assets/images/paperfaces-wefreema-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-16-apvmacgregor-portrait.md",
    "content": "---\ntitle: \"Back to drawing color\"\nexcerpt: \"PaperFaces portrait of @apvmacgregor drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-apvmacgregor-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-apvmacgregor-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@apvmacgregor](https://twitter.com/apvmacgregor). After days of gray I'm back to drawing color portraits.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-apvmacgregor-process-1-600.jpg)](/assets/images/paperfaces-apvmacgregor-process-1-lg.jpg)\n[![](/assets/images/paperfaces-apvmacgregor-process-2-600.jpg)](/assets/images/paperfaces-apvmacgregor-process-2-lg.jpg)\n[![](/assets/images/paperfaces-apvmacgregor-process-3-600.jpg)](/assets/images/paperfaces-apvmacgregor-process-3-lg.jpg)\n[![](/assets/images/paperfaces-apvmacgregor-process-4-600.jpg)](/assets/images/paperfaces-apvmacgregor-process-4-lg.jpg)\n[![](/assets/images/paperfaces-apvmacgregor-process-5-600.jpg)](/assets/images/paperfaces-apvmacgregor-process-5-lg.jpg)\n[![](/assets/images/paperfaces-apvmacgregor-process-6-600.jpg)](/assets/images/paperfaces-apvmacgregor-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-16-webexplorations-portrait.md",
    "content": "---\ntitle: \"White highlights in gray\"\nexcerpt: \"PaperFaces portrait of @WebExplorations drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-webexplorations-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-webexplorations-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait commissioned by [@WebExplorations](https://twitter.com/webexplorations).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-webexplorations-process-1-600.jpg)](/assets/images/paperfaces-webexplorations-process-1-lg.jpg)\n[![](/assets/images/paperfaces-webexplorations-process-2-600.jpg)](/assets/images/paperfaces-webexplorations-process-2-lg.jpg)\n[![](/assets/images/paperfaces-webexplorations-process-3-600.jpg)](/assets/images/paperfaces-webexplorations-process-3-lg.jpg)\n[![](/assets/images/paperfaces-webexplorations-process-4-600.jpg)](/assets/images/paperfaces-webexplorations-process-4-lg.jpg)\n[![](/assets/images/paperfaces-webexplorations-process-5-600.jpg)](/assets/images/paperfaces-webexplorations-process-5-lg.jpg)\n[![](/assets/images/paperfaces-webexplorations-process-6-600.jpg)](/assets/images/paperfaces-webexplorations-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-19-dhrrgn-portrait.md",
    "content": "---\ntitle: \"Going light on the color\"\nexcerpt: \"PaperFaces portrait of @dhrrgn drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dhrrgn-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dhrrgn-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@dhrrgn](https://twitter.com/dhrrgn).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-dhrrgn-process-1-600.jpg)](/assets/images/paperfaces-dhrrgn-process-1-lg.jpg)\n[![](/assets/images/paperfaces-dhrrgn-process-2-600.jpg)](/assets/images/paperfaces-dhrrgn-process-2-lg.jpg)\n[![](/assets/images/paperfaces-dhrrgn-process-3-600.jpg)](/assets/images/paperfaces-dhrrgn-process-3-lg.jpg)\n[![](/assets/images/paperfaces-dhrrgn-process-4-600.jpg)](/assets/images/paperfaces-dhrrgn-process-4-lg.jpg)\n[![](/assets/images/paperfaces-dhrrgn-process-5-600.jpg)](/assets/images/paperfaces-dhrrgn-process-5-lg.jpg)\n[![](/assets/images/paperfaces-dhrrgn-process-6-600.jpg)](/assets/images/paperfaces-dhrrgn-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-19-isellsoap-portrait.md",
    "content": "---\ntitle: \"Stripes in the trees\"\nexcerpt: \"PaperFaces portrait of @isellsoap drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-isellsoap-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-isellsoap-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@isellsoap](https://twitter.com/isellsoap).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-isellsoap-process-1-600.jpg)](/assets/images/paperfaces-isellsoap-process-1-lg.jpg)\n[![](/assets/images/paperfaces-isellsoap-process-2-600.jpg)](/assets/images/paperfaces-isellsoap-process-2-lg.jpg)\n[![](/assets/images/paperfaces-isellsoap-process-3-600.jpg)](/assets/images/paperfaces-isellsoap-process-3-lg.jpg)\n[![](/assets/images/paperfaces-isellsoap-process-4-600.jpg)](/assets/images/paperfaces-isellsoap-process-4-lg.jpg)\n[![](/assets/images/paperfaces-isellsoap-process-5-600.jpg)](/assets/images/paperfaces-isellsoap-process-5-lg.jpg)\n[![](/assets/images/paperfaces-isellsoap-process-6-600.jpg)](/assets/images/paperfaces-isellsoap-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-19-mattfieldy-portrait.md",
    "content": "---\ntitle: \"Pixelated beard\"\nexcerpt: \"PaperFaces portrait of @mattfieldy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mattfieldy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mattfieldy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@mattfieldy](https://twitter.com/mattfieldy).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-mattfieldy-process-1-600.jpg)](/assets/images/paperfaces-mattfieldy-process-1-lg.jpg)\n[![](/assets/images/paperfaces-mattfieldy-process-2-600.jpg)](/assets/images/paperfaces-mattfieldy-process-2-lg.jpg)\n[![](/assets/images/paperfaces-mattfieldy-process-3-600.jpg)](/assets/images/paperfaces-mattfieldy-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-22-laramulady-portrait.md",
    "content": "---\ntitle: \"Feet up relaxin'\"\nexcerpt: \"PaperFaces portrait of @laramulady drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-laramulady-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-laramulady-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@laramulady](https://twitter.com/laramulady).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-laramulady-process-1-600.jpg)](/assets/images/paperfaces-laramulady-process-1-lg.jpg)\n[![](/assets/images/paperfaces-laramulady-process-2-600.jpg)](/assets/images/paperfaces-laramulady-process-2-lg.jpg)\n[![](/assets/images/paperfaces-laramulady-process-3-600.jpg)](/assets/images/paperfaces-laramulady-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-22-steve-jobs-portrait.md",
    "content": "---\ntitle: \"Think Different\"\nexcerpt: \"PaperFaces portrait of Steve Jobs drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-steve-jobs.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-steve-jobs-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nWith the release of the new Steve Jobs biopic starring Ashton Kutcher --- I was inspired to recreate the movie poster with Paper for iOS. Instead of using my go to combo of watercolor and pencil, I ventured out of my comfort zone using the pens exclusively. And for giggles I added the old rainbow Apple logo and *Think Different* ad campaign headline to play off the illustration's over saturated palette. \n\nMaybe Apple should bring back this logo, it would feel right at home with iOS 7 wouldn't it?\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-steve-jobs-process-1-600.jpg)](/assets/images/paperfaces-steve-jobs-process-1-lg.jpg)\n[![](/assets/images/paperfaces-steve-jobs-process-2-600.jpg)](/assets/images/paperfaces-steve-jobs-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-22-talksinmath-portrait.md",
    "content": "---\ntitle: \"Lower right corner\"\nexcerpt: \"PaperFaces portrait of @talksinmath drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-talksinmath-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-talksinmath-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@talksinmath](https://twitter.com/talksinmath).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-talksinmath-process-1-600.jpg)](/assets/images/paperfaces-talksinmath-process-1-lg.jpg)\n[![](/assets/images/paperfaces-talksinmath-process-2-600.jpg)](/assets/images/paperfaces-talksinmath-process-2-lg.jpg)\n[![](/assets/images/paperfaces-talksinmath-process-3-600.jpg)](/assets/images/paperfaces-talksinmath-process-3-lg.jpg)\n[![](/assets/images/paperfaces-talksinmath-process-4-600.jpg)](/assets/images/paperfaces-talksinmath-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-22-tipican-portrait.md",
    "content": "---\ntitle: \"Overlooking the water\"\nexcerpt: \"PaperFaces portrait of @tipican drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tipican-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tipican-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@tipican](https://twitter.com/tipican).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-tipican-process-1-600.jpg)](/assets/images/paperfaces-tipican-process-1-lg.jpg)\n[![](/assets/images/paperfaces-tipican-process-2-600.jpg)](/assets/images/paperfaces-tipican-process-2-lg.jpg)\n[![](/assets/images/paperfaces-tipican-process-3-600.jpg)](/assets/images/paperfaces-tipican-process-3-lg.jpg)\n[![](/assets/images/paperfaces-tipican-process-4-600.jpg)](/assets/images/paperfaces-tipican-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-26-hbcke-portrait.md",
    "content": "---\ntitle: \"War paint\"\nexcerpt: \"PaperFaces portrait of @hbcke drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hbcke-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hbcke-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@hbcke](https://twitter.com/hbcke).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face lightly with the pencil tool.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-hbcke-process-1-750.jpg)](/assets/images/paperfaces-hbcke-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Watercolor brush in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-hbcke-process-2-600.jpg)](/assets/images/paperfaces-hbcke-process-2-lg.jpg)\n[![](/assets/images/paperfaces-hbcke-process-3-600.jpg)](/assets/images/paperfaces-hbcke-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-26-rossbelmont-portrait.md",
    "content": "---\ntitle: \"Naturally lit with sunlight\"\nexcerpt: \"PaperFaces portrait of @rossbelmont drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rossbelmont-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rossbelmont-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@rossbelmont](https://twitter.com/rossbelmont).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-rossbelmont-process-1-600.jpg)](/assets/images/paperfaces-rossbelmont-process-1-lg.jpg)\n[![](/assets/images/paperfaces-rossbelmont-process-2-600.jpg)](/assets/images/paperfaces-rossbelmont-process-2-lg.jpg)\n[![](/assets/images/paperfaces-rossbelmont-process-3-600.jpg)](/assets/images/paperfaces-rossbelmont-process-3-lg.jpg)\n[![](/assets/images/paperfaces-rossbelmont-process-4-600.jpg)](/assets/images/paperfaces-rossbelmont-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-26-sarahewells-portrait.md",
    "content": "---\ntitle: \"Long hair and lips\"\nexcerpt: \"PaperFaces portrait of @SarahEWells drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sarahewells-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sarahewells-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@SarahEWells](https://twitter.com/sarahewells).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-sarahewells-process-1-600.jpg)](/assets/images/paperfaces-sarahewells-process-1-lg.jpg)\n[![](/assets/images/paperfaces-sarahewells-process-2-600.jpg)](/assets/images/paperfaces-sarahewells-process-2-lg.jpg)\n[![](/assets/images/paperfaces-sarahewells-process-3-600.jpg)](/assets/images/paperfaces-sarahewells-process-3-lg.jpg)\n[![](/assets/images/paperfaces-sarahewells-process-4-600.jpg)](/assets/images/paperfaces-sarahewells-process-4-lg.jpg)\n[![](/assets/images/paperfaces-sarahewells-process-5-600.jpg)](/assets/images/paperfaces-sarahewells-process-5-lg.jpg)\n[![](/assets/images/paperfaces-sarahewells-process-6-600.jpg)](/assets/images/paperfaces-sarahewells-process-6-lg.jpg)\n[![](/assets/images/paperfaces-sarahewells-process-7-600.jpg)](/assets/images/paperfaces-sarahewells-process-7-lg.jpg)\n[![](/assets/images/paperfaces-sarahewells-process-8-600.jpg)](/assets/images/paperfaces-sarahewells-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-28-missxpistol-portrait.md",
    "content": "---\ntitle: \"G is for Grrrape\"\nexcerpt: \"PaperFaces portrait of @missxpistol drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-missxpistol-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-missxpistol-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@missxpistol](https://twitter.com/missxpistol).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition.\" %}\n[![](/assets/images/paperfaces-missxpistol-process-1-750.jpg)](/assets/images/paperfaces-missxpistol-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-missxpistol-process-2-600.jpg)](/assets/images/paperfaces-missxpistol-process-2-lg.jpg)\n[![](/assets/images/paperfaces-missxpistol-process-3-600.jpg)](/assets/images/paperfaces-missxpistol-process-3-lg.jpg)\n[![](/assets/images/paperfaces-missxpistol-process-4-600.jpg)](/assets/images/paperfaces-missxpistol-process-4-lg.jpg)\n[![](/assets/images/paperfaces-missxpistol-process-5-600.jpg)](/assets/images/paperfaces-missxpistol-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-08-28-netzmensch-portrait.md",
    "content": "---\ntitle: \"Cyborg\"\nexcerpt: \"PaperFaces portrait of @netzmensch drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-netzmensch-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-netzmensch-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@netzmensch](https://twitter.com/netzmensch).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition.\" %}\n[![](/assets/images/paperfaces-netzmensch-process-1-750.jpg)](/assets/images/paperfaces-netzmensch-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-netzmensch-process-2-600.jpg)](/assets/images/paperfaces-netzmensch-process-2-lg.jpg)\n[![](/assets/images/paperfaces-netzmensch-process-3-600.jpg)](/assets/images/paperfaces-netzmensch-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-03-alasdair91-portrait.md",
    "content": "---\ntitle: \"Spooky sepia lighting\"\nexcerpt: \"PaperFaces portrait of @Alasdair91 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alasdair91-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alasdair91-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Alasdair91](https://twitter.com/alasdair91).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition.\" %}\n[![](/assets/images/paperfaces-alasdair91-process-1-750.jpg)](/assets/images/paperfaces-alasdair91-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-alasdair91-process-2-600.jpg)](/assets/images/paperfaces-alasdair91-process-2-lg.jpg)\n[![](/assets/images/paperfaces-alasdair91-process-2-600.jpg)](/assets/images/paperfaces-alasdair91-process-2-lg.jpg)\n[![](/assets/images/paperfaces-alasdair91-process-2-600.jpg)](/assets/images/paperfaces-alasdair91-process-2-lg.jpg)\n[![](/assets/images/paperfaces-alasdair91-process-2-600.jpg)](/assets/images/paperfaces-alasdair91-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-03-andrewbrewer-portrait.md",
    "content": "---\ntitle: \"Beard by the beach\"\nexcerpt: \"PaperFaces portrait of @andrewbrewer drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andrewbrewer-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andrewbrewer-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@andrewbrewer](https://twitter.com/andrewbrewer).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Using the watercolor brush to paint the background.\" %}\n[![](/assets/images/paperfaces-andrewbrewer-process-1-750.jpg)](/assets/images/paperfaces-andrewbrewer-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-andrewbrewer-process-2-600.jpg)](/assets/images/paperfaces-andrewbrewer-process-2-lg.jpg)\n[![](/assets/images/paperfaces-andrewbrewer-process-3-600.jpg)](/assets/images/paperfaces-andrewbrewer-process-3-lg.jpg)\n[![](/assets/images/paperfaces-andrewbrewer-process-4-600.jpg)](/assets/images/paperfaces-andrewbrewer-process-4-lg.jpg)\n[![](/assets/images/paperfaces-andrewbrewer-process-5-600.jpg)](/assets/images/paperfaces-andrewbrewer-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-03-brototyp-portrait.md",
    "content": "---\ntitle: \"Lean back and relax\"\nexcerpt: \"PaperFaces portrait of @brototyp drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-brototyp-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-brototyp-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@brototyp](https://twitter.com/brototyp).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition.\" %}\n[![](/assets/images/paperfaces-brototyp-process-1-750.jpg)](/assets/images/paperfaces-brototyp-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-brototyp-process-2-600.jpg)](/assets/images/paperfaces-brototyp-process-2-lg.jpg)\n[![](/assets/images/paperfaces-brototyp-process-3-600.jpg)](/assets/images/paperfaces-brototyp-process-3-lg.jpg)\n[![](/assets/images/paperfaces-brototyp-process-4-600.jpg)](/assets/images/paperfaces-brototyp-process-4-lg.jpg)\n[![](/assets/images/paperfaces-brototyp-process-5-600.jpg)](/assets/images/paperfaces-brototyp-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-03-cormacrelf-portrait.md",
    "content": "---\ntitle: \"It's hard to stare without eyes\"\nexcerpt: \"PaperFaces portrait of @cormacrelf drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cormacrelf-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cormacrelf-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cormacrelf](https://twitter.com/cormacrelf).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-cormacrelf-process-1-600.jpg)](/assets/images/paperfaces-cormacrelf-process-1-lg.jpg)\n[![](/assets/images/paperfaces-cormacrelf-process-2-600.jpg)](/assets/images/paperfaces-cormacrelf-process-2-lg.jpg)\n[![](/assets/images/paperfaces-cormacrelf-process-3-600.jpg)](/assets/images/paperfaces-cormacrelf-process-3-lg.jpg)\n[![](/assets/images/paperfaces-cormacrelf-process-4-600.jpg)](/assets/images/paperfaces-cormacrelf-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-03-jaredgoertzen-portrait.md",
    "content": "---\ntitle: \"America Eff Yeah!\"\nexcerpt: \"PaperFaces portrait of @jaredgoertzen drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jaredgoertzen-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jaredgoertzen-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@jaredgoertzen](https://twitter.com/jaredgoertzen).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition.\" %}\n[![](/assets/images/paperfaces-jaredgoertzen-process-1-750.jpg)](/assets/images/paperfaces-jaredgoertzen-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-jaredgoertzen-process-2-600.jpg)](/assets/images/paperfaces-jaredgoertzen-process-2-lg.jpg)\n[![](/assets/images/paperfaces-jaredgoertzen-process-3-600.jpg)](/assets/images/paperfaces-jaredgoertzen-process-3-lg.jpg)\n[![](/assets/images/paperfaces-jaredgoertzen-process-4-600.jpg)](/assets/images/paperfaces-jaredgoertzen-process-4-lg.jpg)\n[![](/assets/images/paperfaces-jaredgoertzen-process-5-600.jpg)](/assets/images/paperfaces-jaredgoertzen-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-03-toastroom-portrait.md",
    "content": "---\ntitle: \"Shirtless in gray\"\nexcerpt: \"PaperFaces portrait of @toastroom drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-toastroom-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-toastroom-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@toastroom](https://twitter.com/toastroom). It's hard to talk words without a mouth…\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-toastroom-process-1-600.jpg)](/assets/images/paperfaces-toastroom-process-1-lg.jpg)\n[![](/assets/images/paperfaces-toastroom-process-2-600.jpg)](/assets/images/paperfaces-toastroom-process-2-lg.jpg)\n[![](/assets/images/paperfaces-toastroom-process-3-600.jpg)](/assets/images/paperfaces-toastroom-process-3-lg.jpg)\n[![](/assets/images/paperfaces-toastroom-process-4-600.jpg)](/assets/images/paperfaces-toastroom-process-4-lg.jpg)\n[![](/assets/images/paperfaces-toastroom-process-5-600.jpg)](/assets/images/paperfaces-toastroom-process-5-lg.jpg)\n[![](/assets/images/paperfaces-toastroom-process-6-600.jpg)](/assets/images/paperfaces-toastroom-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-05-gscottolson-portrait.md",
    "content": "---\ntitle: \"Gray values in a four inch square\"\nexcerpt: \"PaperFaces portrait of @gscottolson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gscottolson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gscottolson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of FiftyThree maker, [@gscottolson](https://twitter.com/gscottolson).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-gscottolson-process-1-750.jpg)](/assets/images/paperfaces-gscottolson-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-gscottolson-process-2-600.jpg)](/assets/images/paperfaces-gscottolson-process-2-lg.jpg)\n[![](/assets/images/paperfaces-gscottolson-process-3-600.jpg)](/assets/images/paperfaces-gscottolson-process-3-lg.jpg)\n[![](/assets/images/paperfaces-gscottolson-process-4-600.jpg)](/assets/images/paperfaces-gscottolson-process-4-lg.jpg)\n[![](/assets/images/paperfaces-gscottolson-process-5-600.jpg)](/assets/images/paperfaces-gscottolson-process-5-lg.jpg)\n[![](/assets/images/paperfaces-gscottolson-process-6-600.jpg)](/assets/images/paperfaces-gscottolson-process-6-lg.jpg)\n[![](/assets/images/paperfaces-gscottolson-process-7-600.jpg)](/assets/images/paperfaces-gscottolson-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-05-jenniferamur-portrait.md",
    "content": "---\ntitle: \"Missing plastic chairs\"\nexcerpt: \"PaperFaces portrait of @jenniferamur drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jenniferamur-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jenniferamur-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nI forgot to paint some plastic chairs for sitting…oops. PaperFaces portrait of [@jenniferamur](https://twitter.com/jenniferamur).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-jenniferamur-process-1-600.jpg)](/assets/images/paperfaces-jenniferamur-process-1-lg.jpg)\n[![](/assets/images/paperfaces-jenniferamur-process-2-600.jpg)](/assets/images/paperfaces-jenniferamur-process-2-lg.jpg)\n[![](/assets/images/paperfaces-jenniferamur-process-3-600.jpg)](/assets/images/paperfaces-jenniferamur-process-3-lg.jpg)\n[![](/assets/images/paperfaces-jenniferamur-process-4-600.jpg)](/assets/images/paperfaces-jenniferamur-process-4-lg.jpg)\n[![](/assets/images/paperfaces-jenniferamur-process-5-600.jpg)](/assets/images/paperfaces-jenniferamur-process-5-lg.jpg)\n[![](/assets/images/paperfaces-jenniferamur-process-6-600.jpg)](/assets/images/paperfaces-jenniferamur-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-05-lindsaytower-portrait.md",
    "content": "---\ntitle: \"Happy in red\"\nexcerpt: \"PaperFaces portrait of @lindsaytower drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lindsaytower-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lindsaytower-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@lindsaytower](https://twitter.com/lindsaytower).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-lindsaytower-process-1-600.jpg)](/assets/images/paperfaces-lindsaytower-process-1-lg.jpg)\n[![](/assets/images/paperfaces-lindsaytower-process-2-600.jpg)](/assets/images/paperfaces-lindsaytower-process-2-lg.jpg)\n[![](/assets/images/paperfaces-lindsaytower-process-3-600.jpg)](/assets/images/paperfaces-lindsaytower-process-3-lg.jpg)\n[![](/assets/images/paperfaces-lindsaytower-process-4-600.jpg)](/assets/images/paperfaces-lindsaytower-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-09-seanblezard-portrait.md",
    "content": "---\ntitle: \"Patterns of plaid\"\nexcerpt: \"PaperFaces portrait of @seanblezard drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2013-09-12\nimage: \n  path: &image /assets/images/paperfaces-seanblezard-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-seanblezard-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@seanblezard](https://twitter.com/seanblezard).\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-seanblezard-process-1-750.jpg)](/assets/images/paperfaces-seanblezard-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-seanblezard-process-2-600.jpg)](/assets/images/paperfaces-seanblezard-process-2-lg.jpg)\n[![](/assets/images/paperfaces-seanblezard-process-3-600.jpg)](/assets/images/paperfaces-seanblezard-process-3-lg.jpg)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-09-tiamclaurin-portrait.md",
    "content": "---\ntitle: \"Brightly in blue\"\nexcerpt: \"PaperFaces portrait of @tiamclaurin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tiamclaurin-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tiamclaurin-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@tiamclaurin](https://twitter.com/tiamclaurin).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-tiamclaurin-process-1-600.jpg)](/assets/images/paperfaces-tiamclaurin-process-1-lg.jpg)\n[![](/assets/images/paperfaces-tiamclaurin-process-2-600.jpg)](/assets/images/paperfaces-tiamclaurin-process-2-lg.jpg)\n[![](/assets/images/paperfaces-tiamclaurin-process-3-600.jpg)](/assets/images/paperfaces-tiamclaurin-process-3-lg.jpg)\n[![](/assets/images/paperfaces-tiamclaurin-process-4-600.jpg)](/assets/images/paperfaces-tiamclaurin-process-4-lg.jpg)\n[![](/assets/images/paperfaces-tiamclaurin-process-5-600.jpg)](/assets/images/paperfaces-tiamclaurin-process-5-lg.jpg)\n[![](/assets/images/paperfaces-tiamclaurin-process-6-600.jpg)](/assets/images/paperfaces-tiamclaurin-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-09-zachorybenton-portrait.md",
    "content": "---\ntitle: \"Is that a hanging noose?\"\nexcerpt: \"PaperFaces portrait of @ZachoryBenton drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2013-09-12\nimage: \n  path: &image /assets/images/paperfaces-zachorybenton-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-zachorybenton-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ZachoryBenton](https://twitter.com/zachorybenton).\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-zachorybenton-process-1-600.jpg)](/assets/images/paperfaces-zachorybenton-process-1-lg.jpg)\n[![](/assets/images/paperfaces-zachorybenton-process-2-600.jpg)](/assets/images/paperfaces-zachorybenton-process-2-lg.jpg)\n[![](/assets/images/paperfaces-zachorybenton-process-3-600.jpg)](/assets/images/paperfaces-zachorybenton-process-3-lg.jpg)\n[![](/assets/images/paperfaces-zachorybenton-process-4-600.jpg)](/assets/images/paperfaces-zachorybenton-process-4-lg.jpg)\n[![](/assets/images/paperfaces-zachorybenton-process-5-600.jpg)](/assets/images/paperfaces-zachorybenton-process-5-lg.jpg)\n[![](/assets/images/paperfaces-zachorybenton-process-6-600.jpg)](/assets/images/paperfaces-zachorybenton-process-6-lg.jpg)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-12-jean-francois-portrait.md",
    "content": "---\ntitle: \"Computing on a computer\"\nexcerpt: \"PaperFaces portrait of @jean_francois drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jean-francois-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jean-francois-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@jean_francois](https://twitter.com/jean_francois).\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-jean-francois-process-1-600.jpg)](/assets/images/paperfaces-jean-francois-process-1-lg.jpg)\n[![](/assets/images/paperfaces-jean-francois-process-2-600.jpg)](/assets/images/paperfaces-jean-francois-process-2-lg.jpg)\n[![](/assets/images/paperfaces-jean-francois-process-3-600.jpg)](/assets/images/paperfaces-jean-francois-process-3-lg.jpg)\n[![](/assets/images/paperfaces-jean-francois-process-4-600.jpg)](/assets/images/paperfaces-jean-francois-process-4-lg.jpg)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-12-lemberg-portrait.md",
    "content": "---\ntitle: \"Eye spy with my golf ball eye\"\nexcerpt: \"PaperFaces portrait of @Lemberg drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lemberg-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lemberg-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@Lemberg](https://twitter.com/lemberg).\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-lemberg-process-1-750.jpg)](/assets/images/paperfaces-lemberg-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-lemberg-process-2-600.jpg)](/assets/images/paperfaces-lemberg-process-2-lg.jpg)\n[![](/assets/images/paperfaces-lemberg-process-3-600.jpg)](/assets/images/paperfaces-lemberg-process-3-lg.jpg)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-12-madcap-laughs-portrait.md",
    "content": "---\ntitle: \"Not by the hair on my chinny chin chin\"\nexcerpt: \"PaperFaces portrait of @Madcap_Laughs drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-madcap-laughs-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-madcap-laughs-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@Madcap_Laughs](https://twitter.com/Madcap_Laughs).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-madcap-laughs-process-1-750.jpg)](/assets/images/paperfaces-madcap-laughs-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-madcap-laughs-process-2-600.jpg)](/assets/images/paperfaces-madcap-laughs-process-2-lg.jpg)\n[![](/assets/images/paperfaces-madcap-laughs-process-3-600.jpg)](/assets/images/paperfaces-madcap-laughs-process-3-lg.jpg)\n[![](/assets/images/paperfaces-madcap-laughs-process-4-600.jpg)](/assets/images/paperfaces-madcap-laughs-process-4-lg.jpg)\n[![](/assets/images/paperfaces-madcap-laughs-process-5-600.jpg)](/assets/images/paperfaces-madcap-laughs-process-5-lg.jpg)\n[![](/assets/images/paperfaces-madcap-laughs-process-6-600.jpg)](/assets/images/paperfaces-madcap-laughs-process-6-lg.jpg)\n[![](/assets/images/paperfaces-madcap-laughs-process-7-600.jpg)](/assets/images/paperfaces-madcap-laughs-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-17-ejotto-portrait.md",
    "content": "---\ntitle: \"Woof! Cuddle in gray\"\nexcerpt: \"PaperFaces portrait of @ejotto drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ejotto-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ejotto-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@ejotto](https://twitter.com/ejotto).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-ejotto-process-1-750.jpg)](/assets/images/paperfaces-ejotto-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-ejotto-process-2-600.jpg)](/assets/images/paperfaces-ejotto-process-2-lg.jpg)\n[![](/assets/images/paperfaces-ejotto-process-3-600.jpg)](/assets/images/paperfaces-ejotto-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-17-ekinding-portrait.md",
    "content": "---\ntitle: \"Spooky kids\"\nexcerpt: \"PaperFaces portrait of @ekinding drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ekinding-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ekinding-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ekinding](https://twitter.com/ekinding). Had a lot of fun with this creeptacular illustration.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-ekinding-process-1-750.jpg)](/assets/images/paperfaces-ekinding-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-ekinding-process-2-600.jpg)](/assets/images/paperfaces-ekinding-process-2-lg.jpg)\n[![](/assets/images/paperfaces-ekinding-process-3-600.jpg)](/assets/images/paperfaces-ekinding-process-3-lg.jpg)\n[![](/assets/images/paperfaces-ekinding-process-4-600.jpg)](/assets/images/paperfaces-ekinding-process-4-lg.jpg)\n[![](/assets/images/paperfaces-ekinding-process-5-600.jpg)](/assets/images/paperfaces-ekinding-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-17-ericdfields-portrait.md",
    "content": "---\ntitle: \"Sitting in grass\"\nexcerpt: \"PaperFaces portrait of @ericdfields drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ericdfields-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ericdfields-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ericdfields](https://twitter.com/ericdfields).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-ericdfields-process-1-750.jpg)](/assets/images/paperfaces-ericdfields-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-ericdfields-process-2-600.jpg)](/assets/images/paperfaces-ericdfields-process-2-lg.jpg)\n[![](/assets/images/paperfaces-ericdfields-process-3-600.jpg)](/assets/images/paperfaces-ericdfields-process-3-lg.jpg)\n[![](/assets/images/paperfaces-ericdfields-process-4-600.jpg)](/assets/images/paperfaces-ericdfields-process-4-lg.jpg)\n[![](/assets/images/paperfaces-ericdfields-process-5-600.jpg)](/assets/images/paperfaces-ericdfields-process-5-lg.jpg)\n[![](/assets/images/paperfaces-ericdfields-process-6-600.jpg)](/assets/images/paperfaces-ericdfields-process-6-lg.jpg)\n[![](/assets/images/paperfaces-ericdfields-process-7-600.jpg)](/assets/images/paperfaces-ericdfields-process-7-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Adding detail with the pencil tool.\" %}\n[![](/assets/images/paperfaces-ericdfields-process-8-750.jpg)](/assets/images/paperfaces-ericdfields-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-17-fighto-portrait.md",
    "content": "---\ntitle: \"Google Glass fancy future\"\nexcerpt: \"PaperFaces portrait of @fighto drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fighto-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fighto-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@fighto](https://twitter.com/fighto). Who would have thought I would be illustrating so many Google Glass early adopters?\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-fighto-process-1-600.jpg)](/assets/images/paperfaces-fighto-process-1-lg.jpg)\n[![](/assets/images/paperfaces-fighto-process-2-600.jpg)](/assets/images/paperfaces-fighto-process-2-lg.jpg)\n[![](/assets/images/paperfaces-fighto-process-3-600.jpg)](/assets/images/paperfaces-fighto-process-3-lg.jpg)\n[![](/assets/images/paperfaces-fighto-process-4-600.jpg)](/assets/images/paperfaces-fighto-process-4-lg.jpg)\n[![](/assets/images/paperfaces-fighto-process-5-600.jpg)](/assets/images/paperfaces-fighto-process-5-lg.jpg)\n[![](/assets/images/paperfaces-fighto-process-6-600.jpg)](/assets/images/paperfaces-fighto-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-17-imhobson-portrait.md",
    "content": "---\ntitle: \"Magenta and beard on a tilt\"\nexcerpt: \"PaperFaces portrait of @imhobson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-imhobson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-imhobson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@imhobson](https://twitter.com/imhobson).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-imhobson-process-1-750.jpg)](/assets/images/paperfaces-imhobson-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-imhobson-process-2-600.jpg)](/assets/images/paperfaces-imhobson-process-2-lg.jpg)\n[![](/assets/images/paperfaces-imhobson-process-3-600.jpg)](/assets/images/paperfaces-imhobson-process-3-lg.jpg)\n[![](/assets/images/paperfaces-imhobson-process-4-600.jpg)](/assets/images/paperfaces-imhobson-process-4-lg.jpg)\n[![](/assets/images/paperfaces-imhobson-process-5-600.jpg)](/assets/images/paperfaces-imhobson-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-17-nett00n-portrait.md",
    "content": "---\ntitle: \"Hat tip in gray\"\nexcerpt: \"PaperFaces portrait of @nett00n drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nett00n-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nett00n-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@nett00n](https://twitter.com/Tnett00n).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-nett00n-process-1-600.jpg)](/assets/images/paperfaces-nett00n-process-1-lg.jpg)\n[![](/assets/images/paperfaces-nett00n-process-2-600.jpg)](/assets/images/paperfaces-nett00n-process-2-lg.jpg)\n[![](/assets/images/paperfaces-nett00n-process-3-600.jpg)](/assets/images/paperfaces-nett00n-process-3-lg.jpg)\n[![](/assets/images/paperfaces-nett00n-process-4-600.jpg)](/assets/images/paperfaces-nett00n-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-17-tannice-portrait.md",
    "content": "---\ntitle: \"Hair in braids\"\nexcerpt: \"PaperFaces portrait of @Tannice_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tannice-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tannice-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/Tannice_\">@Tannice</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out a face with the pencil tool.\" %}\n[![](/assets/images/paperfaces-tannice-process-1-750.jpg)](/assets/images/paperfaces-tannice-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-tannice-process-2-600.jpg)](/assets/images/paperfaces-tannice-process-2-lg.jpg)\n[![](/assets/images/paperfaces-tannice-process-3-600.jpg)](/assets/images/paperfaces-tannice-process-3-lg.jpg)\n[![](/assets/images/paperfaces-tannice-process-4-600.jpg)](/assets/images/paperfaces-tannice-process-4-lg.jpg)\n[![](/assets/images/paperfaces-tannice-process-5-600.jpg)](/assets/images/paperfaces-tannice-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-20-agebhard-portrait.md",
    "content": "---\ntitle: \"Hold up your iPhone in honor of iOS 7\"\nexcerpt: \"PaperFaces portrait of @agebhard drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-agebhard-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-agebhard-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/agebhard\">@agebhard</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Working the background with watercolor.\" %}\n[![](/assets/images/paperfaces-agebhard-process-1-750.jpg)](/assets/images/paperfaces-agebhard-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-agebhard-process-2-600.jpg)](/assets/images/paperfaces-agebhard-process-2-lg.jpg)\n[![](/assets/images/paperfaces-agebhard-process-3-600.jpg)](/assets/images/paperfaces-agebhard-process-3-lg.jpg)\n[![](/assets/images/paperfaces-agebhard-process-4-600.jpg)](/assets/images/paperfaces-agebhard-process-4-lg.jpg)\n[![](/assets/images/paperfaces-agebhard-process-5-600.jpg)](/assets/images/paperfaces-agebhard-process-5-lg.jpg)\n[![](/assets/images/paperfaces-agebhard-process-6-600.jpg)](/assets/images/paperfaces-agebhard-process-6-lg.jpg)\n[![](/assets/images/paperfaces-agebhard-process-7-600.jpg)](/assets/images/paperfaces-agebhard-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-20-lewips-portrait.md",
    "content": "---\ntitle: \"Jean Jacket Rocks x2\"\nexcerpt: \"PaperFaces portrait of @lewips drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lewips-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lewips-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/lewips\">@lewips</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-lewips-process-1-600.jpg)](/assets/images/paperfaces-lewips-process-1-lg.jpg)\n[![](/assets/images/paperfaces-lewips-process-2-600.jpg)](/assets/images/paperfaces-lewips-process-2-lg.jpg)\n[![](/assets/images/paperfaces-lewips-process-3-600.jpg)](/assets/images/paperfaces-lewips-process-3-lg.jpg)\n[![](/assets/images/paperfaces-lewips-process-4-600.jpg)](/assets/images/paperfaces-lewips-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-23-cjmlgrto-portrait.md",
    "content": "---\ntitle: \"Looking up\"\nexcerpt: \"PaperFaces portrait of @cjmlgrto drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cjmlgrto-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cjmlgrto-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/cjmlgrto\">@cjmlgrto</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-cjmlgrto-process-1-600.jpg)](/assets/images/paperfaces-cjmlgrto-process-1-lg.jpg)\n[![](/assets/images/paperfaces-cjmlgrto-process-2-600.jpg)](/assets/images/paperfaces-cjmlgrto-process-2-lg.jpg)\n[![](/assets/images/paperfaces-cjmlgrto-process-3-600.jpg)](/assets/images/paperfaces-cjmlgrto-process-3-lg.jpg)\n[![](/assets/images/paperfaces-cjmlgrto-process-4-600.jpg)](/assets/images/paperfaces-cjmlgrto-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-23-emmajrwalker-portrait.md",
    "content": "---\ntitle: \"Peace sign\"\nexcerpt: \"PaperFaces portrait of @emmajrwalker drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-emmajrwalker-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-emmajrwalker-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/emmajrwalker\">@emmajrwalker</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![](/assets/images/paperfaces-emmajrwalker-process-1-750.jpg)](/assets/images/paperfaces-emmajrwalker-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-emmajrwalker-process-2-600.jpg)](/assets/images/paperfaces-emmajrwalker-process-2-lg.jpg)\n[![](/assets/images/paperfaces-emmajrwalker-process-3-600.jpg)](/assets/images/paperfaces-emmajrwalker-process-3-lg.jpg)\n[![](/assets/images/paperfaces-emmajrwalker-process-4-600.jpg)](/assets/images/paperfaces-emmajrwalker-process-4-lg.jpg)\n[![](/assets/images/paperfaces-emmajrwalker-process-5-600.jpg)](/assets/images/paperfaces-emmajrwalker-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-23-igorshkau-portrait.md",
    "content": "---\ntitle: \"Backlit colors\"\nexcerpt: \"PaperFaces portrait of @igorshkau drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-igorshkau-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-igorshkau-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/igorshkau\">@igorshkau</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![](/assets/images/paperfaces-igorshkau-process-1-750.jpg)](/assets/images/paperfaces-igorshkau-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-igorshkau-process-2-600.jpg)](/assets/images/paperfaces-igorshkau-process-2-lg.jpg)\n[![](/assets/images/paperfaces-igorshkau-process-3-600.jpg)](/assets/images/paperfaces-igorshkau-process-3-lg.jpg)\n[![](/assets/images/paperfaces-igorshkau-process-4-600.jpg)](/assets/images/paperfaces-igorshkau-process-4-lg.jpg)\n[![](/assets/images/paperfaces-igorshkau-process-5-600.jpg)](/assets/images/paperfaces-igorshkau-process-5-lg.jpg)\n[![](/assets/images/paperfaces-igorshkau-process-6-600.jpg)](/assets/images/paperfaces-igorshkau-process-6-lg.jpg)\n[![](/assets/images/paperfaces-igorshkau-process-7-600.jpg)](/assets/images/paperfaces-igorshkau-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-24-travissawrie-portrait.md",
    "content": "---\ntitle: \"Wrapped around\"\nexcerpt: \"PaperFaces portrait of @travissawrie drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-travissawrie-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-travissawrie-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/travissawrie\">@travissawrie</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-travissawrie-process-1-600.jpg)](/assets/images/paperfaces-travissawrie-process-1-lg.jpg)\n[![](/assets/images/paperfaces-travissawrie-process-2-600.jpg)](/assets/images/paperfaces-travissawrie-process-2-lg.jpg)\n[![](/assets/images/paperfaces-travissawrie-process-3-600.jpg)](/assets/images/paperfaces-travissawrie-process-3-lg.jpg)\n[![](/assets/images/paperfaces-travissawrie-process-4-600.jpg)](/assets/images/paperfaces-travissawrie-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-25-sakkaden-portrait.md",
    "content": "---\ntitle: \"Look at this view!\"\nexcerpt: \"PaperFaces portrait of @sakkaden drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sakkaden-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sakkaden-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commissioned by <a href=\"https://twitter.com/sakkaden\">@sakkaden</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![](/assets/images/paperfaces-sakkaden-process-1-750.jpg)](/assets/images/paperfaces-sakkaden-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-sakkaden-process-2-600.jpg)](/assets/images/paperfaces-sakkaden-process-2-lg.jpg)\n[![](/assets/images/paperfaces-sakkaden-process-3-600.jpg)](/assets/images/paperfaces-sakkaden-process-3-lg.jpg)\n[![](/assets/images/paperfaces-sakkaden-process-4-600.jpg)](/assets/images/paperfaces-sakkaden-process-4-lg.jpg)\n[![](/assets/images/paperfaces-sakkaden-process-5-600.jpg)](/assets/images/paperfaces-sakkaden-process-5-lg.jpg)\n[![](/assets/images/paperfaces-sakkaden-process-6-600.jpg)](/assets/images/paperfaces-sakkaden-process-6-lg.jpg)\n[![](/assets/images/paperfaces-sakkaden-process-7-600.jpg)](/assets/images/paperfaces-sakkaden-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-26-mattknox-portrait.md",
    "content": "---\ntitle: \"Wild and furry\"\nexcerpt: \"PaperFaces portrait of @mattknox drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mattknox-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mattknox-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/mattknox\">@mattknox</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-mattknox-process-1-600.jpg)](/assets/images/paperfaces-mattknox-process-1-lg.jpg)\n[![](/assets/images/paperfaces-mattknox-process-2-600.jpg)](/assets/images/paperfaces-mattknox-process-2-lg.jpg)\n[![](/assets/images/paperfaces-mattknox-process-3-600.jpg)](/assets/images/paperfaces-mattknox-process-3-lg.jpg)\n[![](/assets/images/paperfaces-mattknox-process-4-600.jpg)](/assets/images/paperfaces-mattknox-process-4-lg.jpg)\n[![](/assets/images/paperfaces-mattknox-process-5-600.jpg)](/assets/images/paperfaces-mattknox-process-5-lg.jpg)\n[![](/assets/images/paperfaces-mattknox-process-6-600.jpg)](/assets/images/paperfaces-mattknox-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-27-pappyshannon-portrait.md",
    "content": "---\ntitle: \"A pipe smoking velociraptor walks into a bar…\"\nexcerpt: \"PaperFaces portrait of @PappyShannon drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pappyshannon-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pappyshannon-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\n\"Welcome to Jurassic Park.\" PaperFaces avatar portrait of <a href=\"https://twitter.com/PappyShannon\">@PappyShannon</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-pappyshannon-process-1-600.jpg)](/assets/images/paperfaces-pappyshannon-process-1-lg.jpg)\n[![](/assets/images/paperfaces-pappyshannon-process-2-600.jpg)](/assets/images/paperfaces-pappyshannon-process-2-lg.jpg)\n[![](/assets/images/paperfaces-pappyshannon-process-3-600.jpg)](/assets/images/paperfaces-pappyshannon-process-3-lg.jpg)\n[![](/assets/images/paperfaces-pappyshannon-process-4-600.jpg)](/assets/images/paperfaces-pappyshannon-process-4-lg.jpg)\n[![](/assets/images/paperfaces-pappyshannon-process-5-600.jpg)](/assets/images/paperfaces-pappyshannon-process-5-lg.jpg)\n[![](/assets/images/paperfaces-pappyshannon-process-6-600.jpg)](/assets/images/paperfaces-pappyshannon-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-30-calebd-portrait.md",
    "content": "---\ntitle: \"Goatee at the wall\"\nexcerpt: \"PaperFaces portrait of @calebd drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-calebd-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-calebd-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/calebd\">@calebd</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-calebd-process-1-600.jpg)](/assets/images/paperfaces-calebd-process-1-lg.jpg)\n[![](/assets/images/paperfaces-calebd-process-2-600.jpg)](/assets/images/paperfaces-calebd-process-2-lg.jpg)\n[![](/assets/images/paperfaces-calebd-process-3-600.jpg)](/assets/images/paperfaces-calebd-process-3-lg.jpg)\n[![](/assets/images/paperfaces-calebd-process-4-600.jpg)](/assets/images/paperfaces-calebd-process-4-lg.jpg)\n[![](/assets/images/paperfaces-calebd-process-5-600.jpg)](/assets/images/paperfaces-calebd-process-5-lg.jpg)\n[![](/assets/images/paperfaces-calebd-process-6-600.jpg)](/assets/images/paperfaces-calebd-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-30-chappers-ma-portrait.md",
    "content": "---\ntitle: \"Basement dweller\"\nexcerpt: \"PaperFaces portrait of @chappers_ma drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chappers-ma-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chappers-ma-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/chappers_ma\">@chappers_ma</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-chappers-ma-process-1-600.jpg)](/assets/images/paperfaces-chappers-ma-process-1-lg.jpg)\n[![](/assets/images/paperfaces-chappers-ma-process-2-600.jpg)](/assets/images/paperfaces-chappers-ma-process-2-lg.jpg)\n[![](/assets/images/paperfaces-chappers-ma-process-3-600.jpg)](/assets/images/paperfaces-chappers-ma-process-3-lg.jpg)\n[![](/assets/images/paperfaces-chappers-ma-process-4-600.jpg)](/assets/images/paperfaces-chappers-ma-process-4-lg.jpg)\n[![](/assets/images/paperfaces-chappers-ma-process-5-600.jpg)](/assets/images/paperfaces-chappers-ma-process-5-lg.jpg)\n[![](/assets/images/paperfaces-chappers-ma-process-6-600.jpg)](/assets/images/paperfaces-chappers-ma-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-09-30-ddrjr-portrait.md",
    "content": "---\ntitle: \"Smile for Lady Liberty\"\nexcerpt: \"PaperFaces portrait of @ddrjr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ddrjr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ddrjr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/ddrjr\">@ddrjr</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![](/assets/images/paperfaces-ddrjr-process-1-750.jpg)](/assets/images/paperfaces-ddrjr-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-ddrjr-process-2-600.jpg)](/assets/images/paperfaces-ddrjr-process-2-lg.jpg)\n[![](/assets/images/paperfaces-ddrjr-process-3-600.jpg)](/assets/images/paperfaces-ddrjr-process-3-lg.jpg)\n[![](/assets/images/paperfaces-ddrjr-process-4-600.jpg)](/assets/images/paperfaces-ddrjr-process-4-lg.jpg)\n[![](/assets/images/paperfaces-ddrjr-process-5-600.jpg)](/assets/images/paperfaces-ddrjr-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-01-conrey-portrait.md",
    "content": "---\ntitle: \"Half a shadow hawk\"\nexcerpt: \"PaperFaces portrait of @conrey drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-conrey-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-conrey-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/conrey\">@conrey</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![](/assets/images/paperfaces-conrey-process-1-750.jpg)](/assets/images/paperfaces-conrey-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-conrey-process-2-600.jpg)](/assets/images/paperfaces-conrey-process-2-lg.jpg)\n[![](/assets/images/paperfaces-conrey-process-3-600.jpg)](/assets/images/paperfaces-conrey-process-3-lg.jpg)\n[![](/assets/images/paperfaces-conrey-process-4-600.jpg)](/assets/images/paperfaces-conrey-process-4-lg.jpg)\n[![](/assets/images/paperfaces-conrey-process-5-600.jpg)](/assets/images/paperfaces-conrey-process-5-lg.jpg)\n[![](/assets/images/paperfaces-conrey-process-6-600.jpg)](/assets/images/paperfaces-conrey-process-6-lg.jpg)\n[![](/assets/images/paperfaces-conrey-process-7-600.jpg)](/assets/images/paperfaces-conrey-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-01-olucho-portrait.md",
    "content": "---\ntitle: \"Pondering\"\nexcerpt: \"PaperFaces portrait of @olucho drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-olucho-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-olucho-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/olucho\">@olucho</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-olucho-process-1-600.jpg)](/assets/images/paperfaces-olucho-process-1-lg.jpg)\n[![](/assets/images/paperfaces-olucho-process-2-600.jpg)](/assets/images/paperfaces-olucho-process-2-lg.jpg)\n[![](/assets/images/paperfaces-olucho-process-3-600.jpg)](/assets/images/paperfaces-olucho-process-3-lg.jpg)\n[![](/assets/images/paperfaces-olucho-process-4-600.jpg)](/assets/images/paperfaces-olucho-process-4-lg.jpg)\n[![](/assets/images/paperfaces-olucho-process-5-600.jpg)](/assets/images/paperfaces-olucho-process-5-lg.jpg)\n[![](/assets/images/paperfaces-olucho-process-6-600.jpg)](/assets/images/paperfaces-olucho-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-02-anniversary-portrait.md",
    "content": "---\ntitle: \"Happy Anniversary\"\nexcerpt: \"PaperFaces portrait of my wife on our wedding day drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-anniversary-portrait.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-anniversary-portrait-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, self portrait, beard]\n---\n\nNothing says romance quite like drawing a faceless portrait of your wife on your wedding day. Happy Anniversary [Wendy](https://2littlerosebuds.com) --- and as your friend [Toodee](http://uncyclopedia.wikia.com/wiki/Yo_Gabba_Gabba!) would say, \"Keep on Jumping.\"\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"My only regret is not hiring a professional photographer to document the occasion.\" class:\"gallery-2-col\" %}\n[![The bride](/assets/images/roycroft-wedding-1.jpg)](/assets/images/roycroft-wedding-1-lg.jpg)\n[![Kissing](/assets/images/roycroft-wedding-2.jpg)](/assets/images/roycroft-wedding-2.jpg)\n[![Wedding tea favors](/assets/images/roycroft-wedding-3.jpg)](/assets/images/roycroft-wedding-3.jpg)\n[![Cutting the vegan cake](/assets/images/roycroft-wedding-4.jpg)](/assets/images/roycroft-wedding-4.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-03-comicasuperhero-portrait.md",
    "content": "---\ntitle: \"Scattering light through a hat\"\nexcerpt: \"PaperFaces portrait of @comicasuperhero drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-comicasuperhero-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-comicasuperhero-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/comicasuperhero\">@comicasuperhero</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![](/assets/images/paperfaces-comicasuperhero-process-1-750.jpg)](/assets/images/paperfaces-comicasuperhero-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-comicasuperhero-process-2-600.jpg)](/assets/images/paperfaces-comicasuperhero-process-2-lg.jpg)\n[![](/assets/images/paperfaces-comicasuperhero-process-3-600.jpg)](/assets/images/paperfaces-comicasuperhero-process-3-lg.jpg)\n[![](/assets/images/paperfaces-comicasuperhero-process-4-600.jpg)](/assets/images/paperfaces-comicasuperhero-process-4-lg.jpg)\n[![](/assets/images/paperfaces-comicasuperhero-process-5-600.jpg)](/assets/images/paperfaces-comicasuperhero-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-04-scripty-portrait.md",
    "content": "---\ntitle: \"Plaid is the new plaid, get it?\"\nexcerpt: \"PaperFaces portrait of @scripty drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-scripty-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-scripty-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/Scripty\">@Scripty</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-scripty-process-1-600.jpg)](/assets/images/paperfaces-scripty-process-1-lg.jpg)\n[![](/assets/images/paperfaces-scripty-process-2-600.jpg)](/assets/images/paperfaces-scripty-process-2-lg.jpg)\n[![](/assets/images/paperfaces-scripty-process-3-600.jpg)](/assets/images/paperfaces-scripty-process-3-lg.jpg)\n[![](/assets/images/paperfaces-scripty-process-4-600.jpg)](/assets/images/paperfaces-scripty-process-4-lg.jpg)\n[![](/assets/images/paperfaces-scripty-process-5-600.jpg)](/assets/images/paperfaces-scripty-process-5-lg.jpg)\n[![](/assets/images/paperfaces-scripty-process-6-600.jpg)](/assets/images/paperfaces-scripty-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-07-chrishnry-portrait.md",
    "content": "---\ntitle: \"That old time photo look\"\nexcerpt: \"PaperFaces portrait of @chrishnry drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chrishnry-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chrishnry-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/chrishnry\">@chrishnry</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![](/assets/images/paperfaces-chrishnry-process-1-750.jpg)](/assets/images/paperfaces-chrishnry-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (**Paper for iOS**).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-chrishnry-process-2-600.jpg)](/assets/images/paperfaces-chrishnry-process-2-lg.jpg)\n[![](/assets/images/paperfaces-chrishnry-process-3-600.jpg)](/assets/images/paperfaces-chrishnry-process-3-lg.jpg)\n[![](/assets/images/paperfaces-chrishnry-process-4-600.jpg)](/assets/images/paperfaces-chrishnry-process-4-lg.jpg)\n[![](/assets/images/paperfaces-chrishnry-process-5-600.jpg)](/assets/images/paperfaces-chrishnry-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-07-dubble-c-portrait.md",
    "content": "---\ntitle: \"Maps and earbuds\"\nexcerpt: \"PaperFaces portrait of @Dubble_C drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dubble-c-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dubble-c-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/Dubble_C\">@Dubble_C</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-dubble-c-process-1-750.jpg)](/assets/images/paperfaces-dubble-c-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-dubble-c-process-2-600.jpg)](/assets/images/paperfaces-dubble-c-process-2-lg.jpg)\n[![](/assets/images/paperfaces-dubble-c-process-3-600.jpg)](/assets/images/paperfaces-dubble-c-process-3-lg.jpg)\n[![](/assets/images/paperfaces-dubble-c-process-4-600.jpg)](/assets/images/paperfaces-dubble-c-process-4-lg.jpg)\n[![](/assets/images/paperfaces-dubble-c-process-5-600.jpg)](/assets/images/paperfaces-dubble-c-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-07-warrentalmarkes-portrait.md",
    "content": "---\ntitle: \"Monitor reflections\"\nexcerpt: \"PaperFaces portrait of @warrentalmarkes drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-warrentalmarkes-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-warrentalmarkes-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/WarrenTalmarkes\">@WarrenTalmarkes</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching with the pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-warrentalmarkes-process-1-750.jpg)](/assets/images/paperfaces-warrentalmarkes-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-warrentalmarkes-process-2-600.jpg)](/assets/images/paperfaces-warrentalmarkes-process-2-lg.jpg)\n[![](/assets/images/paperfaces-warrentalmarkes-process-3-600.jpg)](/assets/images/paperfaces-warrentalmarkes-process-3-lg.jpg)\n[![](/assets/images/paperfaces-warrentalmarkes-process-4-600.jpg)](/assets/images/paperfaces-warrentalmarkes-process-4-lg.jpg)\n[![](/assets/images/paperfaces-warrentalmarkes-process-5-600.jpg)](/assets/images/paperfaces-warrentalmarkes-process-5-lg.jpg)\n[![](/assets/images/paperfaces-warrentalmarkes-process-6-600.jpg)](/assets/images/paperfaces-warrentalmarkes-process-6-lg.jpg)\n[![](/assets/images/paperfaces-warrentalmarkes-process-7-600.jpg)](/assets/images/paperfaces-warrentalmarkes-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-09-drodol-portrait.md",
    "content": "---\ntitle: \"Halfsies\"\nexcerpt: \"PaperFaces portrait of @drodol drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-drodol-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-drodol-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/Drodol\">@Drodol</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-drodol-process-1-600.jpg)](/assets/images/paperfaces-drodol-process-1-lg.jpg)\n[![](/assets/images/paperfaces-drodol-process-2-600.jpg)](/assets/images/paperfaces-drodol-process-2-lg.jpg)\n[![](/assets/images/paperfaces-drodol-process-3-600.jpg)](/assets/images/paperfaces-drodol-process-3-lg.jpg)\n[![](/assets/images/paperfaces-drodol-process-4-600.jpg)](/assets/images/paperfaces-drodol-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-09-mich-maci-portrait.md",
    "content": "---\ntitle: \"Pink tips\"\nexcerpt: \"PaperFaces portrait of @mich-maci drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mich-maci-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mich-maci-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/mich-maci\">@mich-maci</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Building off a pencil sketch with water color.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mich-maci-process-1-750.jpg)](/assets/images/paperfaces-mich-maci-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-mich-maci-process-2-600.jpg)](/assets/images/paperfaces-mich-maci-process-2-lg.jpg)\n[![](/assets/images/paperfaces-mich-maci-process-3-600.jpg)](/assets/images/paperfaces-mich-maci-process-3-lg.jpg)\n[![](/assets/images/paperfaces-mich-maci-process-4-600.jpg)](/assets/images/paperfaces-mich-maci-process-4-lg.jpg)\n[![](/assets/images/paperfaces-mich-maci-process-5-600.jpg)](/assets/images/paperfaces-mich-maci-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-10-domigan-portrait.md",
    "content": "---\ntitle: \"Three stars\"\nexcerpt: \"PaperFaces portrait of @domigan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-domigan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-domigan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/domigan\">@domigan</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" %}\n[![](/assets/images/paperfaces-domigan-process-1-600.jpg)](/assets/images/paperfaces-domigan-process-1-lg.jpg)\n[![](/assets/images/paperfaces-domigan-process-2-600.jpg)](/assets/images/paperfaces-domigan-process-2-lg.jpg)\n[![](/assets/images/paperfaces-domigan-process-3-600.jpg)](/assets/images/paperfaces-domigan-process-3-lg.jpg)\n[![](/assets/images/paperfaces-domigan-process-4-600.jpg)](/assets/images/paperfaces-domigan-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-14-clepetit-portrait.md",
    "content": "---\ntitle: \"Balance is everything\"\nexcerpt: \"PaperFaces portrait of @clepetit drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-clepetit-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-clepetit-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces avatar portrait of <a href=\"https://twitter.com/clepetit\">@clepetit</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Painting the background with many layers of watercolor.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-clepetit-process-1-750.jpg)](/assets/images/paperfaces-clepetit-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-clepetit-process-2-600.jpg)](/assets/images/paperfaces-clepetit-process-2-lg.jpg)\n[![](/assets/images/paperfaces-clepetit-process-3-600.jpg)](/assets/images/paperfaces-clepetit-process-3-lg.jpg)\n[![](/assets/images/paperfaces-clepetit-process-4-600.jpg)](/assets/images/paperfaces-clepetit-process-4-lg.jpg)\n[![](/assets/images/paperfaces-clepetit-process-5-600.jpg)](/assets/images/paperfaces-clepetit-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-14-drexore-portrait.md",
    "content": "---\ntitle: \"Tilted\"\nexcerpt: \"PaperFaces portrait of @drexore drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-drexore-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-drexore-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of <a href=\"https://twitter.com/drexore\">@drexore</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition in pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-drexore-process-1-750.jpg)](/assets/images/paperfaces-drexore-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-drexore-process-2-600.jpg)](/assets/images/paperfaces-drexore-process-2-lg.jpg)\n[![](/assets/images/paperfaces-drexore-process-3-600.jpg)](/assets/images/paperfaces-drexore-process-3-lg.jpg)\n[![](/assets/images/paperfaces-drexore-process-4-600.jpg)](/assets/images/paperfaces-drexore-process-4-lg.jpg)\n[![](/assets/images/paperfaces-drexore-process-5-600.jpg)](/assets/images/paperfaces-drexore-process-5-lg.jpg)\n[![](/assets/images/paperfaces-drexore-process-6-600.jpg)](/assets/images/paperfaces-drexore-process-6-lg.jpg)\n[![](/assets/images/paperfaces-drexore-process-7-600.jpg)](/assets/images/paperfaces-drexore-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-14-misfit82-portrait.md",
    "content": "---\ntitle: \"I want your skulls\"\nexcerpt: \"PaperFaces portrait of @misfit82 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-misfit82-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-misfit82-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\n*I want your skulls --- I need your skulls.* PaperFaces avatar portrait of [@misfit82](https://twitter.com/misfit82).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-misfit82-process-1-750.jpg)](/assets/images/paperfaces-misfit82-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-misfit82-process-2-600.jpg)](/assets/images/paperfaces-misfit82-process-2-lg.jpg)\n[![](/assets/images/paperfaces-misfit82-process-3-600.jpg)](/assets/images/paperfaces-misfit82-process-3-lg.jpg)\n[![](/assets/images/paperfaces-misfit82-process-4-600.jpg)](/assets/images/paperfaces-misfit82-process-4-lg.jpg)\n[![](/assets/images/paperfaces-misfit82-process-5-600.jpg)](/assets/images/paperfaces-misfit82-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-14-rkrismcneely-portrait.md",
    "content": "---\ntitle: \"Drawing geometry\"\nexcerpt: \"PaperFaces portrait of @rkrismcneely drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rkrismcneely-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rkrismcneely-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@rkrismcneely](https://twitter.com/rkrismcneely).\n\n{% include_cached boilerplate/paperfaces.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rkrismcneely-process-1-750.jpg)](/assets/images/paperfaces-rkrismcneely-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-rkrismcneely-process-2-600.jpg)](/assets/images/paperfaces-rkrismcneely-process-2-lg.jpg)\n[![](/assets/images/paperfaces-rkrismcneely-process-3-600.jpg)](/assets/images/paperfaces-rkrismcneely-process-3-lg.jpg)\n[![](/assets/images/paperfaces-rkrismcneely-process-4-600.jpg)](/assets/images/paperfaces-rkrismcneely-process-4-lg.jpg)\n[![](/assets/images/paperfaces-rkrismcneely-process-5-600.jpg)](/assets/images/paperfaces-rkrismcneely-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-16-rob-jayne-portrait.md",
    "content": "---\ntitle: \"Another happy couple\"\nexcerpt: \"PaperFaces portrait of Rob and Jayne drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rob-jayne.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rob-jayne-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nCommissioned PaperFaces portrait of Rob and Jayne.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rob-jayne-process-1-750.jpg)](/assets/images/paperfaces-rob-jayne-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-rob-jayne-process-2-600.jpg)](/assets/images/paperfaces-rob-jayne-process-2-lg.jpg)\n[![](/assets/images/paperfaces-rob-jayne-process-3-600.jpg)](/assets/images/paperfaces-rob-jayne-process-3-lg.jpg)\n[![](/assets/images/paperfaces-rob-jayne-process-4-600.jpg)](/assets/images/paperfaces-rob-jayne-process-4-lg.jpg)\n[![](/assets/images/paperfaces-rob-jayne-process-5-600.jpg)](/assets/images/paperfaces-rob-jayne-process-5-lg.jpg)\n[![](/assets/images/paperfaces-rob-jayne-process-6-600.jpg)](/assets/images/paperfaces-rob-jayne-process-6-lg.jpg)\n[![](/assets/images/paperfaces-rob-jayne-process-7-600.jpg)](/assets/images/paperfaces-rob-jayne-process-7-lg.jpg)\n[![](/assets/images/paperfaces-rob-jayne-process-8-600.jpg)](/assets/images/paperfaces-rob-jayne-process-8-lg.jpg)\n[![](/assets/images/paperfaces-rob-jayne-process-9-600.jpg)](/assets/images/paperfaces-rob-jayne-process-9-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-16-sailesh-panchal-portrait.md",
    "content": "---\ntitle: \"Dramatic lighting in a suit\"\nexcerpt: \"PaperFaces portrait of @sailesh-panchal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sailesh-panchal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sailesh-panchal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nGood lighting makes for a world of difference. Commissioned PaperFaces portrait of [@sailesh-panchal](https://twitter.com/sailesh-panchal).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Time to complete: 1 hour and 28 minutes.\" %}\n{% youtube KMLJ8_CQhAU %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-17-fubaruba-portrait.md",
    "content": "---\ntitle: \"Side hoodies of gray\"\nexcerpt: \"PaperFaces portrait of @Fubaruba drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fubaruba-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fubaruba-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Fubaruba](https://twitter.com/Fubaruba).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-fubaruba-process-1-750.jpg)](/assets/images/paperfaces-fubaruba-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-fubaruba-process-2-600.jpg)](/assets/images/paperfaces-fubaruba-process-2-lg.jpg)\n[![](/assets/images/paperfaces-fubaruba-process-3-600.jpg)](/assets/images/paperfaces-fubaruba-process-3-lg.jpg)\n[![](/assets/images/paperfaces-fubaruba-process-4-600.jpg)](/assets/images/paperfaces-fubaruba-process-4-lg.jpg)\n[![](/assets/images/paperfaces-fubaruba-process-5-600.jpg)](/assets/images/paperfaces-fubaruba-process-5-lg.jpg)\n[![](/assets/images/paperfaces-fubaruba-process-6-600.jpg)](/assets/images/paperfaces-fubaruba-process-6-lg.jpg)\n[![](/assets/images/paperfaces-fubaruba-process-7-600.jpg)](/assets/images/paperfaces-fubaruba-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-18-brandice-portrait.md",
    "content": "---\ntitle: \"Scarfie selfies\"\nexcerpt: \"PaperFaces portrait of @brandice drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-brandice-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-brandice-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@brandice](https://twitter.com/brandice).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-brandice-process-1-750.jpg)](/assets/images/paperfaces-brandice-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-brandice-process-2-600.jpg)](/assets/images/paperfaces-brandice-process-2-lg.jpg)\n[![](/assets/images/paperfaces-brandice-process-3-600.jpg)](/assets/images/paperfaces-brandice-process-3-lg.jpg)\n[![](/assets/images/paperfaces-brandice-process-4-600.jpg)](/assets/images/paperfaces-brandice-process-4-lg.jpg)\n[![](/assets/images/paperfaces-brandice-process-5-600.jpg)](/assets/images/paperfaces-brandice-process-5-lg.jpg)\n[![](/assets/images/paperfaces-brandice-process-6-600.jpg)](/assets/images/paperfaces-brandice-process-6-lg.jpg)\n[![](/assets/images/paperfaces-brandice-process-7-600.jpg)](/assets/images/paperfaces-brandice-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-22-behindthehorns-portrait.md",
    "content": "---\ntitle: \"5 shades of pink\"\nexcerpt: \"PaperFaces portrait of @BehindTheHorns drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-behindthehorns-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-behindthehorns-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@BehindTheHorns](https://twitter.com/BehindTheHorns).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-behindthehorns-process-1-750.jpg)](/assets/images/paperfaces-behindthehorns-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-behindthehorns-process-2-600.jpg)](/assets/images/paperfaces-behindthehorns-process-2-lg.jpg)\n[![](/assets/images/paperfaces-behindthehorns-process-3-600.jpg)](/assets/images/paperfaces-behindthehorns-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-22-cupcakelarissa-portrait.md",
    "content": "---\ntitle: \"Yellow sleeveless\"\nexcerpt: \"PaperFaces portrait of @cupcakelarissa drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cupcakelarissa-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cupcakelarissa-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/cupcakelarissa\">@cupcakelarissa</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cupcakelarissa-process-1-750.jpg)](/assets/images/paperfaces-cupcakelarissa-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-cupcakelarissa-process-2-600.jpg)](/assets/images/paperfaces-cupcakelarissa-process-2-lg.jpg)\n[![](/assets/images/paperfaces-cupcakelarissa-process-3-600.jpg)](/assets/images/paperfaces-cupcakelarissa-process-3-lg.jpg)\n[![](/assets/images/paperfaces-cupcakelarissa-process-4-600.jpg)](/assets/images/paperfaces-cupcakelarissa-process-4-lg.jpg)\n[![](/assets/images/paperfaces-cupcakelarissa-process-5-600.jpg)](/assets/images/paperfaces-cupcakelarissa-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-22-hawk-se-portrait.md",
    "content": "---\ntitle: \"The sky ran red with blood\"\nexcerpt: \"PaperFaces portrait of @Hawk_SE drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hawk-se-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hawk-se-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/Hawk_SE\">@Hawk_SE</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-hawk-se-process-1-600.jpg)](/assets/images/paperfaces-hawk-se-process-1-lg.jpg)\n[![](/assets/images/paperfaces-hawk-se-process-2-600.jpg)](/assets/images/paperfaces-hawk-se-process-2-lg.jpg)\n[![](/assets/images/paperfaces-hawk-se-process-3-600.jpg)](/assets/images/paperfaces-hawk-se-process-3-lg.jpg)\n[![](/assets/images/paperfaces-hawk-se-process-4-600.jpg)](/assets/images/paperfaces-hawk-se-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-22-ninomh-2-portrait.md",
    "content": "---\ntitle: \"Triforce of Courage\"\nexcerpt: \"PaperFaces portrait of @ninoMH drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ninomh-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ninomh-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nThey say you never forget your first *Triforce of Courage*. PaperFaces portrait commission of <a href=\"https://twitter.com/ninoMH\">@ninoMH</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ninomh-process-1-750.jpg)](/assets/images/paperfaces-ninomh-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-ninomh-process-2-600.jpg)](/assets/images/paperfaces-ninomh-process-2-lg.jpg)\n[![](/assets/images/paperfaces-ninomh-process-3-600.jpg)](/assets/images/paperfaces-ninomh-process-3-lg.jpg)\n[![](/assets/images/paperfaces-ninomh-process-4-600.jpg)](/assets/images/paperfaces-ninomh-process-4-lg.jpg)\n[![](/assets/images/paperfaces-ninomh-process-5-600.jpg)](/assets/images/paperfaces-ninomh-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-28-annekoehler-portrait.md",
    "content": "---\ntitle: \"Wood grain practices\"\nexcerpt: \"PaperFaces portrait of @Annekoehler drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-annekoehler-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-annekoehler-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Annekoehler](https://twitter.com/Annekoehler).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-annekoehler-process-1-600.jpg)](/assets/images/paperfaces-annekoehler-process-1-lg.jpg)\n[![](/assets/images/paperfaces-annekoehler-process-2-600.jpg)](/assets/images/paperfaces-annekoehler-process-2-lg.jpg)\n[![](/assets/images/paperfaces-annekoehler-process-3-600.jpg)](/assets/images/paperfaces-annekoehler-process-3-lg.jpg)\n[![](/assets/images/paperfaces-annekoehler-process-4-600.jpg)](/assets/images/paperfaces-annekoehler-process-4-lg.jpg)\n[![](/assets/images/paperfaces-annekoehler-process-5-600.jpg)](/assets/images/paperfaces-annekoehler-process-5-lg.jpg)\n[![](/assets/images/paperfaces-annekoehler-process-6-600.jpg)](/assets/images/paperfaces-annekoehler-process-6-lg.jpg)\n[![](/assets/images/paperfaces-annekoehler-process-7-600.jpg)](/assets/images/paperfaces-annekoehler-process-7-lg.jpg)\n[![](/assets/images/paperfaces-annekoehler-process-8-600.jpg)](/assets/images/paperfaces-annekoehler-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-28-basbou-portrait.md",
    "content": "---\ntitle: \"Can you find the penquin?\"\nexcerpt: \"PaperFaces portrait of @basbou drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-basbou-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-basbou-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@basbou](https://twitter.com/basbou).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-basbou-process-1-600.jpg)](/assets/images/paperfaces-basbou-process-1-lg.jpg)\n[![](/assets/images/paperfaces-basbou-process-2-600.jpg)](/assets/images/paperfaces-basbou-process-2-lg.jpg)\n[![](/assets/images/paperfaces-basbou-process-3-600.jpg)](/assets/images/paperfaces-basbou-process-3-lg.jpg)\n[![](/assets/images/paperfaces-basbou-process-4-600.jpg)](/assets/images/paperfaces-basbou-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-28-hampusn-portrait.md",
    "content": "---\ntitle: \"Sippy sip from the big cup\"\nexcerpt: \"PaperFaces portrait of @hampusn drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hampusn-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hampusn-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@hampusn](https://twitter.com/hampusn).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-hampusn-process-1-750.jpg)](/assets/images/paperfaces-hampusn-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-hampusn-process-2-600.jpg)](/assets/images/paperfaces-hampusn-process-2-lg.jpg)\n[![](/assets/images/paperfaces-hampusn-process-3-600.jpg)](/assets/images/paperfaces-hampusn-process-3-lg.jpg)\n[![](/assets/images/paperfaces-hampusn-process-4-600.jpg)](/assets/images/paperfaces-hampusn-process-4-lg.jpg)\n[![](/assets/images/paperfaces-hampusn-process-5-600.jpg)](/assets/images/paperfaces-hampusn-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-28-n8zug-portrait.md",
    "content": "---\ntitle: \"7 heads, 3 backsides, and one plumber's crack\"\nexcerpt: \"PaperFaces portrait of @n8zug drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-n8zug-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-n8zug-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@n8zug](https://twitter.com/n8zug).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-n8zug-process-1-750.jpg)](/assets/images/paperfaces-n8zug-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-n8zug-process-2-600.jpg)](/assets/images/paperfaces-n8zug-process-2-lg.jpg)\n[![](/assets/images/paperfaces-n8zug-process-3-600.jpg)](/assets/images/paperfaces-n8zug-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-28-thebrendanbrown-portrait.md",
    "content": "---\ntitle: \"Geometry down the hall\"\nexcerpt: \"PaperFaces portrait of @TheBrendanBrown drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thebrendanbrown-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thebrendanbrown-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@TheBrendanBrown](https://twitter.com/TheBrendanBrown).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-thebrendanbrown-process-1-750.jpg)](/assets/images/paperfaces-thebrendanbrown-process-1-lg.jpg)\n[![](/assets/images/paperfaces-thebrendanbrown-process-2-750.jpg)](/assets/images/paperfaces-thebrendanbrown-process-2-lg.jpg)\n[![](/assets/images/paperfaces-thebrendanbrown-process-3-750.jpg)](/assets/images/paperfaces-thebrendanbrown-process-3-lg.jpg)\n[![](/assets/images/paperfaces-thebrendanbrown-process-4-750.jpg)](/assets/images/paperfaces-thebrendanbrown-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-28-timcameronryan-portrait.md",
    "content": "---\ntitle: \"Overlooking red\"\nexcerpt: \"PaperFaces portrait of @timcameronryan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-timcameronryan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-timcameronryan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@timcameronryan](https://twitter.com/timcameronryan).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-timcameronryan-process-1-750.jpg)](/assets/images/paperfaces-timcameronryan-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-timcameronryan-process-2-600.jpg)](/assets/images/paperfaces-timcameronryan-process-2-lg.jpg)\n[![](/assets/images/paperfaces-timcameronryan-process-3-600.jpg)](/assets/images/paperfaces-timcameronryan-process-3-lg.jpg)\n[![](/assets/images/paperfaces-timcameronryan-process-4-600.jpg)](/assets/images/paperfaces-timcameronryan-process-4-lg.jpg)\n[![](/assets/images/paperfaces-timcameronryan-process-5-600.jpg)](/assets/images/paperfaces-timcameronryan-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-30-alec-schmidt-portrait.md",
    "content": "---\ntitle: \"Cat familiar\"\nexcerpt: \"PaperFaces portrait of @alec_schmidt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alec-schmidt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alec-schmidt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@alec_schmidt](https://twitter.com/alec_schmidt).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-alec-schmidt-process-1-600.jpg)](/assets/images/paperfaces-alec-schmidt-process-1-lg.jpg)\n[![](/assets/images/paperfaces-alec-schmidt-process-2-600.jpg)](/assets/images/paperfaces-alec-schmidt-process-2-lg.jpg)\n[![](/assets/images/paperfaces-alec-schmidt-process-3-600.jpg)](/assets/images/paperfaces-alec-schmidt-process-3-lg.jpg)\n[![](/assets/images/paperfaces-alec-schmidt-process-4-600.jpg)](/assets/images/paperfaces-alec-schmidt-process-4-lg.jpg)\n[![](/assets/images/paperfaces-alec-schmidt-process-5-600.jpg)](/assets/images/paperfaces-alec-schmidt-process-5-lg.jpg)\n[![](/assets/images/paperfaces-alec-schmidt-process-6-600.jpg)](/assets/images/paperfaces-alec-schmidt-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-30-xherzdame-portrait.md",
    "content": "---\ntitle: \"Kissy kissy\"\nexcerpt: \"PaperFaces portrait of @xHerzdame drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-xherzdame-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-xherzdame-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@xHerzdame](https://twitter.com/xHerzdame).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-xherzdame-process-1-600.jpg)](/assets/images/paperfaces-xherzdame-process-1-lg.jpg)\n[![](/assets/images/paperfaces-xherzdame-process-2-600.jpg)](/assets/images/paperfaces-xherzdame-process-2-lg.jpg)\n[![](/assets/images/paperfaces-xherzdame-process-3-600.jpg)](/assets/images/paperfaces-xherzdame-process-3-lg.jpg)\n[![](/assets/images/paperfaces-xherzdame-process-4-600.jpg)](/assets/images/paperfaces-xherzdame-process-4-lg.jpg)\n[![](/assets/images/paperfaces-xherzdame-process-5-600.jpg)](/assets/images/paperfaces-xherzdame-process-5-lg.jpg)\n[![](/assets/images/paperfaces-xherzdame-process-6-600.jpg)](/assets/images/paperfaces-xherzdame-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-10-31-klikekyle-portrait.md",
    "content": "---\ntitle: \"Yankees cap\"\nexcerpt: \"PaperFaces portrait of @klikekyle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-klikekyle-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-klikekyle-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@klikekyle](https://twitter.com/klikekyle).\n\n* **Stylus:** None\n* **Application:** [Paper by FiftyThree for iOS](http://www.fiftythree.com/paper)\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-klikekyle-process-1-750.jpg)](/assets/images/paperfaces-klikekyle-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-klikekyle-process-2-600.jpg)](/assets/images/paperfaces-klikekyle-process-2-lg.jpg)\n[![](/assets/images/paperfaces-klikekyle-process-3-600.jpg)](/assets/images/paperfaces-klikekyle-process-3-lg.jpg)\n[![](/assets/images/paperfaces-klikekyle-process-4-600.jpg)](/assets/images/paperfaces-klikekyle-process-4-lg.jpg)\n[![](/assets/images/paperfaces-klikekyle-process-5-600.jpg)](/assets/images/paperfaces-klikekyle-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-04-nevyn-portrait.md",
    "content": "---\ntitle: \"Half light, half dark\"\nexcerpt: \"PaperFaces portrait of @nevyn drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nevyn-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nevyn-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@nevyn](https://twitter.com/nevyn).\n\n* **Stylus:** None\n* **Application:** [Paper by FiftyThree for iOS](http://www.fiftythree.com/paper)\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-nevyn-process-1-600.jpg)](/assets/images/paperfaces-nevyn-process-1-lg.jpg)\n[![](/assets/images/paperfaces-nevyn-process-2-600.jpg)](/assets/images/paperfaces-nevyn-process-2-lg.jpg)\n[![](/assets/images/paperfaces-nevyn-process-3-600.jpg)](/assets/images/paperfaces-nevyn-process-3-lg.jpg)\n[![](/assets/images/paperfaces-nevyn-process-4-600.jpg)](/assets/images/paperfaces-nevyn-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-04-pedroloo-portrait.md",
    "content": "---\ntitle: \"Remember kids, always wear your safety belt\"\nexcerpt: \"PaperFaces portrait of @pedroloo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pedroloo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pedroloo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@pedroloo](https://twitter.com/pedroloo).\n\n* **Stylus:** None\n* **Application:** [Paper by FiftyThree for iOS](http://www.fiftythree.com/paper)\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-pedroloo-process-1-600.jpg)](/assets/images/paperfaces-pedroloo-process-1-lg.jpg)\n[![](/assets/images/paperfaces-pedroloo-process-2-600.jpg)](/assets/images/paperfaces-pedroloo-process-2-lg.jpg)\n[![](/assets/images/paperfaces-pedroloo-process-3-600.jpg)](/assets/images/paperfaces-pedroloo-process-3-lg.jpg)\n[![](/assets/images/paperfaces-pedroloo-process-4-600.jpg)](/assets/images/paperfaces-pedroloo-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-04-sammycostello-portrait.md",
    "content": "---\ntitle: \"Locked in a pink room\"\nexcerpt: \"PaperFaces portrait of @SammyCostello drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sammycostello-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sammycostello-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@SammyCostello](https://twitter.com/SammyCostello).\n\n* **Stylus:** None\n* **Application:** [Paper by FiftyThree for iOS](http://www.fiftythree.com/paper)\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-sammycostello-process-1-600.jpg)](/assets/images/paperfaces-sammycostello-process-1-lg.jpg)\n[![](/assets/images/paperfaces-sammycostello-process-2-600.jpg)](/assets/images/paperfaces-sammycostello-process-2-lg.jpg)\n[![](/assets/images/paperfaces-sammycostello-process-3-600.jpg)](/assets/images/paperfaces-sammycostello-process-3-lg.jpg)\n[![](/assets/images/paperfaces-sammycostello-process-4-600.jpg)](/assets/images/paperfaces-sammycostello-process-4-lg.jpg)\n[![](/assets/images/paperfaces-sammycostello-process-5-600.jpg)](/assets/images/paperfaces-sammycostello-process-5-lg.jpg)\n[![](/assets/images/paperfaces-sammycostello-process-6-600.jpg)](/assets/images/paperfaces-sammycostello-process-6-lg.jpg)\n[![](/assets/images/paperfaces-sammycostello-process-7-600.jpg)](/assets/images/paperfaces-sammycostello-process-7-lg.jpg)\n[![](/assets/images/paperfaces-sammycostello-process-8-600.jpg)](/assets/images/paperfaces-sammycostello-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-04-sdevore-portrait.md",
    "content": "---\ntitle: \"Rock and roll\"\nexcerpt: \"PaperFaces portrait of @sdevore drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sdevore-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sdevore-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sdevore](https://twitter.com/sdevore).\n\n* **Stylus:** None\n* **Application:** [Paper by FiftyThree for iOS](http://www.fiftythree.com/paper)\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-sdevore-process-1-600.jpg)](/assets/images/paperfaces-sdevore-process-1-lg.jpg)\n[![](/assets/images/paperfaces-sdevore-process-2-600.jpg)](/assets/images/paperfaces-sdevore-process-2-lg.jpg)\n[![](/assets/images/paperfaces-sdevore-process-3-600.jpg)](/assets/images/paperfaces-sdevore-process-3-lg.jpg)\n[![](/assets/images/paperfaces-sdevore-process-4-600.jpg)](/assets/images/paperfaces-sdevore-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-06-iucounu-portrait.md",
    "content": "---\ntitle: \"Hey Darkman, how do you like your steaks?\"\nexcerpt: \"PaperFaces portrait of @iucounu drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-iucounu-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-iucounu-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@iucounu](https://twitter.com/iucounu).\n\n* **Stylus:** None\n* **Application:** [Paper by FiftyThree for iOS](http://www.fiftythree.com/paper)\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-iucounu-process-1-750.jpg)](/assets/images/paperfaces-iucounu-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-iucounu-process-2-600.jpg)](/assets/images/paperfaces-iucounu-process-2-lg.jpg)\n[![](/assets/images/paperfaces-iucounu-process-3-600.jpg)](/assets/images/paperfaces-iucounu-process-3-lg.jpg)\n[![](/assets/images/paperfaces-iucounu-process-4-600.jpg)](/assets/images/paperfaces-iucounu-process-4-lg.jpg)\n[![](/assets/images/paperfaces-iucounu-process-5-600.jpg)](/assets/images/paperfaces-iucounu-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-06-jr-plusplus-portrait.md",
    "content": "---\ntitle: \"Hairs on fire\"\nexcerpt: \"PaperFaces portrait of @jr_plusplus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jr-plusplus-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jr-plusplus-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@jr_plusplus](https://twitter.com/jr_plusplus).\n\n* **Stylus:** None\n* **Application:** [Paper by FiftyThree for iOS](http://www.fiftythree.com/paper)\n\n{% figure caption:\"Sketching out the composition with pencil.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jr-plusplus-process-1-750.jpg)](/assets/images/paperfaces-jr-plusplus-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-jr-plusplus-process-2-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-2-lg.jpg)\n[![](/assets/images/paperfaces-jr-plusplus-process-3-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-3-lg.jpg)\n[![](/assets/images/paperfaces-jr-plusplus-process-4-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-4-lg.jpg)\n[![](/assets/images/paperfaces-jr-plusplus-process-5-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-5-lg.jpg)\n[![](/assets/images/paperfaces-jr-plusplus-process-6-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-6-lg.jpg)\n[![](/assets/images/paperfaces-jr-plusplus-process-7-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-7-lg.jpg)\n[![](/assets/images/paperfaces-jr-plusplus-process-8-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-8-lg.jpg)\n[![](/assets/images/paperfaces-jr-plusplus-process-9-600.jpg)](/assets/images/paperfaces-jr-plusplus-process-9-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-08-aurora-portrait.md",
    "content": "---\ntitle: \"Sun dress\"\nexcerpt: \"PaperFaces portrait of Aurora drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-aurora.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-aurora-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nSomething a little different from the normal no face, square format composition. PaperFaces portrait commission for <a href=\"https://twitter.com/bobbydharrell\">@bobbydharrell</a> of his daughter Aurora.\n\nFirst drawing I've completed since receiving yet another replacement Pogo Connect. Not sure if it's the updated firmware or the extra solder inside, but I have to press extra hard to get a full range of value. Perhaps I should take a look at the Pogo iOS app to see if I can adjust the tip's sensitivity…\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-08-wakas-mir-portrait.md",
    "content": "---\ntitle: \"Look up smile\"\nexcerpt: \"PaperFaces portrait of Wakas Mir drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-wakas-mir.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-wakas-mir-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, time lapse]\n---\n\nPaperFaces portrait commission for Wakas Mir. Making of video below.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% youtube Helg9hmHyuc %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-11-archaikh-portrait.md",
    "content": "---\ntitle: \"An exercise in gray\"\nexcerpt: \"PaperFaces portrait of @Archaikh drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-archaikh-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-archaikh-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@Archaikh](https://twitter.com/Archaikh).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Lightly sketching out the composition in pencil.\" %}\n[![](/assets/images/paperfaces-archaikh-process-1-750.jpg)](/assets/images/paperfaces-archaikh-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-archaikh-process-2-600.jpg)](/assets/images/paperfaces-archaikh-process-2-lg.jpg)\n[![](/assets/images/paperfaces-archaikh-process-3-600.jpg)](/assets/images/paperfaces-archaikh-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-11-beautiful-paine-portrait.md",
    "content": "---\ntitle: \"The kids and their Final Fantasies\"\nexcerpt: \"PaperFaces portrait of @Beautiful_Paine drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-beautiful-paine-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-beautiful-paine-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Beautiful_Paine](https://twitter.com/Beautiful_Paine).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-beautiful-paine-process-1-600.jpg)](/assets/images/paperfaces-beautiful-paine-process-1-lg.jpg)\n[![](/assets/images/paperfaces-beautiful-paine-process-2-600.jpg)](/assets/images/paperfaces-beautiful-paine-process-2-lg.jpg)\n[![](/assets/images/paperfaces-beautiful-paine-process-3-600.jpg)](/assets/images/paperfaces-beautiful-paine-process-3-lg.jpg)\n[![](/assets/images/paperfaces-beautiful-paine-process-4-600.jpg)](/assets/images/paperfaces-beautiful-paine-process-4-lg.jpg)\n[![](/assets/images/paperfaces-beautiful-paine-process-5-600.jpg)](/assets/images/paperfaces-beautiful-paine-process-5-lg.jpg)\n[![](/assets/images/paperfaces-beautiful-paine-process-6-600.jpg)](/assets/images/paperfaces-beautiful-paine-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-11-straatkatbasson-portrait.md",
    "content": "---\ntitle: \"Stylized yellow flowers\"\nexcerpt: \"PaperFaces portrait of @StraatKatBasson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-straatkatbasson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-straatkatbasson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@StraatKatBasson](https://twitter.com/StraatKatBasson).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-straatkatbasson-process-1-600.jpg)](/assets/images/paperfaces-straatkatbasson-process-1-lg.jpg)\n[![](/assets/images/paperfaces-straatkatbasson-process-2-600.jpg)](/assets/images/paperfaces-straatkatbasson-process-2-lg.jpg)\n[![](/assets/images/paperfaces-straatkatbasson-process-3-600.jpg)](/assets/images/paperfaces-straatkatbasson-process-3-lg.jpg)\n[![](/assets/images/paperfaces-straatkatbasson-process-4-600.jpg)](/assets/images/paperfaces-straatkatbasson-process-4-lg.jpg)\n[![](/assets/images/paperfaces-straatkatbasson-process-5-600.jpg)](/assets/images/paperfaces-straatkatbasson-process-5-lg.jpg)\n[![](/assets/images/paperfaces-straatkatbasson-process-6-600.jpg)](/assets/images/paperfaces-straatkatbasson-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-12-asduner-portrait.md",
    "content": "---\ntitle: \"QR coded\"\nexcerpt: \"PaperFaces portrait of @asduner drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-asduner-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-asduner-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@asduner](https://twitter.com/asduner).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-asduner-process-1-600.jpg)](/assets/images/paperfaces-asduner-process-1-lg.jpg)\n[![](/assets/images/paperfaces-asduner-process-2-600.jpg)](/assets/images/paperfaces-asduner-process-2-lg.jpg)\n[![](/assets/images/paperfaces-asduner-process-3-600.jpg)](/assets/images/paperfaces-asduner-process-3-lg.jpg)\n[![](/assets/images/paperfaces-asduner-process-4-600.jpg)](/assets/images/paperfaces-asduner-process-4-lg.jpg)\n[![](/assets/images/paperfaces-asduner-process-5-600.jpg)](/assets/images/paperfaces-asduner-process-5-lg.jpg)\n[![](/assets/images/paperfaces-asduner-process-6-600.jpg)](/assets/images/paperfaces-asduner-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-13-alexc-portrait.md",
    "content": "---\ntitle: \"Blue cool\"\nexcerpt: \"PaperFaces portrait of @alexc drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alexc-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alexc-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@alexc](https://twitter.com/alexc).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Lightly sketching out the composition in pencil.\" %}\n[![](/assets/images/paperfaces-alexc-process-1-750.jpg)](/assets/images/paperfaces-alexc-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-alexc-process-2-600.jpg)](/assets/images/paperfaces-alexc-process-2-lg.jpg)\n[![](/assets/images/paperfaces-alexc-process-3-600.jpg)](/assets/images/paperfaces-alexc-process-3-lg.jpg)\n[![](/assets/images/paperfaces-alexc-process-4-600.jpg)](/assets/images/paperfaces-alexc-process-4-lg.jpg)\n[![](/assets/images/paperfaces-alexc-process-5-600.jpg)](/assets/images/paperfaces-alexc-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-13-thor-portrait.md",
    "content": "---\ntitle: \"Thor and his big hammer\"\nexcerpt: \"PaperFaces portrait of Thor drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thor.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thor-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of Thor from *The Dark World*.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-thor-process-1-600.jpg)](/assets/images/paperfaces-thor-process-1-lg.jpg)\n[![](/assets/images/paperfaces-thor-process-2-600.jpg)](/assets/images/paperfaces-thor-process-2-lg.jpg)\n[![](/assets/images/paperfaces-thor-process-3-600.jpg)](/assets/images/paperfaces-thor-process-3-lg.jpg)\n[![](/assets/images/paperfaces-thor-process-4-600.jpg)](/assets/images/paperfaces-thor-process-4-lg.jpg)\n[![](/assets/images/paperfaces-thor-process-5-600.jpg)](/assets/images/paperfaces-thor-process-5-lg.jpg)\n[![](/assets/images/paperfaces-thor-process-6-600.jpg)](/assets/images/paperfaces-thor-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-18-enderfp-portrait.md",
    "content": "---\ntitle: \"Blue beanie monkey\"\nexcerpt: \"PaperFaces portrait of @enderFP drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-enderfp-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-enderfp-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@enderFP](https://twitter.com/enderFP).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-enderfp-process-1-600.jpg)](/assets/images/paperfaces-enderfp-process-1-lg.jpg)\n[![](/assets/images/paperfaces-enderfp-process-2-600.jpg)](/assets/images/paperfaces-enderfp-process-2-lg.jpg)\n[![](/assets/images/paperfaces-enderfp-process-3-600.jpg)](/assets/images/paperfaces-enderfp-process-3-lg.jpg)\n[![](/assets/images/paperfaces-enderfp-process-4-600.jpg)](/assets/images/paperfaces-enderfp-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-18-joshtodd-portrait.md",
    "content": "---\ntitle: \"Drawing with DayGlo\"\nexcerpt: \"PaperFaces portrait of @JoshTodd drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joshtodd-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joshtodd-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@JoshTodd](https://twitter.com/JoshTodd).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-joshtodd-process-1-600.jpg)](/assets/images/paperfaces-joshtodd-process-1-lg.jpg)\n[![](/assets/images/paperfaces-joshtodd-process-2-600.jpg)](/assets/images/paperfaces-joshtodd-process-2-lg.jpg)\n[![](/assets/images/paperfaces-joshtodd-process-3-600.jpg)](/assets/images/paperfaces-joshtodd-process-3-lg.jpg)\n[![](/assets/images/paperfaces-joshtodd-process-4-600.jpg)](/assets/images/paperfaces-joshtodd-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-18-lauren-mudrock-portrait.md",
    "content": "---\ntitle: \"Red brick hair\"\nexcerpt: \"PaperFaces portrait of Lauren Mudrock drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lauren-mudrock.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lauren-mudrock-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nDecided to try out [Sktchy](https://get.sktchy.com/) by returning the favor of an artist who drew my portrait on it. It's a shame this app didn't exist before I started my project --- I might actually use it more for inspiration. PaperFaces portrait of Lauren Mudrock.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-lauren-mudrock-process-1-600.jpg)](/assets/images/paperfaces-lauren-mudrock-process-1-lg.jpg)\n[![](/assets/images/paperfaces-lauren-mudrock-process-2-600.jpg)](/assets/images/paperfaces-lauren-mudrock-process-2-lg.jpg)\n[![](/assets/images/paperfaces-lauren-mudrock-process-3-600.jpg)](/assets/images/paperfaces-lauren-mudrock-process-3-lg.jpg)\n[![](/assets/images/paperfaces-lauren-mudrock-process-4-600.jpg)](/assets/images/paperfaces-lauren-mudrock-process-4-lg.jpg)\n[![](/assets/images/paperfaces-lauren-mudrock-process-5-600.jpg)](/assets/images/paperfaces-lauren-mudrock-process-5-lg.jpg)\n[![](/assets/images/paperfaces-lauren-mudrock-process-6-600.jpg)](/assets/images/paperfaces-lauren-mudrock-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-18-sasquatchfuzz-portrait.md",
    "content": "---\ntitle: \"All snuggled up\"\nexcerpt: \"PaperFaces portrait of @SasquatchFuzz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sasquatchfuzz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sasquatchfuzz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@SasquatchFuzz](https://twitter.com/SasquatchFuzz).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-sasquatchfuzz-process-1-600.jpg)](/assets/images/paperfaces-sasquatchfuzz-process-1-lg.jpg)\n[![](/assets/images/paperfaces-sasquatchfuzz-process-2-600.jpg)](/assets/images/paperfaces-sasquatchfuzz-process-2-lg.jpg)\n[![](/assets/images/paperfaces-sasquatchfuzz-process-3-600.jpg)](/assets/images/paperfaces-sasquatchfuzz-process-3-lg.jpg)\n[![](/assets/images/paperfaces-sasquatchfuzz-process-4-600.jpg)](/assets/images/paperfaces-sasquatchfuzz-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-20-guavagleelesley-portrait.md",
    "content": "---\ntitle: \"I caught a fish this big\"\nexcerpt: \"PaperFaces portrait of @GuavaGleeLesley drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-guavagleelesley-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-guavagleelesley-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nFirst portrait I've drawn using that new Pencil stylus everyone is talking about. Using the new blending feature was a ton of fun and really came in handy for creating the soft water effect in the background.\n\nPaperFaces portrait of [@GuavaGleeLesley](https://twitter.com/GuavaGleeLesley).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-guavagleelesley-process-1-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-1-lg.jpg)\n[![](/assets/images/paperfaces-guavagleelesley-process-2-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-2-lg.jpg)\n[![](/assets/images/paperfaces-guavagleelesley-process-3-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-3-lg.jpg)\n[![](/assets/images/paperfaces-guavagleelesley-process-4-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-4-lg.jpg)\n[![](/assets/images/paperfaces-guavagleelesley-process-5-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-5-lg.jpg)\n[![](/assets/images/paperfaces-guavagleelesley-process-6-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-6-lg.jpg)\n[![](/assets/images/paperfaces-guavagleelesley-process-7-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-7-lg.jpg)\n[![](/assets/images/paperfaces-guavagleelesley-process-8-600.jpg)](/assets/images/paperfaces-guavagleelesley-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-20-kristian-portrait.md",
    "content": "---\ntitle: \"Drawing in the shadows\"\nexcerpt: \"PaperFaces portrait of @kristian drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kristian-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kristian-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@kristian](https://twitter.com/kristian).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-kristian-process-1-750.jpg)](/assets/images/paperfaces-kristian-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-kristian-process-2-600.jpg)](/assets/images/paperfaces-kristian-process-2-lg.jpg)\n[![](/assets/images/paperfaces-kristian-process-3-600.jpg)](/assets/images/paperfaces-kristian-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-21-manntaclaus-portrait.md",
    "content": "---\ntitle: \"Birdie by a cage\"\nexcerpt: \"PaperFaces portrait of @manntaclaus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-manntaclaus-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-manntaclaus-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@manntaclaus](https://twitter.com/manntaclaus).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-manntaclaus-process-1-750.jpg)](/assets/images/paperfaces-manntaclaus-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-manntaclaus-process-2-600.jpg)](/assets/images/paperfaces-manntaclaus-process-2-lg.jpg)\n[![](/assets/images/paperfaces-manntaclaus-process-3-600.jpg)](/assets/images/paperfaces-manntaclaus-process-3-lg.jpg)\n[![](/assets/images/paperfaces-manntaclaus-process-4-600.jpg)](/assets/images/paperfaces-manntaclaus-process-4-lg.jpg)\n[![](/assets/images/paperfaces-manntaclaus-process-5-600.jpg)](/assets/images/paperfaces-manntaclaus-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-25-darialuna-portrait.md",
    "content": "---\ntitle: \"Ghosting faces\"\nexcerpt: \"PaperFaces portrait of @DariaLuna_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-darialuna-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-darialuna-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@DariaLuna_](https://twitter.com/DariaLuna_).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-darialuna-process-1-750.jpg)](/assets/images/paperfaces-darialuna-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-darialuna-process-2-600.jpg)](/assets/images/paperfaces-darialuna-process-2-lg.jpg)\n[![](/assets/images/paperfaces-darialuna-process-3-600.jpg)](/assets/images/paperfaces-darialuna-process-3-lg.jpg)\n[![](/assets/images/paperfaces-darialuna-process-4-600.jpg)](/assets/images/paperfaces-darialuna-process-4-lg.jpg)\n[![](/assets/images/paperfaces-darialuna-process-5-600.jpg)](/assets/images/paperfaces-darialuna-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-25-ryan-gosling-portrait.md",
    "content": "---\ntitle: \"Only God Forgives\"\nexcerpt: \"PaperFaces portrait of Ryan Gosling drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ryan-gosling.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ryan-gosling-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nA scene from **Only God Forgives**. If you enjoyed the elevator scene from **Drive**, this ones for you --- the lighting in this flick is fantastic.\n\nPaperFaces portrait of Ryan Gosling.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-25-sendapalic-portrait.md",
    "content": "---\ntitle: \"Kitty on the shoulder\"\nexcerpt: \"PaperFaces portrait of @sendapalic drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sendapalic-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sendapalic-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nBlend is one of those tools that can easily be abused. Trying to limit its use to avoid going too soft and blurring brush strokes painted in Paper and retain character. I've found that blending colors and then applying a layer of light watercolor on top has a nice look.\n\nPaperFaces portrait of [@sendapalic](https://twitter.com/sendapalic).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-sendapalic-process-1-750.jpg)](/assets/images/paperfaces-sendapalic-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-sendapalic-process-2-600.jpg)](/assets/images/paperfaces-sendapalic-process-2-lg.jpg)\n[![](/assets/images/paperfaces-sendapalic-process-3-600.jpg)](/assets/images/paperfaces-sendapalic-process-3-lg.jpg)\n[![](/assets/images/paperfaces-sendapalic-process-4-600.jpg)](/assets/images/paperfaces-sendapalic-process-4-lg.jpg)\n[![](/assets/images/paperfaces-sendapalic-process-5-600.jpg)](/assets/images/paperfaces-sendapalic-process-5-lg.jpg)\n[![](/assets/images/paperfaces-sendapalic-process-6-600.jpg)](/assets/images/paperfaces-sendapalic-process-6-lg.jpg)\n[![](/assets/images/paperfaces-sendapalic-process-7-600.jpg)](/assets/images/paperfaces-sendapalic-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-25-sergei-r-portrait.md",
    "content": "---\ntitle: \"Eyes on the prize\"\nexcerpt: \"PaperFaces portrait of Sergei R. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sergei-r.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sergei-r-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nTrading drawings for drawings. PaperFaces portrait of [Sergei R.](https://sktchy.com/YRsdZH), inspiration found via Sktchy.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-sergei-r-process-1-750.jpg)](/assets/images/paperfaces-sergei-r-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-sergei-r-process-2-600.jpg)](/assets/images/paperfaces-sergei-r-process-2-lg.jpg)\n[![](/assets/images/paperfaces-sergei-r-process-3-600.jpg)](/assets/images/paperfaces-sergei-r-process-3-lg.jpg)\n[![](/assets/images/paperfaces-sergei-r-process-4-600.jpg)](/assets/images/paperfaces-sergei-r-process-4-lg.jpg)\n[![](/assets/images/paperfaces-sergei-r-process-5-600.jpg)](/assets/images/paperfaces-sergei-r-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-11-26-bollywooed-portrait.md",
    "content": "---\ntitle: \"Raining hearts\"\nexcerpt: \"PaperFaces portrait of @BollyWooed drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bollywooed-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bollywooed-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@BollyWooed](https://twitter.com/BollyWooed).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-bollywooed-process-1-600.jpg)](/assets/images/paperfaces-bollywooed-process-1-lg.jpg)\n[![](/assets/images/paperfaces-bollywooed-process-2-600.jpg)](/assets/images/paperfaces-bollywooed-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-carmel-g-portrait.md",
    "content": "---\ntitle: \"Fire tipped hair\"\nexcerpt: \"PaperFaces portrait of Carmel G. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-carmel-g.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-carmel-g-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of [Carmel G.](https://sktchy.com/uViYnH).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-carmel-g-process-1-750.jpg)](/assets/images/paperfaces-carmel-g-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-carmel-g-process-2-600.jpg)](/assets/images/paperfaces-carmel-g-process-2-lg.jpg)\n[![](/assets/images/paperfaces-carmel-g-process-3-600.jpg)](/assets/images/paperfaces-carmel-g-process-3-lg.jpg)\n[![](/assets/images/paperfaces-carmel-g-process-4-600.jpg)](/assets/images/paperfaces-carmel-g-process-4-lg.jpg)\n[![](/assets/images/paperfaces-carmel-g-process-5-600.jpg)](/assets/images/paperfaces-carmel-g-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-christianna-p-portrait.md",
    "content": "---\ntitle: \"The color of gravy\"\nexcerpt: \"PaperFaces portrait of Christianna P. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-christianna-p.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-christianna-p-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nTrading drawings for drawings. PaperFaces portrait of [Christianna P.](https://sktchy.com/wkGeKD), inspiration found via Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-christianna-p-process-1-600.jpg)](/assets/images/paperfaces-christianna-p-process-1-lg.jpg)\n[![](/assets/images/paperfaces-christianna-p-process-2-600.jpg)](/assets/images/paperfaces-christianna-p-process-2-lg.jpg)\n[![](/assets/images/paperfaces-christianna-p-process-3-600.jpg)](/assets/images/paperfaces-christianna-p-process-3-lg.jpg)\n[![](/assets/images/paperfaces-christianna-p-process-4-600.jpg)](/assets/images/paperfaces-christianna-p-process-4-lg.jpg)\n[![](/assets/images/paperfaces-christianna-p-process-5-600.jpg)](/assets/images/paperfaces-christianna-p-process-5-lg.jpg)\n[![](/assets/images/paperfaces-christianna-p-process-6-600.jpg)](/assets/images/paperfaces-christianna-p-process-6-lg.jpg)\n[![](/assets/images/paperfaces-christianna-p-process-7-600.jpg)](/assets/images/paperfaces-christianna-p-process-7-lg.jpg)\n[![](/assets/images/paperfaces-christianna-p-process-8-600.jpg)](/assets/images/paperfaces-christianna-p-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-haley-portrait.md",
    "content": "---\ntitle: \"Two fer\"\nexcerpt: \"PaperFaces portrait of @haley drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-haley-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-haley-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@haley](https://twitter.com/haley).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-haley-process-1-750.jpg)](/assets/images/paperfaces-haley-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-haley-process-2-600.jpg)](/assets/images/paperfaces-haley-process-2-lg.jpg)\n[![](/assets/images/paperfaces-haley-process-3-600.jpg)](/assets/images/paperfaces-haley-process-3-lg.jpg)\n[![](/assets/images/paperfaces-haley-process-4-600.jpg)](/assets/images/paperfaces-haley-process-4-lg.jpg)\n[![](/assets/images/paperfaces-haley-process-5-600.jpg)](/assets/images/paperfaces-haley-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-idhanta-portrait.md",
    "content": "---\ntitle: \"Painterly orange wall\"\nexcerpt: \"PaperFaces portrait of @idhanta drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-idhanta-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-idhanta-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@idhanta](https://twitter.com/idhanta).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-idhanta-process-1-600.jpg)](/assets/images/paperfaces-idhanta-process-1-lg.jpg)\n[![](/assets/images/paperfaces-idhanta-process-2-600.jpg)](/assets/images/paperfaces-idhanta-process-2-lg.jpg)\n[![](/assets/images/paperfaces-idhanta-process-3-600.jpg)](/assets/images/paperfaces-idhanta-process-3-lg.jpg)\n[![](/assets/images/paperfaces-idhanta-process-4-600.jpg)](/assets/images/paperfaces-idhanta-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-joeycarmello-portrait.md",
    "content": "---\ntitle: \"Zipped up by sea\"\nexcerpt: \"PaperFaces portrait of @joeycarmello drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joeycarmello-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joeycarmello-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@joeycarmello](https://twitter.com/joeycarmello).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-joeycarmello-process-1-600.jpg)](/assets/images/paperfaces-joeycarmello-process-1-lg.jpg)\n[![](/assets/images/paperfaces-joeycarmello-process-2-600.jpg)](/assets/images/paperfaces-joeycarmello-process-2-lg.jpg)\n[![](/assets/images/paperfaces-joeycarmello-process-3-600.jpg)](/assets/images/paperfaces-joeycarmello-process-3-lg.jpg)\n[![](/assets/images/paperfaces-joeycarmello-process-4-600.jpg)](/assets/images/paperfaces-joeycarmello-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-paviro-portrait.md",
    "content": "---\ntitle: \"Drawing in shadows\"\nexcerpt: \"PaperFaces portrait of @paviro_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-paviro-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-paviro-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@paviro_](https://twitter.com/paviro_).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![](/assets/images/paperfaces-paviro-process-1-600.jpg)](/assets/images/paperfaces-paviro-process-1-lg.jpg)\n[![](/assets/images/paperfaces-paviro-process-2-600.jpg)](/assets/images/paperfaces-paviro-process-2-lg.jpg)\n[![](/assets/images/paperfaces-paviro-process-3-600.jpg)](/assets/images/paperfaces-paviro-process-3-lg.jpg)\n[![](/assets/images/paperfaces-paviro-process-4-600.jpg)](/assets/images/paperfaces-paviro-process-4-lg.jpg)\n[![](/assets/images/paperfaces-paviro-process-5-600.jpg)](/assets/images/paperfaces-paviro-process-5-lg.jpg)\n[![](/assets/images/paperfaces-paviro-process-6-600.jpg)](/assets/images/paperfaces-paviro-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-reason2live-portrait.md",
    "content": "---\ntitle: \"Reason 2 Live\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-reason2live.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-reason2live-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-reason2live-process-1-750.jpg)](/assets/images/paperfaces-reason2live-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-reason2live-process-2-600.jpg)](/assets/images/paperfaces-reason2live-process-2-lg.jpg)\n[![](/assets/images/paperfaces-reason2live-process-3-600.jpg)](/assets/images/paperfaces-reason2live-process-3-lg.jpg)\n[![](/assets/images/paperfaces-reason2live-process-4-600.jpg)](/assets/images/paperfaces-reason2live-process-4-lg.jpg)\n[![](/assets/images/paperfaces-reason2live-process-5-600.jpg)](/assets/images/paperfaces-reason2live-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-time-travelers-portrait.md",
    "content": "---\ntitle: \"Time Travelers\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-time-travelers.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-time-travelers-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"About 2 hours of drawing and painting.\" %}\n{% youtube zFG6M8PKdlc %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-02-wendy-rose-sktchy-portrait.md",
    "content": "---\ntitle: \"Rated blue for bright\"\nexcerpt: \"PaperFaces portrait of Wendy Rose drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-wendy-rose-sktchy.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-wendy-rose-sktchy-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of [Wendy Rose](https://sktchy.com/nlpXWH), inspiration found via Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-wendy-rose-sktchy-process-1-600.jpg)](/assets/images/paperfaces-wendy-rose-sktchy-process-1-lg.jpg)\n[![](/assets/images/paperfaces-wendy-rose-sktchy-process-2-600.jpg)](/assets/images/paperfaces-wendy-rose-sktchy-process-2-lg.jpg)\n[![](/assets/images/paperfaces-wendy-rose-sktchy-process-3-600.jpg)](/assets/images/paperfaces-wendy-rose-sktchy-process-3-lg.jpg)\n[![](/assets/images/paperfaces-wendy-rose-sktchy-process-4-600.jpg)](/assets/images/paperfaces-wendy-rose-sktchy-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-05-effy-e-portrait.md",
    "content": "---\ntitle: \"Undercut inspiration\"\nexcerpt: \"PaperFaces portrait of Effy E. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-effy-e.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-effy-e-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of [Effy E.](https://sktchy.com/FH2qnD), inspiration found via Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-effy-e-process-1-750.jpg)](/assets/images/paperfaces-effy-e-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-effy-e-process-2-600.jpg)](/assets/images/paperfaces-effy-e-process-2-lg.jpg)\n[![](/assets/images/paperfaces-effy-e-process-3-600.jpg)](/assets/images/paperfaces-effy-e-process-3-lg.jpg)\n[![](/assets/images/paperfaces-effy-e-process-4-600.jpg)](/assets/images/paperfaces-effy-e-process-4-lg.jpg)\n[![](/assets/images/paperfaces-effy-e-process-5-600.jpg)](/assets/images/paperfaces-effy-e-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-05-oxodesign-portrait.md",
    "content": "---\ntitle: \"Bright whites\"\nexcerpt: \"PaperFaces portrait of @oxodesign drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-oxodesign-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-oxodesign-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/oxodesign\">@oxodesign</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-oxodesign-process-1-750.jpg)](/assets/images/paperfaces-oxodesign-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-oxodesign-process-2-600.jpg)](/assets/images/paperfaces-oxodesign-process-2-lg.jpg)\n[![](/assets/images/paperfaces-oxodesign-process-3-600.jpg)](/assets/images/paperfaces-oxodesign-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-05-patrickch-portrait.md",
    "content": "---\ntitle: \"SNIKT!\"\nexcerpt: \"PaperFaces portrait of @PatrickCH drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-patrickch-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-patrickch-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@PatrickCH](https://twitter.com/PatrickCH).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-patrickch-process-1-750.jpg)](/assets/images/paperfaces-patrickch-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-patrickch-process-2-600.jpg)](/assets/images/paperfaces-patrickch-process-2-lg.jpg)\n[![](/assets/images/paperfaces-patrickch-process-3-600.jpg)](/assets/images/paperfaces-patrickch-process-3-lg.jpg)\n[![](/assets/images/paperfaces-patrickch-process-4-600.jpg)](/assets/images/paperfaces-patrickch-process-4-lg.jpg)\n[![](/assets/images/paperfaces-patrickch-process-5-600.jpg)](/assets/images/paperfaces-patrickch-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-09-dermike-portrait.md",
    "content": "---\ntitle: \"Afterglow face blurs\"\nexcerpt: \"PaperFaces portrait of @dermike drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dermike-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dermike-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-09-07T16:13:21-04:00\n---\n\nDecided to put some time in with 53's new Pencil stylus and experiment with the [Blend feature]({% post_url /mastering-paper/2013-11-20-pencil-first-look %}) some more. I may have pushed the blurs too far since I think it killed a lot of the layered watercolor textures I started with…\n\nMental note: a little Blend goes a long way.\n\nPaperFaces portrait of [@dermike](https://twitter.com/dermike).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"In process blending.\" %}\n[![](/assets/images/paperfaces-dermike-process-1-750.jpg)](/assets/images/paperfaces-dermike-process-1-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-09-esty-c-portrait.md",
    "content": "---\ntitle: \"For the flowers against pink\"\nexcerpt: \"PaperFaces portrait of Esty C. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-esty-c-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-esty-c-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, time lapse]\n---\n\nPaperFaces portrait of [Esty C.](https://sktchy.com/WfStFC), inspiration found via Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-esty-c-process-1-750.jpg)](/assets/images/paperfaces-esty-c-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"About 2 hours of drawing and painting.\" %}\n{% youtube aoELcBcOAo4 %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-09-grantlandram-portrait.md",
    "content": "---\ntitle: \"Grayscale and Pencil and Blend oh my!\"\nexcerpt: \"PaperFaces portrait of @GrantLandram drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-grantlandram-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-grantlandram-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, time lapse]\n---\n\nDecided to try and create a true time lapse video showing off 53's new Pencil stylus another go. \n\nTo record the footage I used a [cheap GorillaPod knockoff](http://www.amazon.com/gp/product/B007NFI656/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B007NFI656&linkCode=as2&tag=mademist-20) to mount my iPhone 5s around a floor lamp. Once attached I swung it over my desk to get a top down view of the iPad's screen. To record I used the iOS app [**Lapse It**](http://www.lapseit.com/) to capture an image every second and then output as a 1080p MP4 video that could be edited further in **Adobe After Effects**.\n\nThe time lapse effect came out ok, but have to look at lighting the work area better next time. Most of the footage was way too dark and the whites on the iPad's screen super blown out, which made setting an accurate white balance challenging.\n\nPaperFaces portrait of [@GrantLandram](https://twitter.com/GrantLandram).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"About 2 hours of drawing and painting with 53's new Pencil stylus.\" %}\n{% youtube JqVzqVG0e5g %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-10-angel-frias-portrait.md",
    "content": "---\ntitle: \"Not a club\"\nexcerpt: \"PaperFaces portrait of @angel__frias drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-angel-frias-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-angel-frias-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@angel__frias](https://instagram.com/angel__frias).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-angel-frias-process-1-750.jpg)](/assets/images/paperfaces-angel-frias-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-angel-frias-process-2-600.jpg)](/assets/images/paperfaces-angel-frias-process-2-lg.jpg)\n[![](/assets/images/paperfaces-angel-frias-process-3-600.jpg)](/assets/images/paperfaces-angel-frias-process-3-lg.jpg)\n[![](/assets/images/paperfaces-angel-frias-process-4-600.jpg)](/assets/images/paperfaces-angel-frias-process-4-lg.jpg)\n[![](/assets/images/paperfaces-angel-frias-process-5-600.jpg)](/assets/images/paperfaces-angel-frias-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-11-juan-kyle-portrait.md",
    "content": "---\ntitle: \"Best man\"\nexcerpt: \"PaperFaces portrait of Juan and Kyle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-juan-kyle.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-juan-kyle-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\n---\n\nDrawing small faces with Paper and Pencil is no joke. PaperFaces portrait of Juan and Kyle.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Drawn with Pencil by 53 in about an hour.\" %}\n{% youtube LnoRZarcrjc %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-11-rotub-portrait.md",
    "content": "---\ntitle: \"Rohan robber\"\nexcerpt: \"PaperFaces portrait of @rotub drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rotub-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rotub-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/rotub\">@rotub</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-rotub-process-1-750.jpg)](/assets/images/paperfaces-rotub-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-rotub-process-2-600.jpg)](/assets/images/paperfaces-rotub-process-2-lg.jpg)\n[![](/assets/images/paperfaces-rotub-process-3-600.jpg)](/assets/images/paperfaces-rotub-process-3-lg.jpg)\n[![](/assets/images/paperfaces-rotub-process-4-600.jpg)](/assets/images/paperfaces-rotub-process-4-lg.jpg)\n[![](/assets/images/paperfaces-rotub-process-5-600.jpg)](/assets/images/paperfaces-rotub-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-16-bigmajk-portrait.md",
    "content": "---\ntitle: \"Movember is over\"\nexcerpt: \"PaperFaces portrait of @BigMajk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bigmajk-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bigmajk-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/BigMajk\">@BigMajk</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![](/assets/images/paperfaces-bigmajk-process-1-750.jpg)](/assets/images/paperfaces-bigmajk-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![](/assets/images/paperfaces-bigmajk-process-2-600.jpg)](/assets/images/paperfaces-bigmajk-process-2-lg.jpg)\n[![](/assets/images/paperfaces-bigmajk-process-3-600.jpg)](/assets/images/paperfaces-bigmajk-process-3-lg.jpg)\n[![](/assets/images/paperfaces-bigmajk-process-4-600.jpg)](/assets/images/paperfaces-bigmajk-process-4-lg.jpg)\n[![](/assets/images/paperfaces-bigmajk-process-5-600.jpg)](/assets/images/paperfaces-bigmajk-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-16-jonathanhagans-2-portrait.md",
    "content": "---\ntitle: \"Happy family\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jonathanhagans-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jonathanhagans-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nAnother rare appearance of actual faces…\n\nPaperFaces portrait commission for <a href=\"https://twitter.com/jonathanhagans\">@jonathanhagans</a>.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-2-process-1-750.jpg)](/assets/images/paperfaces-jonathanhagans-2-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-2-process-2-600.jpg)](/assets/images/paperfaces-jonathanhagans-2-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-2-process-3-600.jpg)](/assets/images/paperfaces-jonathanhagans-2-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-2-process-4-600.jpg)](/assets/images/paperfaces-jonathanhagans-2-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-2-process-5-600.jpg)](/assets/images/paperfaces-jonathanhagans-2-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-16-jonathanhagans-portrait.md",
    "content": "---\ntitle: \"Winter faces\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jonathanhagans-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jonathanhagans-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nI don't often draw faces, but with the right photo reference I sometimes attempt it. \n\nTo build up values in the faces I used the pencil tool exclusively --- adding shadows and shading before applying watercolor. Usually I do the opposite by applying a watercolor base first and then penciling over to refine. Quite happy with how everything turned out.\n\nPaperFaces portrait commission for [@jonathanhagans](https://twitter.com/jonathanhagans).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-process-1-600.jpg)](/assets/images/paperfaces-jonathanhagans-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-process-2-600.jpg)](/assets/images/paperfaces-jonathanhagans-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-process-3-600.jpg)](/assets/images/paperfaces-jonathanhagans-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-process-4-600.jpg)](/assets/images/paperfaces-jonathanhagans-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-16-kasey-k-portrait.md",
    "content": "---\ntitle: \"Polka dot drape\"\nexcerpt: \"PaperFaces portrait of Kasey K. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kasey-k.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kasey-k-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of [Kasey K](https://sktchy.com/mKWI5D).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kasey-k-process-1-750.jpg)](/assets/images/paperfaces-kasey-k-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kasey-k-process-2-600.jpg)](/assets/images/paperfaces-kasey-k-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kasey-k-process-3-600.jpg)](/assets/images/paperfaces-kasey-k-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kasey-k-process-4-600.jpg)](/assets/images/paperfaces-kasey-k-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kasey-k-process-5-600.jpg)](/assets/images/paperfaces-kasey-k-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-16-knurpsi-portrait.md",
    "content": "---\ntitle: \"Purple strands and specs\"\nexcerpt: \"PaperFaces portrait of @knurpsi drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-knurpsi-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-knurpsi-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@knurpsi](https://twitter.com/knurpsi).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-knurpsi-process-1-750.jpg)](/assets/images/paperfaces-knurpsi-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-knurpsi-process-2-600.jpg)](/assets/images/paperfaces-knurpsi-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-knurpsi-process-3-600.jpg)](/assets/images/paperfaces-knurpsi-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-knurpsi-process-4-600.jpg)](/assets/images/paperfaces-knurpsi-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-knurpsi-process-5-600.jpg)](/assets/images/paperfaces-knurpsi-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-17-jonathanhagans-3-portrait.md",
    "content": "---\ntitle: \"Little one in the orange bow\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jonathanhagans-3-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jonathanhagans-3-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nNot sure if I'm going to stick with the faces or not. Part of me thinks photo-realism is overrated and there's more of a challenge in omitting details rather than drawing them all in.\n\nBut at the same time it has been fun approaching these portraits in a new way to avoid repeating myself. Working with the pencil tool and shading before applying watercolors gives the illustrations a different feel that I'm digging at the moment.\n\nPaperFaces portrait commission for [@jonathanhagans](https://twitter.com/jonathanhagans).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Beginning the portrait with a pencil sketch.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-3-process-1-750.jpg)](/assets/images/paperfaces-jonathanhagans-3-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-3-process-2-600.jpg)](/assets/images/paperfaces-jonathanhagans-3-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-3-process-3-600.jpg)](/assets/images/paperfaces-jonathanhagans-3-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-3-process-4-600.jpg)](/assets/images/paperfaces-jonathanhagans-3-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jonathanhagans-3-process-5-600.jpg)](/assets/images/paperfaces-jonathanhagans-3-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-18-hellolauraamy-portrait.md",
    "content": "---\ntitle: \"Softly lit full face\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hellolauraamy-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hellolauraamy-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nTis the Season for PaperFaces portrait commissions.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-hellolauraamy-process-1-600.jpg)](/assets/images/paperfaces-hellolauraamy-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hellolauraamy-process-2-600.jpg)](/assets/images/paperfaces-hellolauraamy-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hellolauraamy-process-3-600.jpg)](/assets/images/paperfaces-hellolauraamy-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hellolauraamy-process-4-600.jpg)](/assets/images/paperfaces-hellolauraamy-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hellolauraamy-process-5-600.jpg)](/assets/images/paperfaces-hellolauraamy-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hellolauraamy-process-6-600.jpg)](/assets/images/paperfaces-hellolauraamy-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-19-adammorgan100-2-portrait.md",
    "content": "---\ntitle: \"Old timey brothers\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-adammorgan100-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-adammorgan100-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait commission for [@adammorgan100](https://twitter.com/adammorgan100).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-process-1-600.jpg)](/assets/images/paperfaces-adammorgan100-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-process-2-600.jpg)](/assets/images/paperfaces-adammorgan100-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-process-3-600.jpg)](/assets/images/paperfaces-adammorgan100-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-process-4-600.jpg)](/assets/images/paperfaces-adammorgan100-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-19-adammorgan100-portrait.md",
    "content": "---\ntitle: \"Capturing all the details\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-adammorgan100-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-adammorgan100-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nWhat's with all the full faces lately you ask? Well let's just say I set a challenge for myself to see how much detail I can capture in an hour or two. No 20 hour marathon digital painting sessions for me!\n\nPaperFaces portrait commission for [@adammorgan100](https://twitter.com/adammorgan100).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-2-process-1-600.jpg)](/assets/images/paperfaces-adammorgan100-2-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-2-process-2-600.jpg)](/assets/images/paperfaces-adammorgan100-2-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-2-process-3-600.jpg)](/assets/images/paperfaces-adammorgan100-2-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-2-process-4-600.jpg)](/assets/images/paperfaces-adammorgan100-2-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-2-process-5-600.jpg)](/assets/images/paperfaces-adammorgan100-2-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-2-process-6-600.jpg)](/assets/images/paperfaces-adammorgan100-2-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-23-adammorgan100-3-portrait.md",
    "content": "---\ntitle: \"Shoulder riders\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-adammorgan100-3-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-adammorgan100-3-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission for [@adammorgan100](https://twitter.com/adammorgan100).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-3-process-1-750.jpg)](/assets/images/paperfaces-adammorgan100-3-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-3-process-2-600.jpg)](/assets/images/paperfaces-adammorgan100-3-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-3-process-3-600.jpg)](/assets/images/paperfaces-adammorgan100-3-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-3-process-4-600.jpg)](/assets/images/paperfaces-adammorgan100-3-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-adammorgan100-3-process-5-600.jpg)](/assets/images/paperfaces-adammorgan100-3-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-23-maggiebob-portrait.md",
    "content": "---\ntitle: \"Purple frames\"\nexcerpt: \"PaperFaces portrait of @maggiebob drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-maggiebob-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-maggiebob-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission for [@maggiebob](https://twitter.com/maggiebob).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-maggiebob-process-1-750.jpg)](/assets/images/paperfaces-maggiebob-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-maggiebob-process-2-600.jpg)](/assets/images/paperfaces-maggiebob-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-maggiebob-process-3-600.jpg)](/assets/images/paperfaces-maggiebob-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-maggiebob-process-4-600.jpg)](/assets/images/paperfaces-maggiebob-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-maggiebob-process-5-600.jpg)](/assets/images/paperfaces-maggiebob-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-23-tati-portrait.md",
    "content": "---\ntitle: \"Spiderwebs and dew drops\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tati.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tati-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh, time lapse]\n---\n\nMy first PaperFaces portrait commission using two styli to complete.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Painted in about an hour and 30 minutes.\" %}\n{% youtube y1OG2gLk6Jg %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-23-themarcstone-portrait.md",
    "content": "---\ntitle: \"Winter cap in the street\"\nexcerpt: \"PaperFaces portrait of @TheMarcStone drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-themarcstone-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-themarcstone-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait commission for [@TheMarcStone](https://twitter.com/TheMarcStone).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-themarcstone-process-1-750.jpg)](/assets/images/paperfaces-themarcstone-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-themarcstone-process-2-600.jpg)](/assets/images/paperfaces-themarcstone-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-themarcstone-process-3-600.jpg)](/assets/images/paperfaces-themarcstone-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-themarcstone-process-4-600.jpg)](/assets/images/paperfaces-themarcstone-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-themarcstone-process-5-600.jpg)](/assets/images/paperfaces-themarcstone-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-24-rosebuds-christmas-portrait.md",
    "content": "---\ntitle: \"Rosebud twins on Christmas\"\nexcerpt: \"PaperFaces portrait of Everly and Chloe drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rosebuds-christmas.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rosebuds-christmas-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, twins]\n---\n\nJust a simple drawing of my twin girls, Everly and Chloe enjoying wrapping paper. I suppose at this age they're more concerned with shredding the covering than what's hidden beneath it.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rosebuds-christmas-process-1-750.jpg)](/assets/images/paperfaces-rosebuds-christmas-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Using blend to add a sense of depth to the drawing by blurring the background.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rosebuds-christmas-process-2-600.jpg)](/assets/images/paperfaces-rosebuds-christmas-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rosebuds-christmas-process-3-600.jpg)](/assets/images/paperfaces-rosebuds-christmas-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-28-ayepod-portrait.md",
    "content": "---\ntitle: \"Sweater weather\"\nexcerpt: \"PaperFaces portrait of @ayepod drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ayepod-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ayepod-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ayepod](https://twitter.com/ayepod).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ayepod-process-1-750.jpg)](/assets/images/paperfaces-ayepod-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ayepod-process-2-600.jpg)](/assets/images/paperfaces-ayepod-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ayepod-process-3-600.jpg)](/assets/images/paperfaces-ayepod-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ayepod-process-4-600.jpg)](/assets/images/paperfaces-ayepod-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ayepod-process-5-600.jpg)](/assets/images/paperfaces-ayepod-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-28-greeleygeek-portrait.md",
    "content": "---\ntitle: \"Half peekaboo\"\nexcerpt: \"PaperFaces portrait of @greeleygeek drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-greeleygeek-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-greeleygeek-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@greeleygeek](https://twitter.com/greeleygeek).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-greeleygeek-process-1-750.jpg)](/assets/images/paperfaces-greeleygeek-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-greeleygeek-process-2-600.jpg)](/assets/images/paperfaces-greeleygeek-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-greeleygeek-process-3-600.jpg)](/assets/images/paperfaces-greeleygeek-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-greeleygeek-process-4-600.jpg)](/assets/images/paperfaces-greeleygeek-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-greeleygeek-process-5-600.jpg)](/assets/images/paperfaces-greeleygeek-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2013-12-28-hugo-s-portrait.md",
    "content": "---\ntitle: \"Dolphin whisperer\"\nexcerpt: \"PaperFaces portrait of Hugo S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hugo-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hugo-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Sktchy user Hugo S.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-hugo-s-process-1-750.jpg)](/assets/images/paperfaces-hugo-s-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" %}\n[![Work in process screenshot](/assets/images/paperfaces-hugo-s-process-2-600.jpg)](/assets/images/paperfaces-hugo-s-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hugo-s-process-3-600.jpg)](/assets/images/paperfaces-hugo-s-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hugo-s-process-4-600.jpg)](/assets/images/paperfaces-hugo-s-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hugo-s-process-5-600.jpg)](/assets/images/paperfaces-hugo-s-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-02-dani-o-portrait.md",
    "content": "---\ntitle: \"Black and white bangs\"\nexcerpt: \"PaperFaces portrait of Dani O. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dani-o.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dani-o-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Sktchy user [Dani O](https://sktchy.com/BVa6DC).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-dani-o-process-1-750.jpg)](/assets/images/paperfaces-dani-o-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-dani-o-process-2-600.jpg)](/assets/images/paperfaces-dani-o-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dani-o-process-3-600.jpg)](/assets/images/paperfaces-dani-o-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dani-o-process-4-600.jpg)](/assets/images/paperfaces-dani-o-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dani-o-process-5-600.jpg)](/assets/images/paperfaces-dani-o-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-02-imuggle-portrait.md",
    "content": "---\ntitle: \"Pink sweater\"\nexcerpt: \"PaperFaces portrait of @imuggle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-imuggle-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-imuggle-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@iMuggle](https://twitter.com/iMuggle).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-imuggle-process-1-600.jpg)](/assets/images/paperfaces-imuggle-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-imuggle-process-2-600.jpg)](/assets/images/paperfaces-imuggle-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-imuggle-process-3-600.jpg)](/assets/images/paperfaces-imuggle-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-imuggle-process-4-600.jpg)](/assets/images/paperfaces-imuggle-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-02-manzu-portrait.md",
    "content": "---\ntitle: \"Green bokeh\"\nexcerpt: \"PaperFaces portrait of @manzu drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-manzu-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-manzu-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@manzu](https://twitter.com/manzu).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-manzu-process-1-750.jpg)](/assets/images/paperfaces-manzu-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-manzu-process-2-600.jpg)](/assets/images/paperfaces-manzu-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-manzu-process-3-600.jpg)](/assets/images/paperfaces-manzu-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-manzu-process-4-600.jpg)](/assets/images/paperfaces-manzu-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-manzu-process-5-600.jpg)](/assets/images/paperfaces-manzu-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-manzu-process-6-600.jpg)](/assets/images/paperfaces-manzu-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-manzu-process-7-600.jpg)](/assets/images/paperfaces-manzu-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-02-shuether-portrait.md",
    "content": "---\ntitle: \"Fake mountains\"\nexcerpt: \"PaperFaces portrait of @shuether drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-shuether-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-shuether-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@shuether](https://twitter.com/shuether).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-shuether-process-1-750.jpg)](/assets/images/paperfaces-shuether-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-shuether-process-2-600.jpg)](/assets/images/paperfaces-shuether-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-shuether-process-3-600.jpg)](/assets/images/paperfaces-shuether-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-shuether-process-4-600.jpg)](/assets/images/paperfaces-shuether-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-shuether-process-5-600.jpg)](/assets/images/paperfaces-shuether-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-02-virshawn-portrait.md",
    "content": "---\ntitle: \"First face of 2014\"\nexcerpt: \"PaperFaces portrait of @virshawn drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-virshawn-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-virshawn-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@virshawn](https://twitter.com/virshawn).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-virshawn-process-1-750.jpg)](/assets/images/paperfaces-virshawn-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-virshawn-process-2-600.jpg)](/assets/images/paperfaces-virshawn-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-virshawn-process-3-600.jpg)](/assets/images/paperfaces-virshawn-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-virshawn-process-4-600.jpg)](/assets/images/paperfaces-virshawn-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-virshawn-process-5-600.jpg)](/assets/images/paperfaces-virshawn-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-03-cuteasebutton-portrait.md",
    "content": "---\ntitle: \"Long locks of curl\"\nexcerpt: \"PaperFaces portrait of @cuteasebutton drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cuteasebutton-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cuteasebutton-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cuteasebutton](http://instagram.com/cuteasebutton). I really enjoy drawing long hair, couldn't you tell?\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cuteasebutton-process-1-750.jpg)](/assets/images/paperfaces-cuteasebutton-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cuteasebutton-process-2-600.jpg)](/assets/images/paperfaces-cuteasebutton-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cuteasebutton-process-3-600.jpg)](/assets/images/paperfaces-cuteasebutton-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cuteasebutton-process-4-600.jpg)](/assets/images/paperfaces-cuteasebutton-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cuteasebutton-process-5-600.jpg)](/assets/images/paperfaces-cuteasebutton-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-06-diako-m-portrait.md",
    "content": "---\ntitle: \"Reflected orange light\"\nexcerpt: \"PaperFaces portrait of Diako M. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-diako-m.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-diako-m-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of Diako M.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-diako-m-process-1-750.jpg)](/assets/images/paperfaces-diako-m-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-diako-m-process-2-600.jpg)](/assets/images/paperfaces-diako-m-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-diako-m-process-3-600.jpg)](/assets/images/paperfaces-diako-m-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-diako-m-process-4-600.jpg)](/assets/images/paperfaces-diako-m-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-diako-m-process-5-600.jpg)](/assets/images/paperfaces-diako-m-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-06-sprinkles68-portrait.md",
    "content": "---\ntitle: \"White hair\"\nexcerpt: \"PaperFaces portrait of @Sprinkles68 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sprinkles68-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sprinkles68-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait commission of [@Sprinkles68](https://twitter.com/Sprinkles68).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sprinkles68-process-1-600.jpg)](/assets/images/paperfaces-sprinkles68-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sprinkles68-process-2-600.jpg)](/assets/images/paperfaces-sprinkles68-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-06-tonynof-portrait.md",
    "content": "---\ntitle: \"Riding in cars with yellow and blue hues\"\nexcerpt: \"PaperFaces portrait of @TonyNof drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tonynof-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tonynof-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of [@TonyNof](https://twitter.com/TonyNof).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-tonynof-process-1-600.jpg)](/assets/images/paperfaces-tonynof-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tonynof-process-2-600.jpg)](/assets/images/paperfaces-tonynof-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tonynof-process-3-600.jpg)](/assets/images/paperfaces-tonynof-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tonynof-process-4-600.jpg)](/assets/images/paperfaces-tonynof-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-07-drunkcod-portrait.md",
    "content": "---\ntitle: \"Upside down draws\"\nexcerpt: \"PaperFaces portrait of @drunkcod drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-drunkcod-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-drunkcod-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@drunkcod](https://twitter.com/drunkcod). Suppose I could have flipped the reference photo right side up before drawing it, but where's the fun in that?\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-drunkcod-process-1-750.jpg)](/assets/images/paperfaces-drunkcod-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-drunkcod-process-2-600.jpg)](/assets/images/paperfaces-drunkcod-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-drunkcod-process-3-600.jpg)](/assets/images/paperfaces-drunkcod-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-drunkcod-process-4-600.jpg)](/assets/images/paperfaces-drunkcod-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-drunkcod-process-5-600.jpg)](/assets/images/paperfaces-drunkcod-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-08-catherine-c-portrait.md",
    "content": "---\ntitle: \"Bird cage faux forest\"\nexcerpt: \"PaperFaces portrait of Catherine C. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-catherine-c.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-catherine-c-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait commission of [Catherine C.](https://sktchy.com/4het8)\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-catherine-c-process-1-600.jpg)](/assets/images/paperfaces-catherine-c-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-catherine-c-process-2-600.jpg)](/assets/images/paperfaces-catherine-c-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-catherine-c-process-3-600.jpg)](/assets/images/paperfaces-catherine-c-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-catherine-c-process-4-600.jpg)](/assets/images/paperfaces-catherine-c-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-09-jayperdue-portrait.md",
    "content": "---\ntitle: \"Orange you glad I didn't…\"\nexcerpt: \"PaperFaces portrait of @jayperdue drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jayperdue-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jayperdue-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@jayperdue](https://twitter.com/jayperdue).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jayperdue-process-1-750.jpg)](/assets/images/paperfaces-jayperdue-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jayperdue-process-2-600.jpg)](/assets/images/paperfaces-jayperdue-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jayperdue-process-3-600.jpg)](/assets/images/paperfaces-jayperdue-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jayperdue-process-4-600.jpg)](/assets/images/paperfaces-jayperdue-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jayperdue-process-5-600.jpg)](/assets/images/paperfaces-jayperdue-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jayperdue-process-6-600.jpg)](/assets/images/paperfaces-jayperdue-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jayperdue-process-7-600.jpg)](/assets/images/paperfaces-jayperdue-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-10-jmarkmueller-portrait.md",
    "content": "---\ntitle: \"Sometimes you need to add blue\"\nexcerpt: \"PaperFaces portrait of @JMarkMueller drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jmarkmueller-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jmarkmueller-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait portrait of [@JMarkMueller](https://twitter.com/JMarkMueller).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jmarkmueller-process-1-600.jpg)](/assets/images/paperfaces-jmarkmueller-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jmarkmueller-process-2-600.jpg)](/assets/images/paperfaces-jmarkmueller-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jmarkmueller-process-3-600.jpg)](/assets/images/paperfaces-jmarkmueller-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jmarkmueller-process-4-600.jpg)](/assets/images/paperfaces-jmarkmueller-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jmarkmueller-process-5-600.jpg)](/assets/images/paperfaces-jmarkmueller-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jmarkmueller-process-6-600.jpg)](/assets/images/paperfaces-jmarkmueller-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-13-augenblickpunkt-portrait.md",
    "content": "---\ntitle: \"Bundled up in red\"\nexcerpt: \"PaperFaces portrait of @augenblickpunkt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-augenblickpunkt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-augenblickpunkt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@augenblickpunkt](https://twitter.com/augenblickpunkt).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-augenblickpunkt-process-1-600.jpg)](/assets/images/paperfaces-augenblickpunkt-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-augenblickpunkt-process-2-600.jpg)](/assets/images/paperfaces-augenblickpunkt-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-augenblickpunkt-process-3-600.jpg)](/assets/images/paperfaces-augenblickpunkt-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-augenblickpunkt-process-4-600.jpg)](/assets/images/paperfaces-augenblickpunkt-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-augenblickpunkt-process-5-600.jpg)](/assets/images/paperfaces-augenblickpunkt-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-augenblickpunkt-process-6-600.jpg)](/assets/images/paperfaces-augenblickpunkt-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-13-danielle-m-portrait.md",
    "content": "---\ntitle: \"Mirrored faces\"\nexcerpt: \"PaperFaces portrait of Danielle M. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-danielle-m.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-danielle-m-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of [Danielle M.](https://sktchy.com/rhvANH) inspired on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Pencil sketch to rough out the composition.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-danielle-m-process-1-750.jpg)](/assets/images/paperfaces-danielle-m-process-1-lg.jpg)\n{% endfigure %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-danielle-m-process-2-600.jpg)](/assets/images/paperfaces-danielle-m-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-danielle-m-process-3-600.jpg)](/assets/images/paperfaces-danielle-m-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-danielle-m-process-4-600.jpg)](/assets/images/paperfaces-danielle-m-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-danielle-m-process-5-600.jpg)](/assets/images/paperfaces-danielle-m-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-danielle-m-process-6-600.jpg)](/assets/images/paperfaces-danielle-m-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-danielle-m-process-7-600.jpg)](/assets/images/paperfaces-danielle-m-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-13-jasonact-portrait.md",
    "content": "---\ntitle: \"Overhead halo\"\nexcerpt: \"PaperFaces portrait of @jasonact drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jasonact-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jasonact-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait portrait of [@jasonact](https://twitter.com/jasonact).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jasonact-process-1-600.jpg)](/assets/images/paperfaces-jasonact-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jasonact-process-2-600.jpg)](/assets/images/paperfaces-jasonact-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jasonact-process-3-600.jpg)](/assets/images/paperfaces-jasonact-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jasonact-process-4-600.jpg)](/assets/images/paperfaces-jasonact-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jasonact-process-5-600.jpg)](/assets/images/paperfaces-jasonact-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jasonact-process-6-600.jpg)](/assets/images/paperfaces-jasonact-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-14-bird-o-portrait.md",
    "content": "---\ntitle: \"Feather necklace\"\nexcerpt: \"PaperFaces portrait of Bird O. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bird-o.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bird-o-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nReturn of the blank. PaperFaces portrait of [Bird O.](https://sktchy.com/JPzbGH) inspired on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bird-o-process-1-750.jpg)](/assets/images/paperfaces-bird-o-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bird-o-process-2-600.jpg)](/assets/images/paperfaces-bird-o-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bird-o-process-3-600.jpg)](/assets/images/paperfaces-bird-o-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bird-o-process-4-600.jpg)](/assets/images/paperfaces-bird-o-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bird-o-process-5-600.jpg)](/assets/images/paperfaces-bird-o-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-15-steve-fenton-portrait.md",
    "content": "---\ntitle: \"Motorcycle jacket in soft focus\"\nexcerpt: \"PaperFaces portrait of @steve_fenton drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-steve-fenton-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-steve-fenton-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@steve_fenton](https://twitter.com/steve_fenton).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-steve-fenton-process-1-750.jpg)](/assets/images/paperfaces-steve-fenton-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-steve-fenton-process-2-600.jpg)](/assets/images/paperfaces-steve-fenton-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-steve-fenton-process-3-600.jpg)](/assets/images/paperfaces-steve-fenton-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-steve-fenton-process-4-600.jpg)](/assets/images/paperfaces-steve-fenton-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-steve-fenton-process-5-600.jpg)](/assets/images/paperfaces-steve-fenton-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-16-kirsty-h-portrait.md",
    "content": "---\ntitle: \"Semi erased\"\nexcerpt: \"PaperFaces portrait of Kirsty H. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kirsty-h.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kirsty-h-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T16:19:26-05:00\n---\n\nPaperFaces portrait of [Kirsty H.](https://sktchy.com/A73olc) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kirsty-h-process-1-750.jpg)](/assets/images/paperfaces-kirsty-h-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsty-h-process-2-600.jpg)](/assets/images/paperfaces-kirsty-h-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsty-h-process-3-600.jpg)](/assets/images/paperfaces-kirsty-h-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsty-h-process-4-600.jpg)](/assets/images/paperfaces-kirsty-h-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsty-h-process-5-600.jpg)](/assets/images/paperfaces-kirsty-h-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-17-alxknt-portrait.md",
    "content": "---\ntitle: \"Red sweatshirt, I think\"\nexcerpt: \"PaperFaces portrait of @alxknt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-alxknt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-alxknt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\nlast_modified_at: 2017-01-17T16:18:45-05:00\n---\n\nPaperFaces portrait of [@alxknt](https://twitter.com/alxknt).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-alxknt-process-1-750.jpg)](/assets/images/paperfaces-alxknt-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-alxknt-process-2-600.jpg)](/assets/images/paperfaces-alxknt-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-alxknt-process-3-600.jpg)](/assets/images/paperfaces-alxknt-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-alxknt-process-4-600.jpg)](/assets/images/paperfaces-alxknt-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-alxknt-process-5-600.jpg)](/assets/images/paperfaces-alxknt-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-20-allyson-b-portrait.md",
    "content": "---\ntitle: \"Bird back\"\nexcerpt: \"PaperFaces portrait of Kirsty H. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-allyson-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-allyson-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, tattoo]\nlast_modified_at: 2017-01-17T16:18:00-05:00\n---\n\nPaperFaces portrait of [Allyson B.](https://sktchy.com/NogM0C) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-allyson-b-process-1-600.jpg)](/assets/images/paperfaces-allyson-b-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-allyson-b-process-2-600.jpg)](/assets/images/paperfaces-allyson-b-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-allyson-b-process-3-600.jpg)](/assets/images/paperfaces-allyson-b-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-allyson-b-process-4-600.jpg)](/assets/images/paperfaces-allyson-b-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-allyson-b-process-5-600.jpg)](/assets/images/paperfaces-allyson-b-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-allyson-b-process-6-600.jpg)](/assets/images/paperfaces-allyson-b-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-20-thenimesh-portrait.md",
    "content": "---\ntitle: \"Glitching out\"\nexcerpt: \"PaperFaces portrait of @thenimesh drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thenimesh-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thenimesh-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\nlast_modified_at: 2017-01-17T16:17:14-05:00\n---\n\nWhen I edit drawing footage I captured from an iPad, I like to speed up the final movie to around 4-5 minutes max. Keeps the video more interesting and fun to watch.\n\nAt this speed it can be hard to observe exactly what is going on and looks more like a magic trick if you ask me. YouTube has bumped my account allowing uploads over 15 minutes so I decided to try a longer edit. I'm not entirely sure what the hard limit is, but I decided against uploading the 1 hour and 23 minute real time capture, and instead went with this 17 minute cut.\n\nEven at 17 minutes it's fairly boring to watch, but maybe 2 or 3 of you will enjoy it.\n\nPaperFaces portrait of [@thenimesh](https://twitter.com/thenimesh).\n\n{% youtube s4WEGH5r-1c %}\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-21-olesya-l-portrait.md",
    "content": "---\ntitle: \"Fancy shear and flowers\"\nexcerpt: \"PaperFaces portrait of Olesya L. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-olesya-l.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-olesya-l-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T16:16:23-05:00\n---\n\nPaperFaces portrait of [Olesya L.](https://sktchy.com/REiCy) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-olesya-l-process-1-600.jpg)](/assets/images/paperfaces-olesya-l-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-olesya-l-process-2-600.jpg)](/assets/images/paperfaces-olesya-l-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-olesya-l-process-3-600.jpg)](/assets/images/paperfaces-olesya-l-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-olesya-l-process-4-600.jpg)](/assets/images/paperfaces-olesya-l-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-olesya-l-process-5-600.jpg)](/assets/images/paperfaces-olesya-l-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-olesya-l-process-6-600.jpg)](/assets/images/paperfaces-olesya-l-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-21-tombryan-portrait.md",
    "content": "---\ntitle: \"Black cap\"\nexcerpt: \"PaperFaces portrait of @tombryan drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tombryan-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tombryan-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\nlast_modified_at: 2017-01-17T16:15:25-05:00\n---\n\nPaperFaces portrait of [@tombryan](https://twitter.com/tombryan).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-tombryan-process-1-750.jpg)](/assets/images/paperfaces-tombryan-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tombryan-process-2-600.jpg)](/assets/images/paperfaces-tombryan-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tombryan-process-3-600.jpg)](/assets/images/paperfaces-tombryan-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tombryan-process-4-600.jpg)](/assets/images/paperfaces-tombryan-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tombryan-process-5-600.jpg)](/assets/images/paperfaces-tombryan-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-23-cocoapriest-portrait.md",
    "content": "---\ntitle: \"Details in the sunglasses\"\nexcerpt: \"PaperFaces portrait of @cocoapriest drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cocoapriest-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cocoapriest-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\nlast_modified_at: 2017-01-17T16:14:36-05:00\n---\n\nI merely added a few white highlights to the sunglasses and facial hair stubble, smudged the background, and bam --- instant photo realistic results. Looks even more convincing when shrunken down.\n\nPaperFaces portrait of [@cocoapriest](https://twitter.com/cocoapriest).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cocoapriest-process-1-600.jpg)](/assets/images/paperfaces-cocoapriest-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cocoapriest-process-2-600.jpg)](/assets/images/paperfaces-cocoapriest-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cocoapriest-process-3-600.jpg)](/assets/images/paperfaces-cocoapriest-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cocoapriest-process-4-600.jpg)](/assets/images/paperfaces-cocoapriest-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-23-mia-di-portrait.md",
    "content": "---\ntitle: \"Looking Soft in Her Blizzard Protection\"\nexcerpt: \"PaperFaces portrait of Mia Di D. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mia-di.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mia-di-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T16:14:01-05:00\n---\n\nCooler tones for the eyeshadow and a hint of pink to warm up the cheeks. PaperFaces portrait of [Mia Di D.](https://sktchy.com/BBBOaH) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screenshots (Paper for iOS).\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mia-di-process-1-600.jpg)](/assets/images/paperfaces-mia-di-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mia-di-process-2-600.jpg)](/assets/images/paperfaces-mia-di-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mia-di-process-3-600.jpg)](/assets/images/paperfaces-mia-di-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mia-di-process-4-600.jpg)](/assets/images/paperfaces-mia-di-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-24-megan-g-portrait.md",
    "content": "---\ntitle: \"Blizzard protection\"\nexcerpt: \"PaperFaces portrait of Megan G. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-megan-g.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-megan-g-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T16:13:21-05:00\n---\n\nAnother winter scene with a slight smudge to the background of trees to add depth. PaperFaces portrait of [Megan G.](https://sktchy.com/ZRLqgC) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-megan-g-process-1-600.jpg)](/assets/images/paperfaces-megan-g-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-megan-g-process-2-600.jpg)](/assets/images/paperfaces-megan-g-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-megan-g-process-3-600.jpg)](/assets/images/paperfaces-megan-g-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-megan-g-process-4-600.jpg)](/assets/images/paperfaces-megan-g-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-megan-g-process-5-600.jpg)](/assets/images/paperfaces-megan-g-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-megan-g-process-6-600.jpg)](/assets/images/paperfaces-megan-g-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-megan-g-process-7-600.jpg)](/assets/images/paperfaces-megan-g-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-27-bjverot-portrait.md",
    "content": "---\ntitle: \"Looking forward\"\nexcerpt: \"PaperFaces portrait of @BJVerot drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bjverot-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bjverot-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T16:12:36-05:00\n---\n\nPaperFaces portrait of [@BJVerot](https://twitter.com/BJVerot).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bjverot-process-1-600.jpg)](/assets/images/paperfaces-bjverot-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bjverot-process-2-600.jpg)](/assets/images/paperfaces-bjverot-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bjverot-process-3-600.jpg)](/assets/images/paperfaces-bjverot-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bjverot-process-4-600.jpg)](/assets/images/paperfaces-bjverot-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bjverot-process-5-600.jpg)](/assets/images/paperfaces-bjverot-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bjverot-process-6-600.jpg)](/assets/images/paperfaces-bjverot-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-27-daniel-w-portrait.md",
    "content": "---\ntitle: \"That weathered look\"\nexcerpt: \"PaperFaces portrait of Daniel W. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-daniel-w.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-daniel-w-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, beard]\nlast_modified_at: 2017-01-17T16:11:48-05:00\n---\n\nEnjoyed adding all the texture in this one. PaperFaces portrait of [Daniel W.](https://sktchy.com/Uc5fXc) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-daniel-w-process-1-600.jpg)](/assets/images/paperfaces-daniel-w-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-daniel-w-process-2-600.jpg)](/assets/images/paperfaces-daniel-w-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-daniel-w-process-3-600.jpg)](/assets/images/paperfaces-daniel-w-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-daniel-w-process-4-600.jpg)](/assets/images/paperfaces-daniel-w-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-daniel-w-process-5-600.jpg)](/assets/images/paperfaces-daniel-w-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-daniel-w-process-6-600.jpg)](/assets/images/paperfaces-daniel-w-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-daniel-w-process-7-600.jpg)](/assets/images/paperfaces-daniel-w-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-27-kirsten-b-portrait.md",
    "content": "---\ntitle: \"Polka dot draws\"\nexcerpt: \"PaperFaces portrait of Kirsten B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kirsten-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kirsten-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T16:11:01-05:00\n---\n\nA draw for a draw. PaperFaces portrait of [Kirsten B.](https://sktchy.com/WAPmzC) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-1-600.jpg)](/assets/images/paperfaces-kirsten-b-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-2-600.jpg)](/assets/images/paperfaces-kirsten-b-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-3-600.jpg)](/assets/images/paperfaces-kirsten-b-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-4-600.jpg)](/assets/images/paperfaces-kirsten-b-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-5-600.jpg)](/assets/images/paperfaces-kirsten-b-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-6-600.jpg)](/assets/images/paperfaces-kirsten-b-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-7-600.jpg)](/assets/images/paperfaces-kirsten-b-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kirsten-b-process-8-600.jpg)](/assets/images/paperfaces-kirsten-b-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-28-inferno-may13-portrait.md",
    "content": "---\ntitle: \"Ears covered in sounds\"\nexcerpt: \"PaperFaces portrait of @Inferno_May13 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-inferno-may13-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-inferno-may13-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T16:10:16-05:00\n---\n\nPaperFaces portrait of [@Inferno_May13](https://twitter.com/Inferno_May13).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-inferno-may13-process-1-600.jpg)](/assets/images/paperfaces-inferno-may13-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-inferno-may13-process-2-600.jpg)](/assets/images/paperfaces-inferno-may13-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-inferno-may13-process-3-600.jpg)](/assets/images/paperfaces-inferno-may13-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-inferno-may13-process-4-600.jpg)](/assets/images/paperfaces-inferno-may13-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-inferno-may13-process-5-600.jpg)](/assets/images/paperfaces-inferno-may13-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-inferno-may13-process-6-600.jpg)](/assets/images/paperfaces-inferno-may13-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-29-kayla-e-portrait.md",
    "content": "---\ntitle: \"Forest lighting\"\nexcerpt: \"PaperFaces portrait of Kayla E. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kayla-e.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kayla-e-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, bokeh]\n---\n\nEdge lighting is my favorite kind of lighting to draw. PaperFaces portrait of [Kayla E.](https://sktchy.com/fHCi1D) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-1-600.jpg)](/assets/images/paperfaces-kayla-e-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-2-600.jpg)](/assets/images/paperfaces-kayla-e-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-3-600.jpg)](/assets/images/paperfaces-kayla-e-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-4-600.jpg)](/assets/images/paperfaces-kayla-e-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-5-600.jpg)](/assets/images/paperfaces-kayla-e-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-6-600.jpg)](/assets/images/paperfaces-kayla-e-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-7-600.jpg)](/assets/images/paperfaces-kayla-e-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-8-600.jpg)](/assets/images/paperfaces-kayla-e-process-8-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kayla-e-process-9-600.jpg)](/assets/images/paperfaces-kayla-e-process-9-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-30-vinitkme-portrait.md",
    "content": "---\ntitle: \"Thin stripes in gray\"\nexcerpt: \"PaperFaces portrait of @vinitkme drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vinitkme-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vinitkme-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T16:09:29-05:00\n---\n\nPaperFaces portrait of [@vinitkme](https://twitter.com/vinitkme).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-vinitkme-process-1-600.jpg)](/assets/images/paperfaces-vinitkme-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vinitkme-process-2-600.jpg)](/assets/images/paperfaces-vinitkme-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vinitkme-process-3-600.jpg)](/assets/images/paperfaces-vinitkme-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vinitkme-process-4-600.jpg)](/assets/images/paperfaces-vinitkme-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vinitkme-process-5-600.jpg)](/assets/images/paperfaces-vinitkme-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-vinitkme-process-6-600.jpg)](/assets/images/paperfaces-vinitkme-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-01-31-laryssa-w-portrait.md",
    "content": "---\ntitle: \"Peekaboo halved\"\nexcerpt: \"PaperFaces portrait of Laryssa W. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-laryssa-w.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-laryssa-w-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T16:08:41-05:00\n---\n\nPaperFaces portrait of [Laryssa W.](https://sktchy.com/rHtydc) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-laryssa-w-process-1-600.jpg)](/assets/images/paperfaces-laryssa-w-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-laryssa-w-process-2-600.jpg)](/assets/images/paperfaces-laryssa-w-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-laryssa-w-process-3-600.jpg)](/assets/images/paperfaces-laryssa-w-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-laryssa-w-process-4-600.jpg)](/assets/images/paperfaces-laryssa-w-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-laryssa-w-process-5-600.jpg)](/assets/images/paperfaces-laryssa-w-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-03-collinsmandy-portrait.md",
    "content": "---\ntitle: \"Curls at the beach\"\nexcerpt: \"PaperFaces portrait of @CollinsMandy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-collinsmandy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-collinsmandy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T16:07:55-05:00\n---\n\nPaperFaces portrait of [@CollinsMandy](https://twitter.com/CollinsMandy).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-collinsmandy-process-1-600.jpg)](/assets/images/paperfaces-collinsmandy-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-collinsmandy-process-2-600.jpg)](/assets/images/paperfaces-collinsmandy-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-collinsmandy-process-3-600.jpg)](/assets/images/paperfaces-collinsmandy-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-collinsmandy-process-4-600.jpg)](/assets/images/paperfaces-collinsmandy-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-collinsmandy-process-5-600.jpg)](/assets/images/paperfaces-collinsmandy-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-collinsmandy-process-6-600.jpg)](/assets/images/paperfaces-collinsmandy-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-03-kim-s-portrait.md",
    "content": "---\ntitle: \"Blood bath\"\nexcerpt: \"PaperFaces portrait of Kim S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kim-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kim-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T15:58:37-05:00\n---\n\nPaperFaces portrait of [Kim S.](https://sktchy.com/czir6c) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kim-s-process-1-600.jpg)](/assets/images/paperfaces-kim-s-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kim-s-process-2-600.jpg)](/assets/images/paperfaces-kim-s-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kim-s-process-3-600.jpg)](/assets/images/paperfaces-kim-s-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kim-s-process-4-600.jpg)](/assets/images/paperfaces-kim-s-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kim-s-process-5-600.jpg)](/assets/images/paperfaces-kim-s-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kim-s-process-6-600.jpg)](/assets/images/paperfaces-kim-s-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kim-s-process-7-600.jpg)](/assets/images/paperfaces-kim-s-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-03-theoduscrane-portrait.md",
    "content": "---\ntitle: \"Yellow shirt and blur\"\nexcerpt: \"PaperFaces portrait of @theoduscrane drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-theoduscrane-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-theoduscrane-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\nlast_modified_at: 2017-01-17T15:57:55-05:00\n---\n\nPaperFaces portrait of [@theoduscrane](https://twitter.com/theoduscrane).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-theoduscrane-process-1-600.jpg)](/assets/images/paperfaces-theoduscrane-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theoduscrane-process-2-600.jpg)](/assets/images/paperfaces-theoduscrane-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theoduscrane-process-3-600.jpg)](/assets/images/paperfaces-theoduscrane-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theoduscrane-process-4-600.jpg)](/assets/images/paperfaces-theoduscrane-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theoduscrane-process-5-600.jpg)](/assets/images/paperfaces-theoduscrane-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theoduscrane-process-6-600.jpg)](/assets/images/paperfaces-theoduscrane-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-04-kalina-b-portrait.md",
    "content": "---\ntitle: \"Weathered wood\"\nexcerpt: \"PaperFaces portrait of Kalina B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kalina-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kalina-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T15:57:13-05:00\n---\n\nPaperFaces portrait of [Kalina B.](https://sktchy.com/142Fr) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kalina-b-process-1-600.jpg)](/assets/images/paperfaces-kalina-b-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kalina-b-process-2-600.jpg)](/assets/images/paperfaces-kalina-b-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kalina-b-process-3-600.jpg)](/assets/images/paperfaces-kalina-b-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kalina-b-process-4-600.jpg)](/assets/images/paperfaces-kalina-b-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kalina-b-process-5-600.jpg)](/assets/images/paperfaces-kalina-b-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kalina-b-process-6-600.jpg)](/assets/images/paperfaces-kalina-b-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kalina-b-process-7-600.jpg)](/assets/images/paperfaces-kalina-b-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-06-carreteronacho-portrait.md",
    "content": "---\ntitle: \"Lit in profile\"\nexcerpt: \"PaperFaces portrait of @carreteronacho drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-carreteronacho-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-carreteronacho-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T15:56:28-05:00\n---\n\nPaperFaces portrait of [@carreteronacho](https://twitter.com/carreteronacho).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-1-600.jpg)](/assets/images/paperfaces-carreteronacho-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-2-600.jpg)](/assets/images/paperfaces-carreteronacho-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-3-600.jpg)](/assets/images/paperfaces-carreteronacho-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-4-600.jpg)](/assets/images/paperfaces-carreteronacho-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-5-600.jpg)](/assets/images/paperfaces-carreteronacho-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-6-600.jpg)](/assets/images/paperfaces-carreteronacho-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-7-600.jpg)](/assets/images/paperfaces-carreteronacho-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-carreteronacho-process-8-600.jpg)](/assets/images/paperfaces-carreteronacho-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-07-kylesethgray-portrait.md",
    "content": "---\ntitle: \"Eyes that pierce\"\nexcerpt: \"PaperFaces portrait of @kylesethgray drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kylesethgray-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kylesethgray-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:59:18-05:00\n---\n\nPaperFaces portrait of [@kylesethgray](https://twitter.com/kylesethgray).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kylesethgray-process-1-600.jpg)](/assets/images/paperfaces-kylesethgray-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kylesethgray-process-2-600.jpg)](/assets/images/paperfaces-kylesethgray-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kylesethgray-process-3-600.jpg)](/assets/images/paperfaces-kylesethgray-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kylesethgray-process-4-600.jpg)](/assets/images/paperfaces-kylesethgray-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kylesethgray-process-5-600.jpg)](/assets/images/paperfaces-kylesethgray-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kylesethgray-process-6-600.jpg)](/assets/images/paperfaces-kylesethgray-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kylesethgray-process-7-600.jpg)](/assets/images/paperfaces-kylesethgray-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-10-dudrenov-portrait.md",
    "content": "---\ntitle: \"Rose tinted sunglasses\"\nexcerpt: \"PaperFaces portrait of @dudrenov drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dudrenov-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dudrenov-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:58:37-05:00\n---\n\nPaperFaces portrait of [@dudrenov](https://twitter.com/dudrenov).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-1-600.jpg)](/assets/images/paperfaces-dudrenov-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-2-600.jpg)](/assets/images/paperfaces-dudrenov-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-3-600.jpg)](/assets/images/paperfaces-dudrenov-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-4-600.jpg)](/assets/images/paperfaces-dudrenov-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-5-600.jpg)](/assets/images/paperfaces-dudrenov-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-6-600.jpg)](/assets/images/paperfaces-dudrenov-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-7-600.jpg)](/assets/images/paperfaces-dudrenov-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dudrenov-process-8-600.jpg)](/assets/images/paperfaces-dudrenov-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-10-madgarden-portrait.md",
    "content": "---\ntitle: \"Punch something\"\nexcerpt: \"PaperFaces portrait of @madgarden drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-madgarden-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-madgarden-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@madgarden](https://twitter.com/madgarden).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-1-600.jpg)](/assets/images/paperfaces-madgarden-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-2-600.jpg)](/assets/images/paperfaces-madgarden-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-3-600.jpg)](/assets/images/paperfaces-madgarden-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-4-600.jpg)](/assets/images/paperfaces-madgarden-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-5-600.jpg)](/assets/images/paperfaces-madgarden-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-6-600.jpg)](/assets/images/paperfaces-madgarden-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-7-600.jpg)](/assets/images/paperfaces-madgarden-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-madgarden-process-8-600.jpg)](/assets/images/paperfaces-madgarden-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-10-ssgetchel-2-portrait.md",
    "content": "---\ntitle: \"A revisit in gray\"\nexcerpt: \"PaperFaces portrait of @ssgetchel drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ssgetchel-2-instagram.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ssgetchel-2-instagram-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:57:07-05:00\n---\n\nPaperFaces portrait of [@ssgetchel](https://twitter.com/ssgetchel).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ssgetchel-2-process-1-600.jpg)](/assets/images/paperfaces-ssgetchel-2-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ssgetchel-2-process-2-600.jpg)](/assets/images/paperfaces-ssgetchel-2-process-2-lg.jpg)[![Work in process screenshot](/assets/images/paperfaces-ssgetchel-2-process-3-600.jpg)](/assets/images/paperfaces-ssgetchel-2-process-3-lg.jpg)[![Work in process screenshot](/assets/images/paperfaces-ssgetchel-2-process-4-600.jpg)](/assets/images/paperfaces-ssgetchel-2-process-4-lg.jpg)[![Work in process screenshot](/assets/images/paperfaces-ssgetchel-2-process-5-600.jpg)](/assets/images/paperfaces-ssgetchel-2-process-5-lg.jpg)[![Work in process screenshot](/assets/images/paperfaces-ssgetchel-2-process-6-600.jpg)](/assets/images/paperfaces-ssgetchel-2-process-6-lg.jpg)[![Work in process screenshot](/assets/images/paperfaces-ssgetchel-2-process-7-600.jpg)](/assets/images/paperfaces-ssgetchel-2-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-11-fivepops-portrait.md",
    "content": "---\ntitle: \"Graduation in the sun\"\nexcerpt: \"PaperFaces portrait of Fivepops drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fivepops.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fivepops-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:56:22-05:00\n---\n\nPaperFaces portrait commission for Fivepops.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-1-600.jpg)](/assets/images/paperfaces-fivepops-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-2-600.jpg)](/assets/images/paperfaces-fivepops-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-3-600.jpg)](/assets/images/paperfaces-fivepops-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-4-600.jpg)](/assets/images/paperfaces-fivepops-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-5-600.jpg)](/assets/images/paperfaces-fivepops-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-6-600.jpg)](/assets/images/paperfaces-fivepops-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-7-600.jpg)](/assets/images/paperfaces-fivepops-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-process-8-600.jpg)](/assets/images/paperfaces-fivepops-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-12-lukei4655-portrait.md",
    "content": "---\ntitle: \"Beard at an angle\"\nexcerpt: \"PaperFaces portrait of @lukei4655 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lukei4655-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lukei4655-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\nlast_modified_at: 2017-01-17T14:55:36-05:00\n---\n\nPaperFaces portrait of [@lukei4655](https://twitter.com/lukei4655).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-1-600.jpg)](/assets/images/paperfaces-lukei4655-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-2-600.jpg)](/assets/images/paperfaces-lukei4655-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-3-600.jpg)](/assets/images/paperfaces-lukei4655-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-4-600.jpg)](/assets/images/paperfaces-lukei4655-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-5-600.jpg)](/assets/images/paperfaces-lukei4655-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-6-600.jpg)](/assets/images/paperfaces-lukei4655-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-7-600.jpg)](/assets/images/paperfaces-lukei4655-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lukei4655-process-8-600.jpg)](/assets/images/paperfaces-lukei4655-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-13-sophia-portrait.md",
    "content": "---\ntitle: \"The littlest panda\"\nexcerpt: \"PaperFaces portrait of Sophia drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sophia.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sophia-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:54:58-05:00\n---\n\nPaperFaces portrait commission of baby Sophia.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sophia-process-1-600.jpg)](/assets/images/paperfaces-sophia-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-process-2-600.jpg)](/assets/images/paperfaces-sophia-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-process-3-600.jpg)](/assets/images/paperfaces-sophia-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-process-4-600.jpg)](/assets/images/paperfaces-sophia-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-process-5-600.jpg)](/assets/images/paperfaces-sophia-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-process-6-600.jpg)](/assets/images/paperfaces-sophia-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-14-susi-portrait.md",
    "content": "---\ntitle: \"Rugged hat in sunlight\"\nexcerpt: \"PaperFaces portrait of Susi drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-susi.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-susi-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:54:14-05:00\n---\n\nPaperFaces portrait commission of Susi.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-susi-process-1-600.jpg)](/assets/images/paperfaces-susi-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-susi-process-2-600.jpg)](/assets/images/paperfaces-susi-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-susi-process-3-600.jpg)](/assets/images/paperfaces-susi-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-susi-process-4-600.jpg)](/assets/images/paperfaces-susi-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-susi-process-5-600.jpg)](/assets/images/paperfaces-susi-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-susi-process-6-600.jpg)](/assets/images/paperfaces-susi-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-susi-process-7-600.jpg)](/assets/images/paperfaces-susi-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-17-chetterbate-haleymoffatt-portrait.md",
    "content": "---\ntitle: \"Smile and blush\"\nexcerpt: \"PaperFaces portrait of Chad and Haley drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-haley-couple.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-haley-couple-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse]\nlast_modified_at: 2017-01-17T14:53:27-05:00\n---\n\nPaperFaces portrait commission of a happy couple.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Time lapse video captured with [Reflector](http://www.airsquirrels.com/reflector/) and edited with Adobe AfterEffects.\" %}\n{% youtube SU3kYxJmWuQ %}\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-17-lorena-portrait.md",
    "content": "---\ntitle: \"A scenic view of The Mokes\"\nexcerpt: \"PaperFaces portrait of Lorena drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lorena.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lorena-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:52:33-05:00\n---\n\nPaperFaces portrait commission of Lorena.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-1-600.jpg)](/assets/images/paperfaces-lorena-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-2-600.jpg)](/assets/images/paperfaces-lorena-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-3-600.jpg)](/assets/images/paperfaces-lorena-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-4-600.jpg)](/assets/images/paperfaces-lorena-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-5-600.jpg)](/assets/images/paperfaces-lorena-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-6-600.jpg)](/assets/images/paperfaces-lorena-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-7-600.jpg)](/assets/images/paperfaces-lorena-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-8-600.jpg)](/assets/images/paperfaces-lorena-process-8-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorena-process-9-600.jpg)](/assets/images/paperfaces-lorena-process-9-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-17-matt-s-portrait.md",
    "content": "---\ntitle: \"An awkward stare\"\nexcerpt: \"PaperFaces portrait of Matt S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-matt-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-matt-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\nlast_modified_at: 2017-01-17T14:51:50-05:00\n---\n\nPaperFaces portrait of [Matt S.](https://sktchy.com/4SI2jH) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-matt-s-process-1-600.jpg)](/assets/images/paperfaces-matt-s-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matt-s-process-2-600.jpg)](/assets/images/paperfaces-matt-s-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matt-s-process-3-600.jpg)](/assets/images/paperfaces-matt-s-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matt-s-process-4-600.jpg)](/assets/images/paperfaces-matt-s-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matt-s-process-5-600.jpg)](/assets/images/paperfaces-matt-s-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-17-tommysadlr-portrait.md",
    "content": "---\ntitle: \"A gray day\"\nexcerpt: \"PaperFaces portrait of @tommysadlr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tommysadlr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tommysadlr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:51:10-05:00\n---\n\nPaperFaces portrait of [@tommysadlr](https://twitter.com/tommysadlr).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-tommysadlr-process-1-600.jpg)](/assets/images/paperfaces-tommysadlr-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tommysadlr-process-2-600.jpg)](/assets/images/paperfaces-tommysadlr-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tommysadlr-process-3-600.jpg)](/assets/images/paperfaces-tommysadlr-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tommysadlr-process-4-600.jpg)](/assets/images/paperfaces-tommysadlr-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tommysadlr-process-5-600.jpg)](/assets/images/paperfaces-tommysadlr-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tommysadlr-process-6-600.jpg)](/assets/images/paperfaces-tommysadlr-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-18-big-m-portrait.md",
    "content": "---\ntitle: \"Painting contrast in gray\"\nexcerpt: \"PaperFaces portrait of @_Big_M_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-big-m-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-big-m-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:50:27-05:00\n---\n\nPaperFaces portrait of [@_Big_M_](https://twitter.com/_Big_M_).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-big-m-process-1-600.jpg)](/assets/images/paperfaces-big-m-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-big-m-process-2-600.jpg)](/assets/images/paperfaces-big-m-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-big-m-process-3-600.jpg)](/assets/images/paperfaces-big-m-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-big-m-process-4-600.jpg)](/assets/images/paperfaces-big-m-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-big-m-process-5-600.jpg)](/assets/images/paperfaces-big-m-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-big-m-process-6-600.jpg)](/assets/images/paperfaces-big-m-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-20-appinator-portrait.md",
    "content": "---\ntitle: \"Focusing on the glasses\"\nexcerpt: \"PaperFaces portrait of @appinator drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-appinator-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-appinator-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, bokeh]\n---\n\nPaperFaces portrait of [@appinator](https://twitter.com/appinator).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-appinator-process-1-600.jpg)](/assets/images/paperfaces-appinator-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-appinator-process-2-600.jpg)](/assets/images/paperfaces-appinator-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-appinator-process-3-600.jpg)](/assets/images/paperfaces-appinator-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-appinator-process-4-600.jpg)](/assets/images/paperfaces-appinator-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-20-skinny-lee-portrait.md",
    "content": "---\ntitle: \"Redhead in shadow\"\nexcerpt: \"PaperFaces portrait of Skinny Lee drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-skinny-lee.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-skinny-lee-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T14:49:35-05:00\n---\n\nPaperFaces portrait of [Skinny Lee](https://sktchy.com/MfNOoH) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-skinny-lee-process-1-600.jpg)](/assets/images/paperfaces-skinny-lee-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-skinny-lee-process-2-600.jpg)](/assets/images/paperfaces-skinny-lee-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-skinny-lee-process-3-600.jpg)](/assets/images/paperfaces-skinny-lee-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-skinny-lee-process-4-600.jpg)](/assets/images/paperfaces-skinny-lee-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-skinny-lee-process-5-600.jpg)](/assets/images/paperfaces-skinny-lee-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-skinny-lee-process-6-600.jpg)](/assets/images/paperfaces-skinny-lee-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-skinny-lee-process-7-600.jpg)](/assets/images/paperfaces-skinny-lee-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-21-shessoph-portrait.md",
    "content": "---\ntitle: \"Sweaters are sweeter\"\nexcerpt: \"PaperFaces portrait of @shesSoph drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-shessoph-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-shessoph-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:48:53-05:00\n---\n\nPaperFaces portrait of [@shesSoph](https://twitter.com/shesSoph).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-shessoph-process-1-600.jpg)](/assets/images/paperfaces-shessoph-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-shessoph-process-2-600.jpg)](/assets/images/paperfaces-shessoph-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-shessoph-process-3-600.jpg)](/assets/images/paperfaces-shessoph-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-shessoph-process-4-600.jpg)](/assets/images/paperfaces-shessoph-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-shessoph-process-5-600.jpg)](/assets/images/paperfaces-shessoph-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-24-kishba-portrait.md",
    "content": "---\ntitle: \"Ribbit ribbit\"\nexcerpt: \"PaperFaces portrait of @kishba drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kishba-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kishba-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:48:08-05:00\n---\n\nPaperFaces portrait of [@kishba](https://twitter.com/kishba).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kishba-process-1-600.jpg)](/assets/images/paperfaces-kishba-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kishba-process-2-600.jpg)](/assets/images/paperfaces-kishba-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kishba-process-3-600.jpg)](/assets/images/paperfaces-kishba-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kishba-process-4-600.jpg)](/assets/images/paperfaces-kishba-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kishba-process-5-600.jpg)](/assets/images/paperfaces-kishba-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kishba-process-6-600.jpg)](/assets/images/paperfaces-kishba-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-kishba-process-7-600.jpg)](/assets/images/paperfaces-kishba-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-24-patbits-portrait.md",
    "content": "---\ntitle: \"A slight grin\"\nexcerpt: \"PaperFaces portrait of @patbits drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-patbits-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-patbits-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:47:30-05:00\n---\n\nPaperFaces portrait of [@patbits](https://twitter.com/patbits).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-patbits-process-1-600.jpg)](/assets/images/paperfaces-patbits-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-patbits-process-2-600.jpg)](/assets/images/paperfaces-patbits-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-patbits-process-3-600.jpg)](/assets/images/paperfaces-patbits-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-patbits-process-4-600.jpg)](/assets/images/paperfaces-patbits-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-patbits-process-5-600.jpg)](/assets/images/paperfaces-patbits-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-patbits-process-6-600.jpg)](/assets/images/paperfaces-patbits-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-patbits-process-7-600.jpg)](/assets/images/paperfaces-patbits-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-24-tomwhild-portrait.md",
    "content": "---\ntitle: \"Gray stripes in gray light\"\nexcerpt: \"PaperFaces portrait of @tomwhild drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tomwhild-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tomwhild-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:46:44-05:00\n---\n\nPaperFaces portrait of [@tomwhild](https://twitter.com/tomwhild).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-tomwhild-process-1-600.jpg)](/assets/images/paperfaces-tomwhild-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tomwhild-process-2-600.jpg)](/assets/images/paperfaces-tomwhild-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tomwhild-process-3-600.jpg)](/assets/images/paperfaces-tomwhild-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tomwhild-process-4-600.jpg)](/assets/images/paperfaces-tomwhild-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-tomwhild-process-5-600.jpg)](/assets/images/paperfaces-tomwhild-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-25-jennifer-o-portrait.md",
    "content": "---\ntitle: \"Blood prayers\"\nexcerpt: \"PaperFaces portrait of Jennifer O. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jennifer-o.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jennifer-o-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\nlast_modified_at: 2017-01-17T14:46:02-05:00\n---\n\nPaperFaces portrait of [Jennifer O.](https://sktchy.com/nIj9DH) inspired by Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jennifer-o-process-1-600.jpg)](/assets/images/paperfaces-jennifer-o-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jennifer-o-process-2-600.jpg)](/assets/images/paperfaces-jennifer-o-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jennifer-o-process-3-600.jpg)](/assets/images/paperfaces-jennifer-o-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jennifer-o-process-4-600.jpg)](/assets/images/paperfaces-jennifer-o-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jennifer-o-process-5-600.jpg)](/assets/images/paperfaces-jennifer-o-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-26-bretto-portrait.md",
    "content": "---\ntitle: \"Green strikes the glasses\"\nexcerpt: \"PaperFaces portrait of @bretto drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bretto-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bretto-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:45:13-05:00\n---\n\nPaperFaces portrait of [@bretto](https://twitter.com/bretto).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bretto-process-1-600.jpg)](/assets/images/paperfaces-bretto-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bretto-process-2-600.jpg)](/assets/images/paperfaces-bretto-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bretto-process-3-600.jpg)](/assets/images/paperfaces-bretto-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bretto-process-4-600.jpg)](/assets/images/paperfaces-bretto-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bretto-process-5-600.jpg)](/assets/images/paperfaces-bretto-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bretto-process-6-600.jpg)](/assets/images/paperfaces-bretto-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-27-bryan-costanich-portrait.md",
    "content": "---\ntitle: \"Killer curled stache\"\nexcerpt: \"PaperFaces portrait of Bryan Costanich drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bryan-costanich.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bryan-costanich-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:44:33-05:00\n---\n\nPaperFaces portrait of Bryan Costanich. Ladies and germs take note, this is how you wear a mustache.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bryan-costanich-process-1-600.jpg)](/assets/images/paperfaces-bryan-costanich-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bryan-costanich-process-2-600.jpg)](/assets/images/paperfaces-bryan-costanich-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bryan-costanich-process-3-600.jpg)](/assets/images/paperfaces-bryan-costanich-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bryan-costanich-process-4-600.jpg)](/assets/images/paperfaces-bryan-costanich-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bryan-costanich-process-5-600.jpg)](/assets/images/paperfaces-bryan-costanich-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bryan-costanich-process-6-600.jpg)](/assets/images/paperfaces-bryan-costanich-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bryan-costanich-process-7-600.jpg)](/assets/images/paperfaces-bryan-costanich-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-02-28-matteo-flora-portrait.md",
    "content": "---\ntitle: \"Getting realistic with gray\"\nexcerpt: \"PaperFaces portrait of Matteo Flora drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-matteo-flora.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-matteo-flora-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T15:55:31-05:00\n---\n\nPaperFaces portrait commission of [Matteo Flora](http://mgpf.it/).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-matteo-flora-process-1-600.jpg)](/assets/images/paperfaces-matteo-flora-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matteo-flora-process-2-600.jpg)](/assets/images/paperfaces-matteo-flora-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matteo-flora-process-3-600.jpg)](/assets/images/paperfaces-matteo-flora-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matteo-flora-process-4-600.jpg)](/assets/images/paperfaces-matteo-flora-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matteo-flora-process-5-600.jpg)](/assets/images/paperfaces-matteo-flora-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matteo-flora-process-6-600.jpg)](/assets/images/paperfaces-matteo-flora-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-03-jee-chasles-portrait.md",
    "content": "---\ntitle: \"Hand tats\"\nexcerpt: \"PaperFaces portrait of a Jee Chasles drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jee-chasles.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jee-chasles-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, Sktchy, tattoo]\nlast_modified_at: 2017-01-17T14:40:05-05:00\n---\n\nPaperFaces portrait of a [Jee Chasles](https://sktchy.com/qCk1i) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-1-600.jpg)](/assets/images/paperfaces-jee-chasles-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-2-600.jpg)](/assets/images/paperfaces-jee-chasles-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-3-600.jpg)](/assets/images/paperfaces-jee-chasles-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-4-600.jpg)](/assets/images/paperfaces-jee-chasles-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-5-600.jpg)](/assets/images/paperfaces-jee-chasles-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-6-600.jpg)](/assets/images/paperfaces-jee-chasles-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-7-600.jpg)](/assets/images/paperfaces-jee-chasles-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jee-chasles-process-8-600.jpg)](/assets/images/paperfaces-jee-chasles-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-03-killer-clown-portrait.md",
    "content": "---\ntitle: \"Killer clown\"\nexcerpt: \"PaperFaces portrait of a killer clown drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-killer-clown.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-killer-clown-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, Sktchy]\nlast_modified_at: 2017-01-17T14:39:19-05:00\n---\n\nPaperFaces portrait of a killer clown inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-killer-clown-process-1-600.jpg)](/assets/images/paperfaces-killer-clown-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-killer-clown-process-2-600.jpg)](/assets/images/paperfaces-killer-clown-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-killer-clown-process-3-600.jpg)](/assets/images/paperfaces-killer-clown-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-killer-clown-process-4-600.jpg)](/assets/images/paperfaces-killer-clown-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-killer-clown-process-5-600.jpg)](/assets/images/paperfaces-killer-clown-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-killer-clown-process-6-600.jpg)](/assets/images/paperfaces-killer-clown-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-killer-clown-process-7-600.jpg)](/assets/images/paperfaces-killer-clown-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-03-lorenzo-portrait.md",
    "content": "---\ntitle: \"Front faced gaze\"\nexcerpt: \"PaperFaces portrait of Lorenzo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lorenzo.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lorenzo-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-25T12:46:10-05:00\n---\n\nPaperFaces portrait commission of Lorenzo.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-1-600.jpg)](/assets/images/paperfaces-lorenzo-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-2-600.jpg)](/assets/images/paperfaces-lorenzo-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-3-600.jpg)](/assets/images/paperfaces-lorenzo-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-4-600.jpg)](/assets/images/paperfaces-lorenzo-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-5-600.jpg)](/assets/images/paperfaces-lorenzo-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-6-600.jpg)](/assets/images/paperfaces-lorenzo-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-7-600.jpg)](/assets/images/paperfaces-lorenzo-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lorenzo-process-8-600.jpg)](/assets/images/paperfaces-lorenzo-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-04-bill-liu-portrait.md",
    "content": "---\ntitle: \"Bright colors and bokeh\"\nexcerpt: \"PaperFaces portrait of a Bill Liu drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bill-liu.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bill-liu-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait commission of a Bill Liu.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bill-liu-process-1-600.jpg)](/assets/images/paperfaces-bill-liu-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bill-liu-process-2-600.jpg)](/assets/images/paperfaces-bill-liu-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bill-liu-process-3-600.jpg)](/assets/images/paperfaces-bill-liu-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bill-liu-process-4-600.jpg)](/assets/images/paperfaces-bill-liu-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bill-liu-process-5-600.jpg)](/assets/images/paperfaces-bill-liu-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bill-liu-process-6-600.jpg)](/assets/images/paperfaces-bill-liu-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bill-liu-process-7-600.jpg)](/assets/images/paperfaces-bill-liu-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-05-talia-p-portrait.md",
    "content": "---\ntitle: \"Hat halo\"\nexcerpt: \"PaperFaces portrait of a Talia P. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-talia-p.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-talia-p-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T14:36:56-05:00\n---\n\nPaperFaces portrait of a [Talia P.](https://sktchy.com/SVXZg) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-1-600.jpg)](/assets/images/paperfaces-talia-p-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-2-600.jpg)](/assets/images/paperfaces-talia-p-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-3-600.jpg)](/assets/images/paperfaces-talia-p-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-4-600.jpg)](/assets/images/paperfaces-talia-p-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-5-600.jpg)](/assets/images/paperfaces-talia-p-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-6-600.jpg)](/assets/images/paperfaces-talia-p-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-7-600.jpg)](/assets/images/paperfaces-talia-p-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-talia-p-process-8-600.jpg)](/assets/images/paperfaces-talia-p-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-06-gh0st-mob-portrait.md",
    "content": "---\ntitle: \"Leather jacket\"\nexcerpt: \"PaperFaces portrait of @gh0st_mob drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gh0st-mob-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gh0st-mob-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\nlast_modified_at: 2017-01-17T14:36:09-05:00\n---\n\nPaperFaces portrait of [@gh0st_mob](https://twitter.com/gh0st_mob).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-gh0st-mob-process-1-600.jpg)](/assets/images/paperfaces-gh0st-mob-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-gh0st-mob-process-2-600.jpg)](/assets/images/paperfaces-gh0st-mob-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-gh0st-mob-process-3-600.jpg)](/assets/images/paperfaces-gh0st-mob-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-gh0st-mob-process-4-600.jpg)](/assets/images/paperfaces-gh0st-mob-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-gh0st-mob-process-5-600.jpg)](/assets/images/paperfaces-gh0st-mob-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-07-chronic-portrait.md",
    "content": "---\ntitle: \"Suit doesn't match the name\"\nexcerpt: \"PaperFaces portrait of @chronic drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chronic-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chronic-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:35:08-05:00\n---\n\nPaperFaces portrait of [@chronic](https://twitter.com/chronic).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-chronic-process-1-600.jpg)](/assets/images/paperfaces-chronic-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chronic-process-2-600.jpg)](/assets/images/paperfaces-chronic-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chronic-process-3-600.jpg)](/assets/images/paperfaces-chronic-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chronic-process-4-600.jpg)](/assets/images/paperfaces-chronic-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chronic-process-5-600.jpg)](/assets/images/paperfaces-chronic-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chronic-process-5-600.jpg)](/assets/images/paperfaces-chronic-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-10-jen-f-portrait.md",
    "content": "---\ntitle: \"Twinkling lights from Paris\"\nexcerpt: \"PaperFaces portrait of a Jen F. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jen-f.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jen-f-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T14:34:11-05:00\n---\n\nPaperFaces portrait of a [Jen F.](https://sktchy.com/wvVXMH) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-1-600.jpg)](/assets/images/paperfaces-jen-f-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-2-600.jpg)](/assets/images/paperfaces-jen-f-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-3-600.jpg)](/assets/images/paperfaces-jen-f-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-4-600.jpg)](/assets/images/paperfaces-jen-f-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-5-600.jpg)](/assets/images/paperfaces-jen-f-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-6-600.jpg)](/assets/images/paperfaces-jen-f-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-7-600.jpg)](/assets/images/paperfaces-jen-f-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jen-f-process-8-600.jpg)](/assets/images/paperfaces-jen-f-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-10-robhampson-portrait.md",
    "content": "---\ntitle: \"Illusion of the eye\"\nexcerpt: \"PaperFaces portrait of @robhampson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-robhampson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-robhampson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:33:25-05:00\n---\n\nPaperFaces portrait of [@robhampson](https://twitter.com/robhampson).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-robhampson-process-1-600.jpg)](/assets/images/paperfaces-robhampson-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robhampson-process-2-600.jpg)](/assets/images/paperfaces-robhampson-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robhampson-process-3-600.jpg)](/assets/images/paperfaces-robhampson-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robhampson-process-4-600.jpg)](/assets/images/paperfaces-robhampson-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robhampson-process-5-600.jpg)](/assets/images/paperfaces-robhampson-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robhampson-process-5-600.jpg)](/assets/images/paperfaces-robhampson-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robhampson-process-6-600.jpg)](/assets/images/paperfaces-robhampson-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-10-sophia-matilde-portrait.md",
    "content": "---\ntitle: \"Little one x2\"\nexcerpt: \"PaperFaces portrait of one month old twins drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sophia-matilde.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sophia-matilde-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, twins]\nlast_modified_at: 2017-01-17T14:32:31-05:00\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sophia-matilde-process-1-600.jpg)](/assets/images/paperfaces-sophia-matilde-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-matilde-process-2-600.jpg)](/assets/images/paperfaces-sophia-matilde-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-matilde-process-3-600.jpg)](/assets/images/paperfaces-sophia-matilde-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-matilde-process-4-600.jpg)](/assets/images/paperfaces-sophia-matilde-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-sophia-matilde-process-5-600.jpg)](/assets/images/paperfaces-sophia-matilde-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-11-emmaikesselhut-portrait.md",
    "content": "---\ntitle: \"The color of ice\"\nexcerpt: \"PaperFaces portrait of @EmmaIKesselhut drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-emmaikesselhut-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-emmaikesselhut-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:31:42-05:00\n---\n\nPaperFaces portrait of [@EmmaIKesselhut](https://twitter.com/EmmaIKesselhut).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-emmaikesselhut-process-1-600.jpg)](/assets/images/paperfaces-emmaikesselhut-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-emmaikesselhut-process-2-600.jpg)](/assets/images/paperfaces-emmaikesselhut-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-emmaikesselhut-process-3-600.jpg)](/assets/images/paperfaces-emmaikesselhut-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-emmaikesselhut-process-4-600.jpg)](/assets/images/paperfaces-emmaikesselhut-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-13-bingopajamas-portrait.md",
    "content": "---\ntitle: \"Car ride reflections\"\nexcerpt: \"PaperFaces portrait of @bingopajamas drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bingopajamas-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bingopajamas-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:31:02-05:00\n---\n\nPaperFaces portrait of [@bingopajamas](https://twitter.com/bingopajamas).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bingopajamas-process-1-600.jpg)](/assets/images/paperfaces-bingopajamas-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bingopajamas-process-2-600.jpg)](/assets/images/paperfaces-bingopajamas-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bingopajamas-process-3-600.jpg)](/assets/images/paperfaces-bingopajamas-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bingopajamas-process-4-600.jpg)](/assets/images/paperfaces-bingopajamas-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bingopajamas-process-5-600.jpg)](/assets/images/paperfaces-bingopajamas-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bingopajamas-process-6-600.jpg)](/assets/images/paperfaces-bingopajamas-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bingopajamas-process-7-600.jpg)](/assets/images/paperfaces-bingopajamas-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-13-pesch67-portrait.md",
    "content": "---\ntitle: \"Walter White look a like?\"\nexcerpt: \"PaperFaces portrait of @PeSch67 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pesch67-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pesch67-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:30:16-05:00\n---\n\nPaperFaces portrait of [@PeSch67](https://twitter.com/PeSch67).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-pesch67-process-1-600.jpg)](/assets/images/paperfaces-pesch67-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-pesch67-process-2-600.jpg)](/assets/images/paperfaces-pesch67-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-pesch67-process-3-600.jpg)](/assets/images/paperfaces-pesch67-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-pesch67-process-4-600.jpg)](/assets/images/paperfaces-pesch67-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-14-janten-portrait.md",
    "content": "---\ntitle: \"Weather appropriate\"\nexcerpt: \"PaperFaces portrait of @janten drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-janten-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-janten-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\nlast_modified_at: 2017-01-17T14:29:39-05:00\n---\n\nPaperFaces portrait of [@janten](https://twitter.com/janten).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-janten-process-1-600.jpg)](/assets/images/paperfaces-janten-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-janten-process-2-600.jpg)](/assets/images/paperfaces-janten-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-janten-process-3-600.jpg)](/assets/images/paperfaces-janten-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-janten-process-4-600.jpg)](/assets/images/paperfaces-janten-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-janten-process-5-600.jpg)](/assets/images/paperfaces-janten-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-janten-process-6-600.jpg)](/assets/images/paperfaces-janten-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-janten-process-7-600.jpg)](/assets/images/paperfaces-janten-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-17-dillydallygames-portrait.md",
    "content": "---\ntitle: \"The one who knocks\"\nexcerpt: \"PaperFaces portrait of @dillydallygames drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-dillydallygames-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dillydallygames-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:29:00-05:00\n---\n\nPaperFaces portrait of [@dillydallygames](https://twitter.com/dillydallygames).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-1-600.jpg)](/assets/images/paperfaces-dillydallygames-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-2-600.jpg)](/assets/images/paperfaces-dillydallygames-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-3-600.jpg)](/assets/images/paperfaces-dillydallygames-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-4-600.jpg)](/assets/images/paperfaces-dillydallygames-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-5-600.jpg)](/assets/images/paperfaces-dillydallygames-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-6-600.jpg)](/assets/images/paperfaces-dillydallygames-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-7-600.jpg)](/assets/images/paperfaces-dillydallygames-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-dillydallygames-process-8-600.jpg)](/assets/images/paperfaces-dillydallygames-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-17-mstrandberg-portrait.md",
    "content": "---\ntitle: \"Thinking\"\nexcerpt: \"PaperFaces portrait of @mstrandberg drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mstrandberg-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mstrandberg-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:27:59-05:00\n---\n\nPaperFaces portrait of [@mstrandberg](https://twitter.com/mstrandberg).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mstrandberg-process-1-600.jpg)](/assets/images/paperfaces-mstrandberg-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mstrandberg-process-2-600.jpg)](/assets/images/paperfaces-mstrandberg-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mstrandberg-process-3-600.jpg)](/assets/images/paperfaces-mstrandberg-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mstrandberg-process-4-600.jpg)](/assets/images/paperfaces-mstrandberg-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mstrandberg-process-5-600.jpg)](/assets/images/paperfaces-mstrandberg-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mstrandberg-process-6-600.jpg)](/assets/images/paperfaces-mstrandberg-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-18-chadtafolla-2-portrait.md",
    "content": "---\ntitle: \"Drinks in gray\"\nexcerpt: \"PaperFaces portrait of @chadtafolla drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chadtafolla-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chadtafolla-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:27:17-05:00\n---\n\nPaperFaces portrait of [@chadtafolla](https://twitter.com/chadtafolla).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-1-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-2-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-3-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-4-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-5-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-6-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-7-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-8-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-8-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-chadtafolla-2-process-9-600.jpg)](/assets/images/paperfaces-chadtafolla-2-process-9-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-18-thomas-d-portrait.md",
    "content": "---\ntitle: \"Direct sunlight and bokeh\"\nexcerpt: \"PaperFaces portrait of Thomas D. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-thomas-d-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-thomas-d-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:26:35-05:00\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-1-600.jpg)](/assets/images/paperfaces-thomas-d-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-2-600.jpg)](/assets/images/paperfaces-thomas-d-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-3-600.jpg)](/assets/images/paperfaces-thomas-d-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-4-600.jpg)](/assets/images/paperfaces-thomas-d-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-5-600.jpg)](/assets/images/paperfaces-thomas-d-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-6-600.jpg)](/assets/images/paperfaces-thomas-d-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-7-600.jpg)](/assets/images/paperfaces-thomas-d-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-8-600.jpg)](/assets/images/paperfaces-thomas-d-process-8-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-thomas-d-process-9-600.jpg)](/assets/images/paperfaces-thomas-d-process-9-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-19-ipetercao-portrait.md",
    "content": "---\ntitle: \"King of pop\"\nexcerpt: \"PaperFaces portrait of @iPeterCao drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ipetercao-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ipetercao-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:25:53-05:00\n---\n\nPaperFaces portrait of [@iPeterCao](https://twitter.com/iPeterCao).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ipetercao-process-1-600.jpg)](/assets/images/paperfaces-ipetercao-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ipetercao-process-2-600.jpg)](/assets/images/paperfaces-ipetercao-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ipetercao-process-3-600.jpg)](/assets/images/paperfaces-ipetercao-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ipetercao-process-4-600.jpg)](/assets/images/paperfaces-ipetercao-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ipetercao-process-5-600.jpg)](/assets/images/paperfaces-ipetercao-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-21-barbara-m-portrait.md",
    "content": "---\ntitle: \"Bashful hair on Sktchy\"\nexcerpt: \"PaperFaces portrait of a Barbara M. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-barbara-m.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-barbara-m-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T14:25:04-05:00\n---\n\nPaperFaces portrait of a [Jen F.](https://sktchy.com/vJbCsc) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-1-600.jpg)](/assets/images/paperfaces-barbara-m-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-2-600.jpg)](/assets/images/paperfaces-barbara-m-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-3-600.jpg)](/assets/images/paperfaces-barbara-m-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-4-600.jpg)](/assets/images/paperfaces-barbara-m-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-5-600.jpg)](/assets/images/paperfaces-barbara-m-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-6-600.jpg)](/assets/images/paperfaces-barbara-m-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-7-600.jpg)](/assets/images/paperfaces-barbara-m-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-8-600.jpg)](/assets/images/paperfaces-barbara-m-process-8-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-barbara-m-process-9-600.jpg)](/assets/images/paperfaces-barbara-m-process-9-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-21-rene-d-portrait.md",
    "content": "---\ntitle: \"Direct sunlight and bokeh part 2\"\nexcerpt: \"PaperFaces portrait of Rene D. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rene-d-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rene-d-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:24:24-05:00\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-1-600.jpg)](/assets/images/paperfaces-rene-d-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-2-600.jpg)](/assets/images/paperfaces-rene-d-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-3-600.jpg)](/assets/images/paperfaces-rene-d-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-4-600.jpg)](/assets/images/paperfaces-rene-d-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-5-600.jpg)](/assets/images/paperfaces-rene-d-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-7-600.jpg)](/assets/images/paperfaces-rene-d-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-8-600.jpg)](/assets/images/paperfaces-rene-d-process-8-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-9-600.jpg)](/assets/images/paperfaces-rene-d-process-9-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rene-d-process-10-600.jpg)](/assets/images/paperfaces-rene-d-process-10-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-24-ideal1st-portrait.md",
    "content": "---\ntitle: \"Over the shoulder\"\nexcerpt: \"PaperFaces portrait of @ideal1st drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ideal1st-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ideal1st-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:23:35-05:00\n---\n\nPaperFaces portrait of [@ideal1st](https://twitter.com/ideal1st).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ideal1st-process-1-600.jpg)](/assets/images/paperfaces-ideal1st-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ideal1st-process-2-600.jpg)](/assets/images/paperfaces-ideal1st-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ideal1st-process-3-600.jpg)](/assets/images/paperfaces-ideal1st-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ideal1st-process-4-600.jpg)](/assets/images/paperfaces-ideal1st-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ideal1st-process-5-600.jpg)](/assets/images/paperfaces-ideal1st-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ideal1st-process-6-600.jpg)](/assets/images/paperfaces-ideal1st-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ideal1st-process-7-600.jpg)](/assets/images/paperfaces-ideal1st-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-24-jess-j-portrait.md",
    "content": "---\ntitle: \"Red glow\"\nexcerpt: \"PaperFaces portrait of a Jess J. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jess-j.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jess-j-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T14:22:50-05:00\n---\n\nThe mouth was such a struggle for me on this one --- I suppose that's what I get for working small.\n\nUnfortunately the pencil tool doesn't scale in size when zoomed in like the ink tools, so it was impossible to do fine line detail work. Instead of wasting a few more hours on it I just went old school *faceless* and called it a night.\n\nPaperFaces portrait of a [Jess J.](https://sktchy.com/pFAWd) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jess-j-process-1-600.jpg)](/assets/images/paperfaces-jess-j-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jess-j-process-2-600.jpg)](/assets/images/paperfaces-jess-j-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jess-j-process-3-600.jpg)](/assets/images/paperfaces-jess-j-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jess-j-process-4-600.jpg)](/assets/images/paperfaces-jess-j-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jess-j-process-5-600.jpg)](/assets/images/paperfaces-jess-j-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jess-j-process-6-600.jpg)](/assets/images/paperfaces-jess-j-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jess-j-process-7-600.jpg)](/assets/images/paperfaces-jess-j-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-24-marcus-portrait.md",
    "content": "---\ntitle: \"Bashful hair\"\nexcerpt: \"PaperFaces portrait of a Marcus drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-marcus.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-marcus-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:22:09-05:00\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-marcus-process-1-600.jpg)](/assets/images/paperfaces-marcus-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marcus-process-2-600.jpg)](/assets/images/paperfaces-marcus-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marcus-process-3-600.jpg)](/assets/images/paperfaces-marcus-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marcus-process-4-600.jpg)](/assets/images/paperfaces-marcus-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marcus-process-5-600.jpg)](/assets/images/paperfaces-marcus-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marcus-process-6-600.jpg)](/assets/images/paperfaces-marcus-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marcus-process-7-600.jpg)](/assets/images/paperfaces-marcus-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-26-marie-a-portrait.md",
    "content": "---\ntitle: \"Cousin It\"\nexcerpt: \"PaperFaces portrait of a Marie A. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-marie-a.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-marie-a-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T14:21:27-05:00\n---\n\nPaperFaces portrait of a [Marie A.](https://sktchy.com/7uxxdC) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-marie-a-process-1-600.jpg)](/assets/images/paperfaces-marie-a-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marie-a-process-2-600.jpg)](/assets/images/paperfaces-marie-a-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marie-a-process-3-600.jpg)](/assets/images/paperfaces-marie-a-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marie-a-process-4-600.jpg)](/assets/images/paperfaces-marie-a-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-marie-a-process-5-600.jpg)](/assets/images/paperfaces-marie-a-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-26-zakatnov-portrait.md",
    "content": "---\ntitle: \"Breathing underwater\"\nexcerpt: \"PaperFaces portrait of @Zakatnov drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-zakatnov-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-zakatnov-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:20:46-05:00\n---\n\nPaperFaces portrait of [@Zakatnov](https://twitter.com/Zakatnov).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-zakatnov-process-1-600.jpg)](/assets/images/paperfaces-zakatnov-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-zakatnov-process-2-600.jpg)](/assets/images/paperfaces-zakatnov-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-zakatnov-process-3-600.jpg)](/assets/images/paperfaces-zakatnov-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-zakatnov-process-4-600.jpg)](/assets/images/paperfaces-zakatnov-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-28-lisaorye-portrait.md",
    "content": "---\ntitle: \"Painted nails\"\nexcerpt: \"PaperFaces portrait of @lisaorye drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lisaorye-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lisaorye-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:20:01-05:00\n---\n\nPaperFaces portrait commission of [@lisaorye](https://twitter.com/lisaorye).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lisaorye-process-1-600.jpg)](/assets/images/paperfaces-lisaorye-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lisaorye-process-2-600.jpg)](/assets/images/paperfaces-lisaorye-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lisaorye-process-3-600.jpg)](/assets/images/paperfaces-lisaorye-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lisaorye-process-4-600.jpg)](/assets/images/paperfaces-lisaorye-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-lisaorye-process-5-600.jpg)](/assets/images/paperfaces-lisaorye-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-28-rubenharris-portrait.md",
    "content": "---\ntitle: \"Cello, is it me you're looking for?\"\nexcerpt: \"PaperFaces portrait of @rubenharris drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rubenharris-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rubenharris-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:19:19-05:00\n---\n\nPaperFaces portrait commission of [@rubenharris](https://twitter.com/rubenharris).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rubenharris-process-1-600.jpg)](/assets/images/paperfaces-rubenharris-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rubenharris-process-2-600.jpg)](/assets/images/paperfaces-rubenharris-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rubenharris-process-3-600.jpg)](/assets/images/paperfaces-rubenharris-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rubenharris-process-4-600.jpg)](/assets/images/paperfaces-rubenharris-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rubenharris-process-5-600.jpg)](/assets/images/paperfaces-rubenharris-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-31-beauty-profile-portrait.md",
    "content": "---\ntitle: \"Beauty is in the moment\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-beauty-profile.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-beauty-profile-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait commission. *Beauty is in the moment, not the image.*\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-1-600.jpg)](/assets/images/paperfaces-beauty-profile-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-2-600.jpg)](/assets/images/paperfaces-beauty-profile-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-3-600.jpg)](/assets/images/paperfaces-beauty-profile-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-4-600.jpg)](/assets/images/paperfaces-beauty-profile-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-5-600.jpg)](/assets/images/paperfaces-beauty-profile-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-6-600.jpg)](/assets/images/paperfaces-beauty-profile-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-7-600.jpg)](/assets/images/paperfaces-beauty-profile-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-beauty-profile-process-8-600.jpg)](/assets/images/paperfaces-beauty-profile-process-8-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-31-j-miner9-portrait.md",
    "content": "---\ntitle: \"Le hockey sur glace\"\nexcerpt: \"PaperFaces portrait commission of @J_Miner9 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-j-miner9.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-j-miner9-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait commission of [@J_Miner9](https://twitter.com/J_Miner9).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-j-miner9-process-1-600.jpg)](/assets/images/paperfaces-j-miner9-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-j-miner9-process-2-600.jpg)](/assets/images/paperfaces-j-miner9-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-j-miner9-process-3-600.jpg)](/assets/images/paperfaces-j-miner9-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-j-miner9-process-4-600.jpg)](/assets/images/paperfaces-j-miner9-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-03-31-jamesramsay-portrait.md",
    "content": "---\ntitle: \"Climbing mountains\"\nexcerpt: \"PaperFaces portrait of @JamesRamsay drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jamesramsay-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jamesramsay-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:18:25-05:00\n---\n\nPaperFaces portrait of [@JamesRamsay](https://twitter.com/JamesRamsay).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jamesramsay-process-1-600.jpg)](/assets/images/paperfaces-jamesramsay-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jamesramsay-process-2-600.jpg)](/assets/images/paperfaces-jamesramsay-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jamesramsay-process-3-600.jpg)](/assets/images/paperfaces-jamesramsay-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jamesramsay-process-4-600.jpg)](/assets/images/paperfaces-jamesramsay-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-jamesramsay-process-5-600.jpg)](/assets/images/paperfaces-jamesramsay-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-01-amyburvall-portrait.md",
    "content": "---\ntitle: \"A hair flower without color\"\nexcerpt: \"PaperFaces portrait of @amyburvall drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-amyburvall-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-amyburvall-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:17:46-05:00\n---\n\nPaperFaces portrait of [@amyburvall](https://twitter.com/amyburvall).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-amyburvall-process-1-600.jpg)](/assets/images/paperfaces-amyburvall-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-amyburvall-process-2-600.jpg)](/assets/images/paperfaces-amyburvall-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-amyburvall-process-3-600.jpg)](/assets/images/paperfaces-amyburvall-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-amyburvall-process-4-600.jpg)](/assets/images/paperfaces-amyburvall-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-02-cellguru-portrait.md",
    "content": "---\ntitle: \"Hoodie and a glow\"\nexcerpt: \"PaperFaces portrait of @cellguru drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cellguru-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cellguru-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:17:01-05:00\n---\n\nPaperFaces portrait of [@cellguru](https://twitter.com/cellguru).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cellguru-process-1-600.jpg)](/assets/images/paperfaces-cellguru-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cellguru-process-2-600.jpg)](/assets/images/paperfaces-cellguru-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cellguru-process-3-600.jpg)](/assets/images/paperfaces-cellguru-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cellguru-process-4-600.jpg)](/assets/images/paperfaces-cellguru-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-cellguru-process-5-600.jpg)](/assets/images/paperfaces-cellguru-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-04-ellaweston-portrait.md",
    "content": "---\ntitle: \"The sun casts pale light\"\nexcerpt: \"PaperFaces portrait of @ellaweston drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ellaweston-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ellaweston-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:16:17-05:00\n---\n\nPaperFaces portrait of [@ellaweston](https://twitter.com/ellaweston).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ellaweston-process-1-600.jpg)](/assets/images/paperfaces-ellaweston-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ellaweston-process-2-600.jpg)](/assets/images/paperfaces-ellaweston-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ellaweston-process-3-600.jpg)](/assets/images/paperfaces-ellaweston-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ellaweston-process-4-600.jpg)](/assets/images/paperfaces-ellaweston-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ellaweston-process-5-600.jpg)](/assets/images/paperfaces-ellaweston-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-04-snowwhitechaos-portrait.md",
    "content": "---\ntitle: \"Causing chaos\"\nexcerpt: \"PaperFaces portrait of @SnowWhiteChaos drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-snowwhitechaos-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-snowwhitechaos-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:15:26-05:00\n---\n\nPaperFaces portrait of [@SnowWhiteChaos](https://twitter.com/SnowWhiteChaos).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-snowwhitechaos-process-1-600.jpg)](/assets/images/paperfaces-snowwhitechaos-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-snowwhitechaos-process-2-600.jpg)](/assets/images/paperfaces-snowwhitechaos-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-snowwhitechaos-process-3-600.jpg)](/assets/images/paperfaces-snowwhitechaos-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-snowwhitechaos-process-4-600.jpg)](/assets/images/paperfaces-snowwhitechaos-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-06-fivepops-2-portrait.md",
    "content": "---\ntitle: \"Graduation Two\"\nexcerpt: \"PaperFaces portrait drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fivepops-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fivepops-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:12:05-05:00\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-2-process-1-600.jpg)](/assets/images/paperfaces-fivepops-2-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-2-process-2-600.jpg)](/assets/images/paperfaces-fivepops-2-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-2-process-3-600.jpg)](/assets/images/paperfaces-fivepops-2-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-2-process-4-600.jpg)](/assets/images/paperfaces-fivepops-2-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-2-process-5-600.jpg)](/assets/images/paperfaces-fivepops-2-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-fivepops-2-process-6-600.jpg)](/assets/images/paperfaces-fivepops-2-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-07-hjalle-portrait.md",
    "content": "---\ntitle: \"Hold up\"\nexcerpt: \"PaperFaces portrait of @hjalle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hjalle-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hjalle-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:11:14-05:00\n---\n\nPaperFaces portrait of [@hjalle](https://twitter.com/hjalle).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-hjalle-process-1-600.jpg)](/assets/images/paperfaces-hjalle-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hjalle-process-2-600.jpg)](/assets/images/paperfaces-hjalle-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hjalle-process-3-600.jpg)](/assets/images/paperfaces-hjalle-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hjalle-process-4-600.jpg)](/assets/images/paperfaces-hjalle-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hjalle-process-5-600.jpg)](/assets/images/paperfaces-hjalle-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-hjalle-process-6-600.jpg)](/assets/images/paperfaces-hjalle-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-07-reborg-portrait.md",
    "content": "---\ntitle: \"Collars up\"\nexcerpt: \"PaperFaces portrait of @reborg drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-reborg-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-reborg-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:10:21-05:00\n---\n\nPaperFaces portrait of [@reborg](https://twitter.com/reborg).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-reborg-process-1-600.jpg)](/assets/images/paperfaces-reborg-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-reborg-process-2-600.jpg)](/assets/images/paperfaces-reborg-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-reborg-process-3-600.jpg)](/assets/images/paperfaces-reborg-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-reborg-process-4-600.jpg)](/assets/images/paperfaces-reborg-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-07-robeberhardt-portrait.md",
    "content": "---\ntitle: \"Blank stare\"\nexcerpt: \"PaperFaces portrait of @robeberhardt drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-robeberhardt-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-robeberhardt-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:09:41-05:00\n---\n\nPaperFaces portrait of [@robeberhardt](https://twitter.com/robeberhardt).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-robeberhardt-process-1-600.jpg)](/assets/images/paperfaces-robeberhardt-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robeberhardt-process-2-600.jpg)](/assets/images/paperfaces-robeberhardt-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robeberhardt-process-3-600.jpg)](/assets/images/paperfaces-robeberhardt-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-robeberhardt-process-4-600.jpg)](/assets/images/paperfaces-robeberhardt-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-10-luvgahyun-portrait.md",
    "content": "---\ntitle: \"Hug the moon\"\nexcerpt: \"PaperFaces portrait of @luvgahyun drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-luvgahyun-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-luvgahyun-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:08:59-05:00\n---\n\nPaperFaces portrait of [@luvgahyun](https://twitter.com/luvgahyun).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-luvgahyun-process-1-600.jpg)](/assets/images/paperfaces-luvgahyun-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luvgahyun-process-2-600.jpg)](/assets/images/paperfaces-luvgahyun-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luvgahyun-process-3-600.jpg)](/assets/images/paperfaces-luvgahyun-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luvgahyun-process-4-600.jpg)](/assets/images/paperfaces-luvgahyun-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luvgahyun-process-5-600.jpg)](/assets/images/paperfaces-luvgahyun-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luvgahyun-process-6-600.jpg)](/assets/images/paperfaces-luvgahyun-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-luvgahyun-process-7-600.jpg)](/assets/images/paperfaces-luvgahyun-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-10-pao-t-portrait.md",
    "content": "---\ntitle: \"Jean jacket rock\"\nexcerpt: \"PaperFaces portrait of a Pao T. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pao-t.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pao-t-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T14:08:08-05:00\n---\n\nPaperFaces portrait of a [Pao T.](https://sktchy.com/LWk59H) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-pao-t-process-1-600.jpg)](/assets/images/paperfaces-pao-t-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-pao-t-process-2-600.jpg)](/assets/images/paperfaces-pao-t-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-pao-t-process-3-600.jpg)](/assets/images/paperfaces-pao-t-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-pao-t-process-4-600.jpg)](/assets/images/paperfaces-pao-t-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-pao-t-process-5-600.jpg)](/assets/images/paperfaces-pao-t-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-11-ivanhcsim-portrait.md",
    "content": "---\ntitle: \"One year\"\nexcerpt: \"PaperFaces portrait of @IvanHCSim drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ivanhcsim-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ivanhcsim-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait of [@IvanHCSim](https://twitter.com/IvanHCSim).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ivanhcsim-process-1-600.jpg)](/assets/images/paperfaces-ivanhcsim-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ivanhcsim-process-2-600.jpg)](/assets/images/paperfaces-ivanhcsim-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ivanhcsim-process-3-600.jpg)](/assets/images/paperfaces-ivanhcsim-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ivanhcsim-process-4-600.jpg)](/assets/images/paperfaces-ivanhcsim-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ivanhcsim-process-5-600.jpg)](/assets/images/paperfaces-ivanhcsim-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ivanhcsim-process-6-600.jpg)](/assets/images/paperfaces-ivanhcsim-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ivanhcsim-process-7-600.jpg)](/assets/images/paperfaces-ivanhcsim-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-14-johntwolives-portrait.md",
    "content": "---\ntitle: \"Posterized in yellow\"\nexcerpt: \"PaperFaces portrait of @johntwolives drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-johntwolives-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-johntwolives-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:07:22-05:00\n---\n\nPaperFaces portrait of [@johntwolives](https://twitter.com/johntwolives).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-johntwolives-process-1-600.jpg)](/assets/images/paperfaces-johntwolives-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-johntwolives-process-2-600.jpg)](/assets/images/paperfaces-johntwolives-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-johntwolives-process-3-600.jpg)](/assets/images/paperfaces-johntwolives-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-johntwolives-process-4-600.jpg)](/assets/images/paperfaces-johntwolives-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-johntwolives-process-5-600.jpg)](/assets/images/paperfaces-johntwolives-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-johntwolives-process-6-600.jpg)](/assets/images/paperfaces-johntwolives-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-johntwolives-process-7-600.jpg)](/assets/images/paperfaces-johntwolives-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-14-m-large-portrait.md",
    "content": "---\ntitle: \"Beard envy\"\nexcerpt: \"PaperFaces portrait of a M Large drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-m-large.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-m-large-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, beard, bokeh, black and white]\n---\n\nPaperFaces portrait of a [M Large](https://sktchy.com/0qfVg) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-m-large-process-1-600.jpg)](/assets/images/paperfaces-m-large-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-m-large-process-2-600.jpg)](/assets/images/paperfaces-m-large-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-m-large-process-3-600.jpg)](/assets/images/paperfaces-m-large-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-m-large-process-4-600.jpg)](/assets/images/paperfaces-m-large-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-m-large-process-5-600.jpg)](/assets/images/paperfaces-m-large-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-m-large-process-6-600.jpg)](/assets/images/paperfaces-m-large-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-m-large-process-7-600.jpg)](/assets/images/paperfaces-m-large-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-14-xbrokencydez-portrait.md",
    "content": "---\ntitle: \"Spelling mistakes\"\nexcerpt: \"PaperFaces portrait of @xbrokencydez drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-xbrokencydez-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-xbrokencydez-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:06:18-05:00\n---\n\nPaperFaces portrait of [@xbrokencydez](https://twitter.com/xbrokencydez).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-xbrokencydez-process-1-600.jpg)](/assets/images/paperfaces-xbrokencydez-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-xbrokencydez-process-2-600.jpg)](/assets/images/paperfaces-xbrokencydez-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-xbrokencydez-process-3-600.jpg)](/assets/images/paperfaces-xbrokencydez-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-xbrokencydez-process-4-600.jpg)](/assets/images/paperfaces-xbrokencydez-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-15-buttchinbro-portrait.md",
    "content": "---\ntitle: \"The Declaration of Independence is mine\"\nexcerpt: \"PaperFaces portrait of @ButtChinBro drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-buttchinbro-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-buttchinbro-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:05:26-05:00\n---\n\nPaperFaces portrait of [@ButtChinBro](https://twitter.com/ButtChinBro).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-buttchinbro-process-1-600.jpg)](/assets/images/paperfaces-buttchinbro-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-buttchinbro-process-2-600.jpg)](/assets/images/paperfaces-buttchinbro-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-buttchinbro-process-3-600.jpg)](/assets/images/paperfaces-buttchinbro-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-buttchinbro-process-4-600.jpg)](/assets/images/paperfaces-buttchinbro-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-16-mikeredmer-portrait.md",
    "content": "---\ntitle: \"Wearing Glass like a boss\"\nexcerpt: \"PaperFaces portrait of @mikeredmer drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mikeredmer-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mikeredmer-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:04:41-05:00\n---\n\nPaperFaces portrait of [@mikeredmer](https://twitter.com/mikeredmer).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mikeredmer-process-1-600.jpg)](/assets/images/paperfaces-mikeredmer-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mikeredmer-process-2-600.jpg)](/assets/images/paperfaces-mikeredmer-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mikeredmer-process-3-600.jpg)](/assets/images/paperfaces-mikeredmer-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mikeredmer-process-4-600.jpg)](/assets/images/paperfaces-mikeredmer-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mikeredmer-process-5-600.jpg)](/assets/images/paperfaces-mikeredmer-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-17-theladykendrick-portrait.md",
    "content": "---\ntitle: \"Hello face\"\nexcerpt: \"PaperFaces portrait of @TheLadyKendrick drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-theladykendrick-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-theladykendrick-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:03:50-05:00\n---\n\nPaperFaces portrait of [@TheLadyKendrick](https://twitter.com/TheLadyKendrick).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-theladykendrick-process-1-600.jpg)](/assets/images/paperfaces-theladykendrick-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theladykendrick-process-2-600.jpg)](/assets/images/paperfaces-theladykendrick-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theladykendrick-process-3-600.jpg)](/assets/images/paperfaces-theladykendrick-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theladykendrick-process-4-600.jpg)](/assets/images/paperfaces-theladykendrick-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-theladykendrick-process-5-600.jpg)](/assets/images/paperfaces-theladykendrick-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-18-mifredk-portrait.md",
    "content": "---\ntitle: \"Buttoned up in a sweater\"\nexcerpt: \"PaperFaces portrait of @mifredk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mifredk-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mifredk-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:02:50-05:00\n---\n\nPaperFaces portrait of [@mifredk](https://twitter.com/mifredk).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mifredk-process-1-600.jpg)](/assets/images/paperfaces-mifredk-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mifredk-process-2-600.jpg)](/assets/images/paperfaces-mifredk-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mifredk-process-3-600.jpg)](/assets/images/paperfaces-mifredk-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mifredk-process-4-600.jpg)](/assets/images/paperfaces-mifredk-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mifredk-process-5-600.jpg)](/assets/images/paperfaces-mifredk-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mifredk-process-6-600.jpg)](/assets/images/paperfaces-mifredk-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-22-matthewrex-portrait.md",
    "content": "---\ntitle: \"Beard over the shoulder\"\nexcerpt: \"PaperFaces portrait of @matthewrex drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-matthewrex-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-matthewrex-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\nlast_modified_at: 2017-01-17T14:01:58-05:00\n---\n\nPaperFaces portrait of [@matthewrex](https://twitter.com/matthewrex).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-matthewrex-process-1-600.jpg)](/assets/images/paperfaces-matthewrex-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matthewrex-process-2-600.jpg)](/assets/images/paperfaces-matthewrex-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matthewrex-process-3-600.jpg)](/assets/images/paperfaces-matthewrex-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-matthewrex-process-4-600.jpg)](/assets/images/paperfaces-matthewrex-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-22-monaura0-portrait.md",
    "content": "---\ntitle: \"Lip lick\"\nexcerpt: \"PaperFaces portrait of @monaura0 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-monaura0-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-monaura0-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T14:01:13-05:00\n---\n\nPaperFaces portrait of [@monaura0](https://twitter.com/monaura0).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-monaura0-process-1-600.jpg)](/assets/images/paperfaces-monaura0-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-monaura0-process-2-600.jpg)](/assets/images/paperfaces-monaura0-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-monaura0-process-3-600.jpg)](/assets/images/paperfaces-monaura0-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-monaura0-process-4-600.jpg)](/assets/images/paperfaces-monaura0-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-monaura0-process-5-600.jpg)](/assets/images/paperfaces-monaura0-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-22-scarlett-johansson-portrait.md",
    "content": "---\ntitle: \"Warm Face\"\nexcerpt: \"PaperFaces portrait of Scarlett Johansson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-scarlett-johansson.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-scarlett-johansson-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T14:00:31-05:00\n---\n\nFor a detailed breakdown of how I drew this portrait (and others), follow along with my [Mastering Paper tutorial]({% post_url /mastering-paper/2014-04-21-drawing-faces %}). Learn how I use Paper's watercolor brush and colored pencils to add depth and realism to a drawing.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-1-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-2-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-3-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-4-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-5-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-6-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-7-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-7-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-8-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-8-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-9-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-9-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-10-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-10-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-11-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-11-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-12-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-12-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-scarlett-johansson-process-13-600.jpg)](/assets/images/paperfaces-scarlett-johansson-process-13-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-22-stilettoodiva-portrait.md",
    "content": "---\ntitle: \"Vintage cool\"\nexcerpt: \"PaperFaces portrait of @StilettOoDiva drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-stilettoodiva-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-stilettoodiva-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T13:59:44-05:00\n---\n\nPaperFaces portrait of [@StilettOoDiva](https://twitter.com/stilettoodiva).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-stilettoodiva-process-1-600.jpg)](/assets/images/paperfaces-stilettoodiva-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-stilettoodiva-process-2-600.jpg)](/assets/images/paperfaces-stilettoodiva-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-stilettoodiva-process-3-600.jpg)](/assets/images/paperfaces-stilettoodiva-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-stilettoodiva-process-4-600.jpg)](/assets/images/paperfaces-stilettoodiva-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-stilettoodiva-process-5-600.jpg)](/assets/images/paperfaces-stilettoodiva-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-stilettoodiva-process-6-600.jpg)](/assets/images/paperfaces-stilettoodiva-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-24-neil-pie-portrait.md",
    "content": "---\ntitle: \"Open eye\"\nexcerpt: \"PaperFaces portrait of @neil_pie drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-neil-pie-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-neil-pie-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T13:58:56-05:00\n---\n\nPaperFaces portrait of [@neil_pie](https://twitter.com/neil_pie).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-neil-pie-process-1-600.jpg)](/assets/images/paperfaces-neil-pie-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-neil-pie-process-2-600.jpg)](/assets/images/paperfaces-neil-pie-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-neil-pie-process-3-600.jpg)](/assets/images/paperfaces-neil-pie-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-neil-pie-process-4-600.jpg)](/assets/images/paperfaces-neil-pie-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-neil-pie-process-5-600.jpg)](/assets/images/paperfaces-neil-pie-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-24-rose-l-portrait.md",
    "content": "---\ntitle: \"45 degree tilt\"\nexcerpt: \"PaperFaces portrait of a Rose L. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rose-l.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rose-l-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh, Sktchy]\n---\n\nPaperFaces portrait of a [Rose L.](https://sktchy.com/Bf0pYC) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rose-l-process-1-600.jpg)](/assets/images/paperfaces-rose-l-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rose-l-process-2-600.jpg)](/assets/images/paperfaces-rose-l-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rose-l-process-3-600.jpg)](/assets/images/paperfaces-rose-l-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rose-l-process-4-600.jpg)](/assets/images/paperfaces-rose-l-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rose-l-process-5-600.jpg)](/assets/images/paperfaces-rose-l-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rose-l-process-6-600.jpg)](/assets/images/paperfaces-rose-l-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-rose-l-process-7-600.jpg)](/assets/images/paperfaces-rose-l-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-25-ashyda-portrait.md",
    "content": "---\ntitle: \"Snake bites\"\nexcerpt: \"PaperFaces portrait of @ashyda drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ashyda-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ashyda-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T13:58:01-05:00\n---\n\nPaperFaces portrait of [@ashyda](https://twitter.com/ashyda).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ashyda-process-1-600.jpg)](/assets/images/paperfaces-ashyda-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ashyda-process-2-600.jpg)](/assets/images/paperfaces-ashyda-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ashyda-process-3-600.jpg)](/assets/images/paperfaces-ashyda-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ashyda-process-4-600.jpg)](/assets/images/paperfaces-ashyda-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ashyda-process-5-600.jpg)](/assets/images/paperfaces-ashyda-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-ashyda-process-6-600.jpg)](/assets/images/paperfaces-ashyda-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-28-akaiiro-portrait.md",
    "content": "---\ntitle: \"An upward tilt\"\nexcerpt: \"PaperFaces portrait of @akaiiro drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-akaiiro-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-akaiiro-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T13:03:19-05:00\n---\n\nPaperFaces portrait of [@akaiiro](https://twitter.com/akaiiro).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-akaiiro-process-1-600.jpg)](/assets/images/paperfaces-akaiiro-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-akaiiro-process-2-600.jpg)](/assets/images/paperfaces-akaiiro-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-akaiiro-process-3-600.jpg)](/assets/images/paperfaces-akaiiro-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-akaiiro-process-4-600.jpg)](/assets/images/paperfaces-akaiiro-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-akaiiro-process-5-600.jpg)](/assets/images/paperfaces-akaiiro-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-akaiiro-process-6-600.jpg)](/assets/images/paperfaces-akaiiro-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-28-bzhgeek-portrait.md",
    "content": "---\ntitle: \"Soft blur to the right\"\nexcerpt: \"PaperFaces portrait of @BZHgeek drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bzhgeek-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bzhgeek-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T13:02:38-05:00\n---\n\nPaperFaces portrait of [@BZHgeek](https://twitter.com/BZHgeek).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bzhgeek-process-1-600.jpg)](/assets/images/paperfaces-bzhgeek-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bzhgeek-process-2-600.jpg)](/assets/images/paperfaces-bzhgeek-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bzhgeek-process-3-600.jpg)](/assets/images/paperfaces-bzhgeek-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bzhgeek-process-4-600.jpg)](/assets/images/paperfaces-bzhgeek-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bzhgeek-process-5-600.jpg)](/assets/images/paperfaces-bzhgeek-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bzhgeek-process-6-600.jpg)](/assets/images/paperfaces-bzhgeek-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-28-matilda-jane-twins-portrait.md",
    "content": "---\ntitle: \"Matilda Jane Rosebuds\"\nexcerpt: \"PaperFaces portrait of the rosebuds drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-matilda-jane-twins.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-matilda-jane-twins-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, twins]\n---\n\nPaperFaces portrait of the [two little rosebuds](http://2littlerosebuds.com/2014/04/24/matilda-jane-spring-clothing-review-giveaway-ends/) modeling clothing from Matilda Jane.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mj-twins-process-1-600.jpg)](/assets/images/paperfaces-mj-twins-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mj-twins-process-2-600.jpg)](/assets/images/paperfaces-mj-twins-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mj-twins-process-3-600.jpg)](/assets/images/paperfaces-mj-twins-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mj-twins-process-4-600.jpg)](/assets/images/paperfaces-mj-twins-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mj-twins-process-5-600.jpg)](/assets/images/paperfaces-mj-twins-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-mj-twins-process-6-600.jpg)](/assets/images/paperfaces-mj-twins-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-29-bengillam-portrait.md",
    "content": "---\ntitle: \"Black cat Cadillac\"\nexcerpt: \"PaperFaces portrait of @bengillam drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bengillam-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bengillam-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T13:01:50-05:00\n---\n\nPaperFaces portrait of [@bengillam](https://twitter.com/bengillam).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bengillam-process-1-600.jpg)](/assets/images/paperfaces-bengillam-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bengillam-process-2-600.jpg)](/assets/images/paperfaces-bengillam-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bengillam-process-3-600.jpg)](/assets/images/paperfaces-bengillam-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-bengillam-process-4-600.jpg)](/assets/images/paperfaces-bengillam-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-04-30-han-solo-portrait.md",
    "content": "---\ntitle: \"I know\"\nexcerpt: \"PaperFaces portrait Han Solo and Princess Leia drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-han-solo-leia.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-han-solo-leia-150.jpg\nlast_modified_at: 2014-05-01\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars, time lapse]\n---\n\nWith the recent Star Wars Episode VII casting news and *May the 4th* nearly upon us, I decided to kickoff the week with SW inspired drawings. I'm planning on recreating scenes and characters from all of the movies each night using Paper for iOS as per usual.\n\nLast year I stuck to the original trilogy with my [Darth Vader]({% post_url /paperfaces/2013-05-04-darth-vader-portrait %}), [Boba Fett]({% post_url /paperfaces/2013-05-04-boba-fett-portrait %}), [Luke]({% post_url /paperfaces/2013-05-04-yoda-luke-skywalker-portrait %}), [Leia]({% post_url /paperfaces/2013-05-04-slave-leia-jabba-the-hutt-portrait %}), and [Chewbacca]({% post_url /paperfaces/2013-05-04-chewbacca-leia-boob-portrait %}) portraits. This year I'm planning on mixing in a few faces from the prequels to cover the whole spectrum of films.\n\n{% youtube 9e1nPyHXCFQ %}\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-han-solo-process-1-600.jpg)](/assets/images/paperfaces-han-solo-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-han-solo-process-2-600.jpg)](/assets/images/paperfaces-han-solo-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-han-solo-process-3-600.jpg)](/assets/images/paperfaces-han-solo-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-han-solo-process-4-600.jpg)](/assets/images/paperfaces-han-solo-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-han-solo-process-5-600.jpg)](/assets/images/paperfaces-han-solo-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-han-solo-process-6-600.jpg)](/assets/images/paperfaces-han-solo-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-01-general-grievous-portrait.md",
    "content": "---\ntitle: \"Jedi scum\"\nexcerpt: \"PaperFaces portrait General Grievous drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-general-grievous.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-general-grievous-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars]\n---\n\nPaperFaces portrait of General Grievous from Episode III: Revenge of the Sith.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-general-grievous-process-1-600.jpg)](/assets/images/paperfaces-general-grievous-process-1-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-general-grievous-process-2-600.jpg)](/assets/images/paperfaces-general-grievous-process-2-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-general-grievous-process-3-600.jpg)](/assets/images/paperfaces-general-grievous-process-3-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-general-grievous-process-4-600.jpg)](/assets/images/paperfaces-general-grievous-process-4-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-general-grievous-process-5-600.jpg)](/assets/images/paperfaces-general-grievous-process-5-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-general-grievous-process-6-600.jpg)](/assets/images/paperfaces-general-grievous-process-6-lg.jpg)\n[![Work in process screenshot](/assets/images/paperfaces-general-grievous-process-7-600.jpg)](/assets/images/paperfaces-general-grievous-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-02-emperor-palpatine-portrait.md",
    "content": "---\ntitle: \"And now, young Skywalker... you will die.\"\nexcerpt: \"PaperFaces portrait Emperor Palpatine drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-emperor-palpatine.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-emperor-palpatine-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars]\n---\n\nPaperFaces portrait of Emperor Palpatine using force lighting in Episode VI: Return of the Jedi.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-emperor-palpatine-process-1-600.jpg)](/assets/images/paperfaces-emperor-palpatine-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-emperor-palpatine-process-2-600.jpg)](/assets/images/paperfaces-emperor-palpatine-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-emperor-palpatine-process-3-600.jpg)](/assets/images/paperfaces-emperor-palpatine-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-emperor-palpatine-process-4-600.jpg)](/assets/images/paperfaces-emperor-palpatine-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-emperor-palpatine-process-5-600.jpg)](/assets/images/paperfaces-emperor-palpatine-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-emperor-palpatine-process-6-600.jpg)](/assets/images/paperfaces-emperor-palpatine-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-emperor-palpatine-process-7-600.jpg)](/assets/images/paperfaces-emperor-palpatine-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-05-admiral-ackbar-portrait.md",
    "content": "---\ntitle: \"It's a trap!\"\nexcerpt: \"PaperFaces portrait Admiral Ackbar drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-admiral-ackbar.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-admiral-ackbar-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars]\n---\n\nPaperFaces portrait of Admiral Ackbar from Episode VI: Return of the Jedi.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-admiral-ackbar-process-1-600.jpg)](/assets/images/paperfaces-admiral-ackbar-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-admiral-ackbar-process-2-600.jpg)](/assets/images/paperfaces-admiral-ackbar-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-admiral-ackbar-process-3-600.jpg)](/assets/images/paperfaces-admiral-ackbar-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-admiral-ackbar-process-4-600.jpg)](/assets/images/paperfaces-admiral-ackbar-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-admiral-ackbar-process-5-600.jpg)](/assets/images/paperfaces-admiral-ackbar-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-admiral-ackbar-process-6-600.jpg)](/assets/images/paperfaces-admiral-ackbar-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-admiral-ackbar-process-7-600.jpg)](/assets/images/paperfaces-admiral-ackbar-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-05-darth-maul-portrait.md",
    "content": "---\ntitle: \"Die, Jedi, die!\"\nexcerpt: \"PaperFaces portrait Darth Maul drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-darth-maul.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-darth-maul-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars]\n---\n\nPaperFaces portrait of Darth Maul from Episode I: The Phantom Menace.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-darth-maul-process-1-600.jpg)](/assets/images/paperfaces-darth-maul-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-darth-maul-process-2-600.jpg)](/assets/images/paperfaces-darth-maul-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-darth-maul-process-3-600.jpg)](/assets/images/paperfaces-darth-maul-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-darth-maul-process-4-600.jpg)](/assets/images/paperfaces-darth-maul-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-darth-maul-process-5-600.jpg)](/assets/images/paperfaces-darth-maul-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-05-lando-calrissian-portrait.md",
    "content": "---\ntitle: \"Here goes nothing\"\nexcerpt: \"PaperFaces portrait Lando Calrissian drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lando-calrissian.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lando-calrissian-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars]\n---\n\nPaperFaces portrait of Lando Calrissian from Episode VI: Return of the Jedi.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lando-calrissian-process-1-600.jpg)](/assets/images/paperfaces-lando-calrissian-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lando-calrissian-process-2-600.jpg)](/assets/images/paperfaces-lando-calrissian-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lando-calrissian-process-3-600.jpg)](/assets/images/paperfaces-lando-calrissian-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lando-calrissian-process-4-600.jpg)](/assets/images/paperfaces-lando-calrissian-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lando-calrissian-process-5-600.jpg)](/assets/images/paperfaces-lando-calrissian-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lando-calrissian-process-6-600.jpg)](/assets/images/paperfaces-lando-calrissian-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-05-obi-wan-kenobi-portrait.md",
    "content": "---\ntitle: \"You were the chosen one!\"\nexcerpt: \"PaperFaces portrait Obi-Wan Kenobi drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-obi-wan-kenobi.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-obi-wan-kenobi-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars, beard]\n---\n\nPaperFaces portrait of Obi-Wan Kenobi from Episode III: Revenge of the Sith.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-obi-wan-kenobi-process-1-600.jpg)](/assets/images/paperfaces-obi-wan-kenobi-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-obi-wan-kenobi-process-2-600.jpg)](/assets/images/paperfaces-obi-wan-kenobi-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-obi-wan-kenobi-process-3-600.jpg)](/assets/images/paperfaces-obi-wan-kenobi-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-obi-wan-kenobi-process-4-600.jpg)](/assets/images/paperfaces-obi-wan-kenobi-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-obi-wan-kenobi-process-5-600.jpg)](/assets/images/paperfaces-obi-wan-kenobi-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-obi-wan-kenobi-process-6-600.jpg)](/assets/images/paperfaces-obi-wan-kenobi-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-05-romantic-couple-portrait.md",
    "content": "---\ntitle: \"Hand on hand\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-romantic-couple.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-romantic-couple-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T13:00:44-05:00\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-romantic-couple-process-1-600.jpg)](/assets/images/paperfaces-romantic-couple-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-romantic-couple-process-2-600.jpg)](/assets/images/paperfaces-romantic-couple-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-romantic-couple-process-3-600.jpg)](/assets/images/paperfaces-romantic-couple-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-romantic-couple-process-4-600.jpg)](/assets/images/paperfaces-romantic-couple-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-09-fridorr-portrait.md",
    "content": "---\ntitle: \"Sniff sniff\"\nexcerpt: \"PaperFaces portrait of @Fridorr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fridorr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fridorr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T12:59:55-05:00\n---\n\nPaperFaces portrait of [@Fridorr](https://twitter.com/Fridorr).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-fridorr-process-1-600.jpg)](/assets/images/paperfaces-fridorr-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fridorr-process-2-600.jpg)](/assets/images/paperfaces-fridorr-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fridorr-process-3-600.jpg)](/assets/images/paperfaces-fridorr-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fridorr-process-4-600.jpg)](/assets/images/paperfaces-fridorr-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-09-optimaximal-portrait.md",
    "content": "---\ntitle: \"Crazy eye\"\nexcerpt: \"PaperFaces portrait of @Optimaximal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-optimaximal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-optimaximal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T12:59:16-05:00\n---\n\nPaperFaces portrait of [@Optimaximal](https://twitter.com/optimaximal).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-optimaximal-process-1-600.jpg)](/assets/images/paperfaces-optimaximal-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-optimaximal-process-2-600.jpg)](/assets/images/paperfaces-optimaximal-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-optimaximal-process-3-600.jpg)](/assets/images/paperfaces-optimaximal-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-optimaximal-process-4-600.jpg)](/assets/images/paperfaces-optimaximal-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-optimaximal-process-5-600.jpg)](/assets/images/paperfaces-optimaximal-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-10-kate-k-portrait.md",
    "content": "---\ntitle: \"Hair in your eyes\"\nexcerpt: \"PaperFaces portrait of a Kate K. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kate-k.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kate-k-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\nlast_modified_at: 2017-01-17T12:58:34-05:00\n---\n\nPaperFaces portrait of a [Kate K.](https://sktchy.com/7Btae) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kate-k-process-1-600.jpg)](/assets/images/paperfaces-kate-k-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kate-k-process-2-600.jpg)](/assets/images/paperfaces-kate-k-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kate-k-process-3-600.jpg)](/assets/images/paperfaces-kate-k-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kate-k-process-4-600.jpg)](/assets/images/paperfaces-kate-k-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kate-k-process-5-600.jpg)](/assets/images/paperfaces-kate-k-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-10-weiheng-portrait.md",
    "content": "---\ntitle: \"I'm the Firestarter\"\nexcerpt: \"PaperFaces portrait of @WeiHeng_ drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-weiheng-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-weiheng-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T12:57:51-05:00\n---\n\nPaperFaces portrait of <a href=\"https://twitter.com/WeiHeng_\">@WeiHeng_</a>.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-weiheng-process-1-600.jpg)](/assets/images/paperfaces-weiheng-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-weiheng-process-2-600.jpg)](/assets/images/paperfaces-weiheng-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-weiheng-process-3-600.jpg)](/assets/images/paperfaces-weiheng-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-weiheng-process-4-600.jpg)](/assets/images/paperfaces-weiheng-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-12-b-a-w-portrait.md",
    "content": "---\ntitle: \"Flipped lid\"\nexcerpt: \"PaperFaces portrait of @B_A_W drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-b-a-w-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-b-a-w-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T12:57:09-05:00\n---\n\nPaperFaces portrait of [@B_A_W](https://twitter.com/B_A_W).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-b-a-w-process-1-600.jpg)](/assets/images/paperfaces-b-a-w-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-b-a-w-process-2-600.jpg)](/assets/images/paperfaces-b-a-w-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-b-a-w-process-3-600.jpg)](/assets/images/paperfaces-b-a-w-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-b-a-w-process-4-600.jpg)](/assets/images/paperfaces-b-a-w-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-b-a-w-process-5-600.jpg)](/assets/images/paperfaces-b-a-w-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-b-a-w-process-6-600.jpg)](/assets/images/paperfaces-b-a-w-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-14-crusell-portrait.md",
    "content": "---\ntitle: \"Scarf and blazer\"\nexcerpt: \"PaperFaces portrait of @crusell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-crusell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-crusell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T12:56:23-05:00\n---\n\nPaperFaces portrait of [@crusell](https://twitter.com/crusell).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-crusell-process-1-600.jpg)](/assets/images/paperfaces-crusell-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-crusell-process-2-600.jpg)](/assets/images/paperfaces-crusell-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-crusell-process-3-600.jpg)](/assets/images/paperfaces-crusell-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-crusell-process-4-600.jpg)](/assets/images/paperfaces-crusell-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-crusell-process-5-600.jpg)](/assets/images/paperfaces-crusell-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-crusell-process-6-600.jpg)](/assets/images/paperfaces-crusell-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-14-joan-martin-portrait.md",
    "content": "---\ntitle: \"Artist in gray\"\nexcerpt: \"PaperFaces portrait of a Joan Martin drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-joan-martin.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joan-martin-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\nlast_modified_at: 2017-01-17T12:55:39-05:00\n---\n\nPaperFaces portrait of a [Joan Martin](https://sktchy.com/Ch7GVH) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-joan-martin-process-1-600.jpg)](/assets/images/paperfaces-joan-martin-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-joan-martin-process-2-600.jpg)](/assets/images/paperfaces-joan-martin-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-joan-martin-process-3-600.jpg)](/assets/images/paperfaces-joan-martin-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-joan-martin-process-4-600.jpg)](/assets/images/paperfaces-joan-martin-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-joan-martin-process-5-600.jpg)](/assets/images/paperfaces-joan-martin-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-joan-martin-process-6-600.jpg)](/assets/images/paperfaces-joan-martin-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-16-ashahmoradian-portrait.md",
    "content": "---\ntitle: \"Soft spot light\"\nexcerpt: \"PaperFaces portrait of @AShahmoradian drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ashahmoradian-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ashahmoradian-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T12:54:51-05:00\n---\n\nPaperFaces portrait of [@AShahmoradian](https://twitter.com/AShahmoradian).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ashahmoradian-process-1-600.jpg)](/assets/images/paperfaces-ashahmoradian-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ashahmoradian-process-2-600.jpg)](/assets/images/paperfaces-ashahmoradian-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ashahmoradian-process-3-600.jpg)](/assets/images/paperfaces-ashahmoradian-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ashahmoradian-process-4-600.jpg)](/assets/images/paperfaces-ashahmoradian-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ashahmoradian-process-5-600.jpg)](/assets/images/paperfaces-ashahmoradian-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-16-patricia-f-portrait.md",
    "content": "---\ntitle: \"Stylin' pose\"\nexcerpt: \"PaperFaces portrait of a Patricia F. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-patricia-f.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-patricia-f-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\nlast_modified_at: 2017-01-17T12:54:04-05:00\n---\n\nPaperFaces portrait of a [Patricia F.](https://sktchy.com/hLo0C) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-patricia-f-process-1-600.jpg)](/assets/images/paperfaces-patricia-f-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-patricia-f-process-2-600.jpg)](/assets/images/paperfaces-patricia-f-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-patricia-f-process-3-600.jpg)](/assets/images/paperfaces-patricia-f-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-patricia-f-process-4-600.jpg)](/assets/images/paperfaces-patricia-f-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-19-mmistakes-2-portrait.md",
    "content": "---\ntitle: \"Scruffy beard revisited\"\nexcerpt: \"Another PaperFaces portrait of @mmistakes drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mmistakes-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mmistakes-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, self portrait]\nlast_modified_at: 2017-01-17T12:52:20-05:00\n---\n\nThe last time I drew a [self portrait]({% post_url /paperfaces/2013-05-29-michael-rose-beard-portrait %}) I didn't have a face.\n\nI thought it would be fun to take a minute from drawing strangers and work on something more familiar. Especially since the beard is no more and my [about page](/about/) could use a refresh.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mmistakes-2-process-1-600.jpg)](/assets/images/paperfaces-mmistakes-2-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mmistakes-2-process-2-600.jpg)](/assets/images/paperfaces-mmistakes-2-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mmistakes-2-process-3-600.jpg)](/assets/images/paperfaces-mmistakes-2-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mmistakes-2-process-4-600.jpg)](/assets/images/paperfaces-mmistakes-2-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mmistakes-2-process-5-600.jpg)](/assets/images/paperfaces-mmistakes-2-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mmistakes-2-process-6-600.jpg)](/assets/images/paperfaces-mmistakes-2-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mmistakes-2-process-7-600.jpg)](/assets/images/paperfaces-mmistakes-2-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-19-rdraether-portrait.md",
    "content": "---\ntitle: \"Intense eye\"\nexcerpt: \"PaperFaces portrait of @rdraether drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rdraether-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rdraether-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T12:51:21-05:00\n---\n\nPaperFaces portrait of [@rdraether](https://twitter.com/rdraether).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rdraether-process-1-600.jpg)](/assets/images/paperfaces-rdraether-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rdraether-process-2-600.jpg)](/assets/images/paperfaces-rdraether-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rdraether-process-3-600.jpg)](/assets/images/paperfaces-rdraether-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rdraether-process-4-600.jpg)](/assets/images/paperfaces-rdraether-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-19-tabbitha-s-portrait.md",
    "content": "---\ntitle: \"Live long and prosper\"\nexcerpt: \"PaperFaces portrait of a Tabbitha S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tabbitha-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tabbitha-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T12:50:38-05:00\n---\n\nPaperFaces portrait of a [Tabbitha S.](https://sktchy.com/WjxgQ) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-tabbitha-s-process-1-600.jpg)](/assets/images/paperfaces-tabbitha-s-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tabbitha-s-process-2-600.jpg)](/assets/images/paperfaces-tabbitha-s-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tabbitha-s-process-3-600.jpg)](/assets/images/paperfaces-tabbitha-s-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tabbitha-s-process-4-600.jpg)](/assets/images/paperfaces-tabbitha-s-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tabbitha-s-process-5-600.jpg)](/assets/images/paperfaces-tabbitha-s-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-23-barelolk-portrait.md",
    "content": "---\ntitle: \"Open the Pod bay doors, HAL\"\nexcerpt: \"PaperFaces portrait of @barelolk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-barelolk-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-barelolk-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T12:49:36-05:00\n---\n\nPaperFaces portrait of [@BareLolk](https://twitter.com/BareLolk).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-barelolk-process-1-600.jpg)](/assets/images/paperfaces-barelolk-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-barelolk-process-2-600.jpg)](/assets/images/paperfaces-barelolk-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-barelolk-process-3-600.jpg)](/assets/images/paperfaces-barelolk-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-barelolk-process-4-600.jpg)](/assets/images/paperfaces-barelolk-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-23-d0ugal-portrait.md",
    "content": "---\ntitle: \"Cloud and mountain pr0n\"\nexcerpt: \"PaperFaces portrait of @d0ugal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-d0ugal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-d0ugal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\nlast_modified_at: 2017-01-17T12:48:41-05:00\n---\n\nPaperFaces portrait of [@d0ugal](https://twitter.com/d0ugal).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-d0ugal-process-1-600.jpg)](/assets/images/paperfaces-d0ugal-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-d0ugal-process-2-600.jpg)](/assets/images/paperfaces-d0ugal-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-d0ugal-process-3-600.jpg)](/assets/images/paperfaces-d0ugal-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-d0ugal-process-4-600.jpg)](/assets/images/paperfaces-d0ugal-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-d0ugal-process-5-600.jpg)](/assets/images/paperfaces-d0ugal-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-23-ero-brat-portrait.md",
    "content": "---\ntitle: \"An unlit cig can't kill you\"\nexcerpt: \"PaperFaces portrait of a Ero Brat drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ero-brat.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ero-brat-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, Sktchy]\nlast_modified_at: 2017-01-17T12:47:47-05:00\n---\n\nPaperFaces portrait of a [Ero Brat](https://sktchy.com/zPm01D) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ero-brat-process-1-600.jpg)](/assets/images/paperfaces-ero-brat-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ero-brat-process-2-600.jpg)](/assets/images/paperfaces-ero-brat-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ero-brat-process-3-600.jpg)](/assets/images/paperfaces-ero-brat-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ero-brat-process-4-600.jpg)](/assets/images/paperfaces-ero-brat-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ero-brat-process-5-600.jpg)](/assets/images/paperfaces-ero-brat-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-23-itzyasmine-portrait.md",
    "content": "---\ntitle: \"Blue eyes wrapped in blue\"\nexcerpt: \"PaperFaces portrait of @itzyasmine drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-itzyasmine-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-itzyasmine-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-01-17T12:46:49-05:00\n---\n\nPaperFaces portrait of [@itzYasmine](https://twitter.com/itzYasmine).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-itzyasmine-process-1-600.jpg)](/assets/images/paperfaces-itzyasmine-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-itzyasmine-process-2-600.jpg)](/assets/images/paperfaces-itzyasmine-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-itzyasmine-process-3-600.jpg)](/assets/images/paperfaces-itzyasmine-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-itzyasmine-process-4-600.jpg)](/assets/images/paperfaces-itzyasmine-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-itzyasmine-process-5-600.jpg)](/assets/images/paperfaces-itzyasmine-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-27-eimaj-j-portrait.md",
    "content": "---\ntitle: \"Sun hat\"\nexcerpt: \"PaperFaces portrait of @eimaj_j drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-eimaj-j-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-eimaj-j-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T12:45:56-05:00\n---\n\nPaperFaces portrait of [@eimaj_j](https://twitter.com/eimaj_j).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-eimaj-j-process-1-600.jpg)](/assets/images/paperfaces-eimaj-j-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-eimaj-j-process-2-600.jpg)](/assets/images/paperfaces-eimaj-j-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-eimaj-j-process-3-600.jpg)](/assets/images/paperfaces-eimaj-j-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-eimaj-j-process-4-600.jpg)](/assets/images/paperfaces-eimaj-j-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-eimaj-j-process-5-600.jpg)](/assets/images/paperfaces-eimaj-j-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-27-kitty-shea-portrait.md",
    "content": "---\ntitle: \"Eyes up\"\nexcerpt: \"PaperFaces portrait of a Kitty Shea drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kitty-shea.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kitty-shea-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-01-17T12:44:46-05:00\n---\n\nPaperFaces portrait of a [Kitty Shea](https://sktchy.com/IgayeD) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kitty-shea-process-1-600.jpg)](/assets/images/paperfaces-kitty-shea-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kitty-shea-process-2-600.jpg)](/assets/images/paperfaces-kitty-shea-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kitty-shea-process-3-600.jpg)](/assets/images/paperfaces-kitty-shea-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kitty-shea-process-4-600.jpg)](/assets/images/paperfaces-kitty-shea-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kitty-shea-process-5-600.jpg)](/assets/images/paperfaces-kitty-shea-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-27-old-wolverine-portrait.md",
    "content": "---\ntitle: \"Days of Future Past\"\nexcerpt: \"PaperFaces portrait of Mystique and Wolverine drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2016-02-08T15:36:28-05:00\nimage: \n  path: &image /assets/images/paperfaces-old-wolverine.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-old-wolverine-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of Mystique and Wolverine from **X-men: Days of Future Past**.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-old-wolverine-process-1-600.jpg)](/assets/images/paperfaces-old-wolverine-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-old-wolverine-process-2-600.jpg)](/assets/images/paperfaces-old-wolverine-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-old-wolverine-process-3-600.jpg)](/assets/images/paperfaces-old-wolverine-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-old-wolverine-process-4-600.jpg)](/assets/images/paperfaces-old-wolverine-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-27-zombieprocess-portrait.md",
    "content": "---\ntitle: \"Half lit diagonals\"\nexcerpt: \"PaperFaces portrait of @ZombieProcess drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-zombieprocess-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-zombieprocess-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-01-17T12:41:17-05:00\n---\n\nPaperFaces portrait of [@ZombieProcess](https://twitter.com/zombieprocess).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-zombieprocess-process-1-600.jpg)](/assets/images/paperfaces-zombieprocess-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-zombieprocess-process-2-600.jpg)](/assets/images/paperfaces-zombieprocess-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-zombieprocess-process-3-600.jpg)](/assets/images/paperfaces-zombieprocess-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-zombieprocess-process-4-600.jpg)](/assets/images/paperfaces-zombieprocess-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-30-bethany-g-portrait.md",
    "content": "---\ntitle: \"Sass in shadow\"\nexcerpt: \"PaperFaces portrait of a Bethany G. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bethany-g.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bethany-g-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of a [Bethany G.](https://sktchy.com/LWJNV) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bethany-g-process-1-600.jpg)](/assets/images/paperfaces-bethany-g-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bethany-g-process-2-600.jpg)](/assets/images/paperfaces-bethany-g-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bethany-g-process-3-600.jpg)](/assets/images/paperfaces-bethany-g-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bethany-g-process-4-600.jpg)](/assets/images/paperfaces-bethany-g-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-30-fuzavue-portrait.md",
    "content": "---\ntitle: \"Guitar shredding\"\nexcerpt: \"PaperFaces portrait of @fuzavue drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fuzavue-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fuzavue-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@fuzavue](https://twitter.com/fuzavue).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-fuzavue-process-1-600.jpg)](/assets/images/paperfaces-fuzavue-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fuzavue-process-2-600.jpg)](/assets/images/paperfaces-fuzavue-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fuzavue-process-3-600.jpg)](/assets/images/paperfaces-fuzavue-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fuzavue-process-4-600.jpg)](/assets/images/paperfaces-fuzavue-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-05-30-nickkeyphotos-portrait.md",
    "content": "---\ntitle: \"Beard chin on green\"\nexcerpt: \"PaperFaces portrait of @nickkeyphotos drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nickkeyphotos-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nickkeyphotos-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@nickkeyphotos](https://twitter.com/nickkeyphotos).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-nickkeyphotos-process-1-600.jpg)](/assets/images/paperfaces-nickkeyphotos-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-nickkeyphotos-process-2-600.jpg)](/assets/images/paperfaces-nickkeyphotos-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-nickkeyphotos-process-3-600.jpg)](/assets/images/paperfaces-nickkeyphotos-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-04-cleberwsantos-portrait.md",
    "content": "---\ntitle: \"Plaid against the wall\"\nexcerpt: \"PaperFaces portrait of @cleberwsantos drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cleberwsantos-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cleberwsantos-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@cleberwsantos](https://twitter.com/cleberwsantos).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cleberwsantos-process-1-600.jpg)](/assets/images/paperfaces-cleberwsantos-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cleberwsantos-process-2-600.jpg)](/assets/images/paperfaces-cleberwsantos-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cleberwsantos-process-3-600.jpg)](/assets/images/paperfaces-cleberwsantos-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cleberwsantos-process-4-600.jpg)](/assets/images/paperfaces-cleberwsantos-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cleberwsantos-process-5-600.jpg)](/assets/images/paperfaces-cleberwsantos-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-04-duha-a-portrait.md",
    "content": "---\ntitle: \"Grumpy cat\"\nexcerpt: \"PaperFaces portrait of a Duha A. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-duha-a.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-duha-a-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of a [Duha A.](https://sktchy.com/tER3uD) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-duha-a-process-1-600.jpg)](/assets/images/paperfaces-duha-a-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-duha-a-process-2-600.jpg)](/assets/images/paperfaces-duha-a-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-duha-a-process-3-600.jpg)](/assets/images/paperfaces-duha-a-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-duha-a-process-4-600.jpg)](/assets/images/paperfaces-duha-a-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-04-erin-t-portrait.md",
    "content": "---\ntitle: \"Stripes and shadow\"\nexcerpt: \"PaperFaces portrait of a Erin T. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-erin-t.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-erin-t-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of a [Erin T.](https://sktchy.com/SUIJtH) inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-erin-t-process-1-600.jpg)](/assets/images/paperfaces-erin-t-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-erin-t-process-2-600.jpg)](/assets/images/paperfaces-erin-t-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-erin-t-process-3-600.jpg)](/assets/images/paperfaces-erin-t-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-erin-t-process-4-600.jpg)](/assets/images/paperfaces-erin-t-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-04-scoutu-portrait.md",
    "content": "---\ntitle: \"In a gray room\"\nexcerpt: \"PaperFaces portrait of @scoutu drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-scoutu-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-scoutu-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@scoutu](https://twitter.com/scoutu).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-scoutu-process-1-600.jpg)](/assets/images/paperfaces-scoutu-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-scoutu-process-2-600.jpg)](/assets/images/paperfaces-scoutu-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-scoutu-process-3-600.jpg)](/assets/images/paperfaces-scoutu-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-scoutu-process-4-600.jpg)](/assets/images/paperfaces-scoutu-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-04-ukulele-bikes-portrait.md",
    "content": "---\ntitle: \"Ukulele and bikes\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ukulele-bikes.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ukulele-bikes-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait commission.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ukulele-bikes-process-1-600.jpg)](/assets/images/paperfaces-ukulele-bikes-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ukulele-bikes-process-2-600.jpg)](/assets/images/paperfaces-ukulele-bikes-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ukulele-bikes-process-3-600.jpg)](/assets/images/paperfaces-ukulele-bikes-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ukulele-bikes-process-4-600.jpg)](/assets/images/paperfaces-ukulele-bikes-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-07-fur-mint-portrait.md",
    "content": "---\ntitle: \"Your shirt is unbuttoned\"\nexcerpt: \"PaperFaces portrait of a Fur Mint drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fur-mint.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fur-mint-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of a Fur Mint inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-fur-mint-process-1-600.jpg)](/assets/images/paperfaces-fur-mint-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fur-mint-process-2-600.jpg)](/assets/images/paperfaces-fur-mint-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fur-mint-process-3-600.jpg)](/assets/images/paperfaces-fur-mint-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fur-mint-process-4-600.jpg)](/assets/images/paperfaces-fur-mint-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fur-mint-process-5-600.jpg)](/assets/images/paperfaces-fur-mint-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fur-mint-process-6-600.jpg)](/assets/images/paperfaces-fur-mint-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-07-olly-h-portrait.md",
    "content": "---\ntitle: \"Lurking behind Domo\"\nexcerpt: \"PaperFaces portrait of a Olly H. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-olly-h.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-olly-h-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of a Olly H. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-olly-h-process-1-600.jpg)](/assets/images/paperfaces-olly-h-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-olly-h-process-2-600.jpg)](/assets/images/paperfaces-olly-h-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-olly-h-process-3-600.jpg)](/assets/images/paperfaces-olly-h-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-olly-h-process-4-600.jpg)](/assets/images/paperfaces-olly-h-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-07-tyrol-mr-portrait.md",
    "content": "---\ntitle: \"Happy doll\"\nexcerpt: \"PaperFaces portrait of @tyrol_mr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tyrol-mr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tyrol-mr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@tyrol_mr](https://twitter.com/tyrol_mr).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-tyrol-mr-process-1-600.jpg)](/assets/images/paperfaces-tyrol-mr-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tyrol-mr-process-2-600.jpg)](/assets/images/paperfaces-tyrol-mr-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tyrol-mr-process-3-600.jpg)](/assets/images/paperfaces-tyrol-mr-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tyrol-mr-process-4-600.jpg)](/assets/images/paperfaces-tyrol-mr-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tyrol-mr-process-5-600.jpg)](/assets/images/paperfaces-tyrol-mr-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-09-isantipov-portrait.md",
    "content": "---\ntitle: \"Smoke if ya got ’em\"\nexcerpt: \"PaperFaces portrait of @Isantipov drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-isantipov-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-isantipov-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Isantipov](https://twitter.com/Isantipov).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-isantipov-process-1-600.jpg)](/assets/images/paperfaces-isantipov-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-isantipov-process-2-600.jpg)](/assets/images/paperfaces-isantipov-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-isantipov-process-3-600.jpg)](/assets/images/paperfaces-isantipov-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-isantipov-process-4-600.jpg)](/assets/images/paperfaces-isantipov-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-09-marcmail-portrait.md",
    "content": "---\ntitle: \"Public transportation\"\nexcerpt: \"PaperFaces portrait of @Marcmail drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-marcmail-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-marcmail-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Marcmail](https://twitter.com/Marcmail).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-marcmail-process-1-600.jpg)](/assets/images/paperfaces-marcmail-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-marcmail-process-2-600.jpg)](/assets/images/paperfaces-marcmail-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-marcmail-process-3-600.jpg)](/assets/images/paperfaces-marcmail-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-marcmail-process-4-600.jpg)](/assets/images/paperfaces-marcmail-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-11-cahnory-portrait.md",
    "content": "---\ntitle: \"All for money\"\nexcerpt: \"PaperFaces portrait of @cahnory drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cahnory-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cahnory-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@cahnory](https://twitter.com/cahnory).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cahnory-process-1-600.jpg)](/assets/images/paperfaces-cahnory-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cahnory-process-2-600.jpg)](/assets/images/paperfaces-cahnory-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cahnory-process-3-600.jpg)](/assets/images/paperfaces-cahnory-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cahnory-process-4-600.jpg)](/assets/images/paperfaces-cahnory-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-11-ronjeffries-portrait.md",
    "content": "---\ntitle: \"Brick wall\"\nexcerpt: \"PaperFaces portrait of @RonJeffries drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ronjeffries-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ronjeffries-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@RonJeffries](https://twitter.com/RonJeffries).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ronjeffries-process-1-600.jpg)](/assets/images/paperfaces-ronjeffries-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ronjeffries-process-2-600.jpg)](/assets/images/paperfaces-ronjeffries-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ronjeffries-process-3-600.jpg)](/assets/images/paperfaces-ronjeffries-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-12-velanv-portrait.md",
    "content": "---\ntitle: \"Coffee mug bokeh\"\nexcerpt: \"PaperFaces portrait of @velanv drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-velanv-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-velanv-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait commission of [@velanv](https://twitter.com/velanv).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-velanv-process-1-600.jpg)](/assets/images/paperfaces-velanv-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-velanv-process-2-600.jpg)](/assets/images/paperfaces-velanv-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-velanv-process-3-600.jpg)](/assets/images/paperfaces-velanv-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-velanv-process-4-600.jpg)](/assets/images/paperfaces-velanv-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-velanv-process-4-600.jpg)](/assets/images/paperfaces-velanv-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-13-sidraz-portrait.md",
    "content": "---\ntitle: \"Curls of orange\"\nexcerpt: \"PaperFaces portrait of @sidraz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sidraz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sidraz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@sidraz](https://twitter.com/sidraz).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sidraz-process-1-600.jpg)](/assets/images/paperfaces-sidraz-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sidraz-process-2-600.jpg)](/assets/images/paperfaces-sidraz-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sidraz-process-3-600.jpg)](/assets/images/paperfaces-sidraz-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sidraz-process-4-600.jpg)](/assets/images/paperfaces-sidraz-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-16-ikaish-portrait.md",
    "content": "---\ntitle: \"All alone\"\nexcerpt: \"PaperFaces portrait of @ikaish drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ikaish-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ikaish-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, bokeh]\n---\n\nPaperFaces portrait of [@ikaish](https://twitter.com/ikaish).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ikaish-process-1-600.jpg)](/assets/images/paperfaces-ikaish-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ikaish-process-2-600.jpg)](/assets/images/paperfaces-ikaish-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ikaish-process-3-600.jpg)](/assets/images/paperfaces-ikaish-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ikaish-process-4-600.jpg)](/assets/images/paperfaces-ikaish-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ikaish-process-4-600.jpg)](/assets/images/paperfaces-ikaish-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ikaish-process-5-600.jpg)](/assets/images/paperfaces-ikaish-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ikaish-process-6-600.jpg)](/assets/images/paperfaces-ikaish-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-16-lydia-deetz-portrait.md",
    "content": "---\ntitle: \"I am utterly alone\"\nexcerpt: \"PaperFaces portrait of Lydia Deetz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lydia-deetz.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lydia-deetz-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Lydia Deetz from **Beetlejuice**, inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lydia-deetz-process-1-600.jpg)](/assets/images/paperfaces-lydia-deetz-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lydia-deetz-process-2-600.jpg)](/assets/images/paperfaces-lydia-deetz-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lydia-deetz-process-3-600.jpg)](/assets/images/paperfaces-lydia-deetz-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-16-t-lawson-portrait.md",
    "content": "---\ntitle: \"Zombie face\"\nexcerpt: \"PaperFaces portrait of @T_Lawson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-t-lawson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-t-lawson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@T_Lawson](https://twitter.com/T_Lawson).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-t-lawson-process-1-600.jpg)](/assets/images/paperfaces-t-lawson-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-t-lawson-process-2-600.jpg)](/assets/images/paperfaces-t-lawson-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-t-lawson-process-3-600.jpg)](/assets/images/paperfaces-t-lawson-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-t-lawson-process-4-600.jpg)](/assets/images/paperfaces-t-lawson-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-t-lawson-process-4-600.jpg)](/assets/images/paperfaces-t-lawson-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-t-lawson-process-5-600.jpg)](/assets/images/paperfaces-t-lawson-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-17-timothykrell-portrait.md",
    "content": "---\ntitle: \"Glasses of the gray\"\nexcerpt: \"PaperFaces portrait of @timothykrell drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-timothykrell-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-timothykrell-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@timothykrell](https://twitter.com/timothykrell).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-timothykrell-process-1-600.jpg)](/assets/images/paperfaces-timothykrell-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-timothykrell-process-2-600.jpg)](/assets/images/paperfaces-timothykrell-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-timothykrell-process-3-600.jpg)](/assets/images/paperfaces-timothykrell-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-timothykrell-process-4-600.jpg)](/assets/images/paperfaces-timothykrell-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-18-bombaybellyrina-portrait.md",
    "content": "---\ntitle: \"Toss of the hair\"\nexcerpt: \"PaperFaces portrait of @BombayBellyrina drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bombaybellyrina-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bombaybellyrina-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@BombayBellyrina](https://twitter.com/BombayBellyrina).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bombaybellyrina-process-1-600.jpg)](/assets/images/paperfaces-bombaybellyrina-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bombaybellyrina-process-2-600.jpg)](/assets/images/paperfaces-bombaybellyrina-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bombaybellyrina-process-3-600.jpg)](/assets/images/paperfaces-bombaybellyrina-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bombaybellyrina-process-4-600.jpg)](/assets/images/paperfaces-bombaybellyrina-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bombaybellyrina-process-5-600.jpg)](/assets/images/paperfaces-bombaybellyrina-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-20-anne-c-portrait.md",
    "content": "---\ntitle: \"Sideways drawing\"\nexcerpt: \"PaperFaces portrait of Anne C. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-anne-c.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-anne-c-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, Sktchy]\n---\n\nPaperFaces portrait of Anne C. inspired by a photograph on Sktchy.\n\nFor this drawing I thought it would be a good exercise to strengthen my hand/eye skills by drawing it sideways. Doing so allowed me to focus on drawing shapes and lines instead of what my brain *thought* it was seeing.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-anne-c-process-1-600.jpg)](/assets/images/paperfaces-anne-c-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-anne-c-process-2-600.jpg)](/assets/images/paperfaces-anne-c-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-anne-c-process-3-600.jpg)](/assets/images/paperfaces-anne-c-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-anne-c-process-4-600.jpg)](/assets/images/paperfaces-anne-c-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-20-matt-davey-portrait.md",
    "content": "---\ntitle: \"Glasses cast shadows\"\nexcerpt: \"PaperFaces portrait of Matt Davey drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-matt-davey.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-matt-davey-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of Matt Davey.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-matt-davey-process-1-600.jpg)](/assets/images/paperfaces-matt-davey-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-matt-davey-process-2-600.jpg)](/assets/images/paperfaces-matt-davey-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-matt-davey-process-3-600.jpg)](/assets/images/paperfaces-matt-davey-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-matt-davey-process-4-600.jpg)](/assets/images/paperfaces-matt-davey-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-23-chloe-winter-portrait.md",
    "content": "---\ntitle: \"Chloe, 22 months\"\nexcerpt: \"PaperFaces portrait of my daughter Chloe drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chloe-winter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chloe-winter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, bokeh, twins]\n---\n\nJust like [her sister]({% post_url /paperfaces/2014-06-23-everly-autumn-portrait %}), *Chlo-worm's* hair can't be tamed.\n\nThe more I draw with Paper, the clearer it becomes that I don't really have a set process. Sometimes I start with a rough outline that I continuously erase and refine. Other times I jump right to the darks and work backwards towards the light.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-chloe-winter-process-1-600.jpg)](/assets/images/paperfaces-chloe-winter-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chloe-winter-process-2-600.jpg)](/assets/images/paperfaces-chloe-winter-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chloe-winter-process-3-600.jpg)](/assets/images/paperfaces-chloe-winter-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chloe-winter-process-4-600.jpg)](/assets/images/paperfaces-chloe-winter-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chloe-winter-process-5-600.jpg)](/assets/images/paperfaces-chloe-winter-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chloe-winter-process-6-600.jpg)](/assets/images/paperfaces-chloe-winter-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-23-everly-autumn-portrait.md",
    "content": "---\ntitle: \"Everly, 22 months\"\nexcerpt: \"PaperFaces portrait of my daughter Everly drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-everly-autumn.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-everly-autumn-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, bokeh, twins]\n---\n\nTaking a little break from drawing the faces of strangers this weekend to sketch the two little ones in my life and their wild hair. First up, Everly.\n\nPS. Drawing children is friggin hard. Way too easy to turn them into demons or miniature old people if you aren't careful.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-everly-autumn-process-1-600.jpg)](/assets/images/paperfaces-everly-autumn-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-everly-autumn-process-2-600.jpg)](/assets/images/paperfaces-everly-autumn-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-everly-autumn-process-3-600.jpg)](/assets/images/paperfaces-everly-autumn-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-everly-autumn-process-4-600.jpg)](/assets/images/paperfaces-everly-autumn-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-everly-autumn-process-5-600.jpg)](/assets/images/paperfaces-everly-autumn-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-everly-autumn-process-6-600.jpg)](/assets/images/paperfaces-everly-autumn-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-everly-autumn-process-7-600.jpg)](/assets/images/paperfaces-everly-autumn-process-7-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-23-rangerrick-portrait.md",
    "content": "---\ntitle: \"Thumbs up, cool hat\"\nexcerpt: \"PaperFaces portrait of @RangerRick drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rangerrick-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rangerrick-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@RangerRick](https://twitter.com/RangerRick).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rangerrick-process-1-600.jpg)](/assets/images/paperfaces-rangerrick-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rangerrick-process-2-600.jpg)](/assets/images/paperfaces-rangerrick-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rangerrick-process-3-600.jpg)](/assets/images/paperfaces-rangerrick-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rangerrick-process-4-600.jpg)](/assets/images/paperfaces-rangerrick-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-25-jameswestnz-portrait.md",
    "content": "---\ntitle: \"Balancing act\"\nexcerpt: \"PaperFaces portrait of @jameswestnz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jameswestnz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jameswestnz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@jameswestnz](https://twitter.com/jameswestnz).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jameswestnz-process-1-600.jpg)](/assets/images/paperfaces-jameswestnz-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jameswestnz-process-2-600.jpg)](/assets/images/paperfaces-jameswestnz-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jameswestnz-process-3-600.jpg)](/assets/images/paperfaces-jameswestnz-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-25-ryan-s-portrait.md",
    "content": "---\ntitle: \"Stop staring at me\"\nexcerpt: \"PaperFaces portrait of Ryan S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ryan-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ryan-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Ryan S. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ryan-s-process-1-600.jpg)](/assets/images/paperfaces-ryan-s-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ryan-s-process-2-600.jpg)](/assets/images/paperfaces-ryan-s-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ryan-s-process-3-600.jpg)](/assets/images/paperfaces-ryan-s-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-26-david-mc-portrait.md",
    "content": "---\ntitle: \"Foliage lurking in the dark\"\nexcerpt: \"PaperFaces portrait of David McC. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-david-mc.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-david-mc-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of David McC.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-david-mc-process-1-600.jpg)](/assets/images/paperfaces-david-mc-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-david-mc-process-2-600.jpg)](/assets/images/paperfaces-david-mc-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-david-mc-process-3-600.jpg)](/assets/images/paperfaces-david-mc-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-david-mc-process-4-600.jpg)](/assets/images/paperfaces-david-mc-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-david-mc-process-5-600.jpg)](/assets/images/paperfaces-david-mc-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-27-cincinnatigal-portrait.md",
    "content": "---\ntitle: \"How much is that doggy in the window?\"\nexcerpt: \"PaperFaces portrait of @CincinnatiGal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-cincinnatigal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-cincinnatigal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@CincinnatiGal](https://twitter.com/CincinnatiGal).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-cincinnatigal-process-1-600.jpg)](/assets/images/paperfaces-cincinnatigal-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cincinnatigal-process-2-600.jpg)](/assets/images/paperfaces-cincinnatigal-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cincinnatigal-process-3-600.jpg)](/assets/images/paperfaces-cincinnatigal-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cincinnatigal-process-4-600.jpg)](/assets/images/paperfaces-cincinnatigal-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-cincinnatigal-process-5-600.jpg)](/assets/images/paperfaces-cincinnatigal-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-30-christina-u-portrait.md",
    "content": "---\ntitle: \"Cloud dancer\"\nexcerpt: \"PaperFaces portrait of Christina U. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-christina-u.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-christina-u-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Christina U. inspired by a photograph on Sktchy.\n\nI'll say this about cloudscapes, they're a million times easier to draw than portraits. I pretty much puked up some color on the canvas in five minutes and smudged it all together in another five and *presto chango*… one photo-realistic sky for your viewing pleasure.\n\nI can see why they're a popular subject for Paper creators.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-christina-u-process-1-600.jpg)](/assets/images/paperfaces-christina-u-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-2-600.jpg)](/assets/images/paperfaces-christina-u-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-3-600.jpg)](/assets/images/paperfaces-christina-u-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-4-600.jpg)](/assets/images/paperfaces-christina-u-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-5-600.jpg)](/assets/images/paperfaces-christina-u-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-6-600.jpg)](/assets/images/paperfaces-christina-u-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-7-600.jpg)](/assets/images/paperfaces-christina-u-process-7-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-8-600.jpg)](/assets/images/paperfaces-christina-u-process-8-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-9-600.jpg)](/assets/images/paperfaces-christina-u-process-9-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-10-600.jpg)](/assets/images/paperfaces-christina-u-process-10-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-christina-u-process-11-600.jpg)](/assets/images/paperfaces-christina-u-process-11-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-30-efox-angel-portrait.md",
    "content": "---\ntitle: \"Wall of light\"\nexcerpt: \"PaperFaces portrait of Efox Angel drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-efox-angel.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-efox-angel-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Christina U. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-efox-angel-process-1-600.jpg)](/assets/images/paperfaces-efox-angel-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-efox-angel-process-2-600.jpg)](/assets/images/paperfaces-efox-angel-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-efox-angel-process-3-600.jpg)](/assets/images/paperfaces-efox-angel-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-efox-angel-process-4-600.jpg)](/assets/images/paperfaces-efox-angel-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-efox-angel-process-5-600.jpg)](/assets/images/paperfaces-efox-angel-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-06-30-simonbusborg-portrait.md",
    "content": "---\ntitle: \"Hoodies and architecture\"\nexcerpt: \"PaperFaces portrait of @simonbusborg drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-simonbusborg-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-simonbusborg-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@simonbusborg](https://twitter.com/simonbusborg).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-simonbusborg-process-1-600.jpg)](/assets/images/paperfaces-simonbusborg-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-simonbusborg-process-2-600.jpg)](/assets/images/paperfaces-simonbusborg-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-simonbusborg-process-3-600.jpg)](/assets/images/paperfaces-simonbusborg-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-simonbusborg-process-4-600.jpg)](/assets/images/paperfaces-simonbusborg-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-simonbusborg-process-5-600.jpg)](/assets/images/paperfaces-simonbusborg-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-02-kristoffbertram-portrait.md",
    "content": "---\ntitle: \"White light blur\"\nexcerpt: \"PaperFaces portrait of @kristoffbertram drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-kristoffbertram-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kristoffbertram-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@kristoffbertram](https://twitter.com/kristoffbertram).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kristoffbertram-process-1-600.jpg)](/assets/images/paperfaces-kristoffbertram-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kristoffbertram-process-2-600.jpg)](/assets/images/paperfaces-kristoffbertram-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kristoffbertram-process-3-600.jpg)](/assets/images/paperfaces-kristoffbertram-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kristoffbertram-process-4-600.jpg)](/assets/images/paperfaces-kristoffbertram-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-kristoffbertram-process-5-600.jpg)](/assets/images/paperfaces-kristoffbertram-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-02-yakndara-b-portrait.md",
    "content": "---\ntitle: \"Heard you like eyes\"\nexcerpt: \"PaperFaces portrait of Yakndara B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-yakndara-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-yakndara-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Yakndara B. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-yakndara-b-process-1-600.jpg)](/assets/images/paperfaces-yakndara-b-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yakndara-b-process-2-600.jpg)](/assets/images/paperfaces-yakndara-b-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yakndara-b-process-3-600.jpg)](/assets/images/paperfaces-yakndara-b-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yakndara-b-process-4-600.jpg)](/assets/images/paperfaces-yakndara-b-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yakndara-b-process-5-600.jpg)](/assets/images/paperfaces-yakndara-b-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yakndara-b-process-6-600.jpg)](/assets/images/paperfaces-yakndara-b-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-05-juan-d-portrait.md",
    "content": "---\ntitle: \"A classic pose\"\nexcerpt: \"PaperFaces portrait of Juan D. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-juan-d.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-juan-d-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Juan D. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-juan-d-process-1-600.jpg)](/assets/images/paperfaces-juan-d-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-juan-d-process-2-600.jpg)](/assets/images/paperfaces-juan-d-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-juan-d-process-3-600.jpg)](/assets/images/paperfaces-juan-d-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-juan-d-process-4-600.jpg)](/assets/images/paperfaces-juan-d-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-05-lascorbe-portrait.md",
    "content": "---\ntitle: \"Sharks have fins\"\nexcerpt: \"PaperFaces portrait of @Lascorbe drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lascorbe-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lascorbe-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Lascorbe](https://twitter.com/Lascorbe).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lascorbe-process-1-600.jpg)](/assets/images/paperfaces-lascorbe-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lascorbe-process-2-600.jpg)](/assets/images/paperfaces-lascorbe-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lascorbe-process-3-600.jpg)](/assets/images/paperfaces-lascorbe-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lascorbe-process-4-600.jpg)](/assets/images/paperfaces-lascorbe-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lascorbe-process-5-600.jpg)](/assets/images/paperfaces-lascorbe-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lascorbe-process-6-600.jpg)](/assets/images/paperfaces-lascorbe-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-juan-d-process-4-600.jpg)](/assets/images/paperfaces-juan-d-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-05-makenna-s-portrait.md",
    "content": "---\ntitle: \"Rosey cheeks, green shadows\"\nexcerpt: \"PaperFaces portrait of Makenna S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-makenna-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-makenna-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Makenna S. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-makenna-s-process-1-600.jpg)](/assets/images/paperfaces-makenna-s-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-makenna-s-process-2-600.jpg)](/assets/images/paperfaces-makenna-s-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-makenna-s-process-3-600.jpg)](/assets/images/paperfaces-makenna-s-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-makenna-s-process-4-600.jpg)](/assets/images/paperfaces-makenna-s-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-makenna-s-process-5-600.jpg)](/assets/images/paperfaces-makenna-s-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-05-toph-portrait.md",
    "content": "---\ntitle: \"Off camera glance\"\nexcerpt: \"PaperFaces portrait of @toph drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-toph-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-toph-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@toph](https://twitter.com/toph).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-toph-process-1-600.jpg)](/assets/images/paperfaces-toph-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-toph-process-2-600.jpg)](/assets/images/paperfaces-toph-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-toph-process-3-600.jpg)](/assets/images/paperfaces-toph-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-10-ifleiv-portrait.md",
    "content": "---\ntitle: \"Get to the choppah\"\nexcerpt: \"PaperFaces portrait of @ifleiv drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ifleiv-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ifleiv-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ifleiv](https://twitter.com/ifleiv).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ifleiv-process-1-600.jpg)](/assets/images/paperfaces-ifleiv-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ifleiv-process-2-600.jpg)](/assets/images/paperfaces-ifleiv-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ifleiv-process-3-600.jpg)](/assets/images/paperfaces-ifleiv-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ifleiv-process-4-600.jpg)](/assets/images/paperfaces-ifleiv-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-10-lassebaagoe-portrait.md",
    "content": "---\ntitle: \"Four lights\"\nexcerpt: \"PaperFaces portrait of @lassebaagoe drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lassebaagoe-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lassebaagoe-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@lassebaagoe](https://twitter.com/lassebaagoe).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lassebaagoe-process-1-600.jpg)](/assets/images/paperfaces-lassebaagoe-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lassebaagoe-process-2-600.jpg)](/assets/images/paperfaces-lassebaagoe-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lassebaagoe-process-3-600.jpg)](/assets/images/paperfaces-lassebaagoe-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lassebaagoe-process-4-600.jpg)](/assets/images/paperfaces-lassebaagoe-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-10-riddl-portrait.md",
    "content": "---\ntitle: \"Riddle me this\"\nexcerpt: \"PaperFaces portrait of @riddl drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-riddl-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-riddl-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@riddl](https://twitter.com/riddl).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-riddl-process-1-600.jpg)](/assets/images/paperfaces-riddl-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-riddl-process-2-600.jpg)](/assets/images/paperfaces-riddl-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-riddl-process-3-600.jpg)](/assets/images/paperfaces-riddl-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-10-vlad-s-portrait.md",
    "content": "---\ntitle: \"The darkness\"\nexcerpt: \"PaperFaces portrait of Vlad S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vlad-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vlad-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Vlad S. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-vlad-s-process-1-600.jpg)](/assets/images/paperfaces-vlad-s-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vlad-s-process-2-600.jpg)](/assets/images/paperfaces-vlad-s-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vlad-s-process-3-600.jpg)](/assets/images/paperfaces-vlad-s-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vlad-s-process-4-600.jpg)](/assets/images/paperfaces-vlad-s-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vlad-s-process-5-600.jpg)](/assets/images/paperfaces-vlad-s-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-12-gusso-portrait.md",
    "content": "---\ntitle: \"Red stripe\"\nexcerpt: \"PaperFaces portrait of @gusso drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gusso-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gusso-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@gusso](https://twitter.com/gusso).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-gusso-process-1-600.jpg)](/assets/images/paperfaces-gusso-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gusso-process-2-600.jpg)](/assets/images/paperfaces-gusso-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gusso-process-3-600.jpg)](/assets/images/paperfaces-gusso-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-12-twnsndco-portrait.md",
    "content": "---\ntitle: \"White ringed eyes\"\nexcerpt: \"PaperFaces portrait of @twnsndco drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-twnsndco-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-twnsndco-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh]\n---\n\nPaperFaces portrait of [@twnsndco](https://twitter.com/twnsndco).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-twnsndco-process-1-600.jpg)](/assets/images/paperfaces-twnsndco-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-twnsndco-process-2-600.jpg)](/assets/images/paperfaces-twnsndco-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-twnsndco-process-3-600.jpg)](/assets/images/paperfaces-twnsndco-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-twnsndco-process-4-600.jpg)](/assets/images/paperfaces-twnsndco-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-12-weheartgames-portrait.md",
    "content": "---\ntitle: \"Smiley beard\"\nexcerpt: \"PaperFaces portrait of @weheartgames drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-weheartgames-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-weheartgames-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh, beard]\n---\n\nPaperFaces portrait of [@weheartgames](https://twitter.com/weheartgames).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-weheartgames-process-1-600.jpg)](/assets/images/paperfaces-weheartgames-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-weheartgames-process-2-600.jpg)](/assets/images/paperfaces-weheartgames-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-weheartgames-process-3-600.jpg)](/assets/images/paperfaces-weheartgames-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-weheartgames-process-4-600.jpg)](/assets/images/paperfaces-weheartgames-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-weheartgames-process-5-600.jpg)](/assets/images/paperfaces-weheartgames-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-20-andrewjclark-portrait.md",
    "content": "---\ntitle: \"Earbud buds\"\nexcerpt: \"PaperFaces portrait of @andrewjclark drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andrewjclark-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andrewjclark-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@andrewjclark](https://twitter.com/andrewjclark).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-andrewjclark-process-1-600.jpg)](/assets/images/paperfaces-andrewjclark-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-andrewjclark-process-2-600.jpg)](/assets/images/paperfaces-andrewjclark-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-andrewjclark-process-3-600.jpg)](/assets/images/paperfaces-andrewjclark-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-andrewjclark-process-4-600.jpg)](/assets/images/paperfaces-andrewjclark-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-20-claytonfarr-portrait.md",
    "content": "---\ntitle: \"Smile directed at 270 degrees\"\nexcerpt: \"PaperFaces portrait of @ClaytonFarr drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-claytonfarr-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-claytonfarr-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@ClaytonFarr](https://twitter.com/claytonfarr).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-claytonfarr-process-1-600.jpg)](/assets/images/paperfaces-claytonfarr-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-claytonfarr-process-2-600.jpg)](/assets/images/paperfaces-claytonfarr-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-claytonfarr-process-3-600.jpg)](/assets/images/paperfaces-claytonfarr-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-claytonfarr-process-4-600.jpg)](/assets/images/paperfaces-claytonfarr-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-claytonfarr-process-5-600.jpg)](/assets/images/paperfaces-claytonfarr-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-20-jongretar-portrait.md",
    "content": "---\ntitle: \"Orange and blue beart\"\nexcerpt: \"PaperFaces portrait of @JonGretar drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jongretar-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jongretar-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@JonGretar](https://twitter.com/jongretar).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jongretar-process-1-600.jpg)](/assets/images/paperfaces-jongretar-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jongretar-process-2-600.jpg)](/assets/images/paperfaces-jongretar-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jongretar-process-3-600.jpg)](/assets/images/paperfaces-jongretar-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-20-mluker-portrait.md",
    "content": "---\ntitle: \"Pixelated glasses\"\nexcerpt: \"PaperFaces portrait of @mluker drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mluker-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mluker-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@mluker](https://twitter.com/mluker).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mluker-process-1-600.jpg)](/assets/images/paperfaces-mluker-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mluker-process-2-600.jpg)](/assets/images/paperfaces-mluker-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mluker-process-3-600.jpg)](/assets/images/paperfaces-mluker-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mluker-process-4-600.jpg)](/assets/images/paperfaces-mluker-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-20-sj-selina-portrait.md",
    "content": "---\ntitle: \"Ripped jeans\"\nexcerpt: \"PaperFaces portrait of @SJ_Selina drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sj-selina-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sj-selina-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait commission of [@SJ_Selina](https://twitter.com/SJ_Selina).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sj-selina-process-1-600.jpg)](/assets/images/paperfaces-sj-selina-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sj-selina-process-2-600.jpg)](/assets/images/paperfaces-sj-selina-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sj-selina-process-3-600.jpg)](/assets/images/paperfaces-sj-selina-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sj-selina-process-4-600.jpg)](/assets/images/paperfaces-sj-selina-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-20-smroux-portrait.md",
    "content": "---\ntitle: \"Mountain Posing\"\nexcerpt: \"PaperFaces portrait of @smroux drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-smroux-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-smroux-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@smroux](https://twitter.com/smroux).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-smroux-process-1-600.jpg)](/assets/images/paperfaces-smroux-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-smroux-process-2-600.jpg)](/assets/images/paperfaces-smroux-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-smroux-process-3-600.jpg)](/assets/images/paperfaces-smroux-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-21-honey-b-portrait.md",
    "content": "---\ntitle: \"Chalk Lines\"\nexcerpt: \"PaperFaces portrait of Honey B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-honey-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-honey-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Honey B. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-honey-b-process-1-600.jpg)](/assets/images/paperfaces-honey-b-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-honey-b-process-2-600.jpg)](/assets/images/paperfaces-honey-b-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-honey-b-process-3-600.jpg)](/assets/images/paperfaces-honey-b-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-honey-b-process-4-600.jpg)](/assets/images/paperfaces-honey-b-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-honey-b-process-5-600.jpg)](/assets/images/paperfaces-honey-b-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-22-claudioguglieri-portrait.md",
    "content": "---\ntitle: \"Black tie on white\"\nexcerpt: \"PaperFaces portrait of @claudioguglieri drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-claudioguglieri-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-claudioguglieri-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@claudioguglieri](https://twitter.com/claudioguglieri).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-claudioguglieri-process-1-600.jpg)](/assets/images/paperfaces-claudioguglieri-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-claudioguglieri-process-2-600.jpg)](/assets/images/paperfaces-claudioguglieri-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-claudioguglieri-process-3-600.jpg)](/assets/images/paperfaces-claudioguglieri-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-22-sschuermann-portrait.md",
    "content": "---\ntitle: \"What Do You See?\"\nexcerpt: \"PaperFaces portrait of @sschuermann drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sschuermann-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sschuermann-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@sschuermann](https://twitter.com/sschuermann).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sschuermann-process-1-600.jpg)](/assets/images/paperfaces-sschuermann-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sschuermann-process-2-600.jpg)](/assets/images/paperfaces-sschuermann-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sschuermann-process-3-600.jpg)](/assets/images/paperfaces-sschuermann-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sschuermann-process-4-600.jpg)](/assets/images/paperfaces-sschuermann-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-24-craiginwales-portrait.md",
    "content": "---\ntitle: \"White Rooms Always\"\nexcerpt: \"PaperFaces portrait of @craiginwales drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-craiginwales-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-craiginwales-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@craiginwales](https://twitter.com/craiginwales).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-craiginwales-process-1-600.jpg)](/assets/images/paperfaces-craiginwales-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-craiginwales-process-2-600.jpg)](/assets/images/paperfaces-craiginwales-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-craiginwales-process-3-600.jpg)](/assets/images/paperfaces-craiginwales-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-craiginwales-process-4-600.jpg)](/assets/images/paperfaces-craiginwales-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-craiginwales-process-5-600.jpg)](/assets/images/paperfaces-craiginwales-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-24-trollhunden-portrait.md",
    "content": "---\ntitle: \"Hint of a Bird’s Wing\"\nexcerpt: \"PaperFaces portrait of @Trollhunden drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-trollhunden-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-trollhunden-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@Trollhunden](https://twitter.com/trollhunden).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-trollhunden-process-1-600.jpg)](/assets/images/paperfaces-trollhunden-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-trollhunden-process-2-600.jpg)](/assets/images/paperfaces-trollhunden-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-trollhunden-process-3-600.jpg)](/assets/images/paperfaces-trollhunden-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-trollhunden-process-4-600.jpg)](/assets/images/paperfaces-trollhunden-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-trollhunden-process-5-600.jpg)](/assets/images/paperfaces-trollhunden-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-28-adolvsson-portrait.md",
    "content": "---\ntitle: \"Weirdo with a Beardo\"\nexcerpt: \"PaperFaces portrait of @adolvsson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-adolvsson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-adolvsson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@adolvsson](https://twitter.com/adolvsson).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-adolvsson-process-1-600.jpg)](/assets/images/paperfaces-adolvsson-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-adolvsson-process-2-600.jpg)](/assets/images/paperfaces-adolvsson-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-adolvsson-process-3-600.jpg)](/assets/images/paperfaces-adolvsson-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-adolvsson-process-4-600.jpg)](/assets/images/paperfaces-adolvsson-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-28-gbeschbacher-portrait.md",
    "content": "---\ntitle: \"Union Jack\"\nexcerpt: \"PaperFaces portrait of @Gbeschbacher drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gbeschbacher-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gbeschbacher-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Gbeschbacher](https://twitter.com/gbeschbacher).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-gbeschbacher-process-1-600.jpg)](/assets/images/paperfaces-gbeschbacher-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gbeschbacher-process-2-600.jpg)](/assets/images/paperfaces-gbeschbacher-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gbeschbacher-process-3-600.jpg)](/assets/images/paperfaces-gbeschbacher-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gbeschbacher-process-4-600.jpg)](/assets/images/paperfaces-gbeschbacher-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gbeschbacher-process-5-600.jpg)](/assets/images/paperfaces-gbeschbacher-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-28-tomasmalmsten-portrait.md",
    "content": "---\ntitle: \"Hats Up Glamour Shot\"\nexcerpt: \"PaperFaces portrait of @tomasmalmsten drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-tomasmalmsten-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-tomasmalmsten-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@tomasmalmsten](https://twitter.com/tomasmalmsten).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-tomasmalmsten-process-1-600.jpg)](/assets/images/paperfaces-tomasmalmsten-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tomasmalmsten-process-2-600.jpg)](/assets/images/paperfaces-tomasmalmsten-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-tomasmalmsten-process-3-600.jpg)](/assets/images/paperfaces-tomasmalmsten-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-28-und-o-portrait.md",
    "content": "---\ntitle: \"Architecture in Gray\"\nexcerpt: \"PaperFaces portrait of @und_O drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-und-o-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-und-o-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait commission of [@und_O](https://twitter.com/und_O).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-und-o-process-1-600.jpg)](/assets/images/paperfaces-und-o-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-und-o-process-2-600.jpg)](/assets/images/paperfaces-und-o-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-und-o-process-3-600.jpg)](/assets/images/paperfaces-und-o-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-und-o-process-4-600.jpg)](/assets/images/paperfaces-und-o-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-und-o-process-5-600.jpg)](/assets/images/paperfaces-und-o-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-30-mattabbo-portrait.md",
    "content": "---\ntitle: \"Hoodie Fight\"\nexcerpt: \"PaperFaces portrait of @MattAbbo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mattabbo-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mattabbo-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@MattAbbo](https://twitter.com/mattabbo).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\">Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mattabbo-process-1-600.jpg)](/assets/images/paperfaces-mattabbo-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mattabbo-process-2-600.jpg)](/assets/images/paperfaces-mattabbo-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mattabbo-process-3-600.jpg)](/assets/images/paperfaces-mattabbo-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mattabbo-process-4-600.jpg)](/assets/images/paperfaces-mattabbo-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mattabbo-process-5-600.jpg)](/assets/images/paperfaces-mattabbo-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mattabbo-process-6-600.jpg)](/assets/images/paperfaces-mattabbo-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-07-30-mosiejczuk-portrait.md",
    "content": "---\ntitle: \"Faking Bokehs Again\"\nexcerpt: \"PaperFaces portrait of @mosiejczuk drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mosiejczuk-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mosiejczuk-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, bokeh, black and white]\n---\n\nPaperFaces portrait of [@mosiejczuk](https://twitter.com/mosiejczuk).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mosiejczuk-process-1-600.jpg)](/assets/images/paperfaces-mosiejczuk-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mosiejczuk-process-2-600.jpg)](/assets/images/paperfaces-mosiejczuk-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mosiejczuk-process-3-600.jpg)](/assets/images/paperfaces-mosiejczuk-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-01-chetyeary-2-portrait.md",
    "content": "---\ntitle: \"This Shirt Has a Lot of Lines\"\nexcerpt: \"PaperFaces portrait of @chetyeary drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chetyeary-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chetyeary-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait commission of [@chetyeary](https://twitter.com/chetyeary).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-chetyeary-2-process-1-600.jpg)](/assets/images/paperfaces-chetyeary-2-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chetyeary-2-process-2-600.jpg)](/assets/images/paperfaces-chetyeary-2-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chetyeary-2-process-3-600.jpg)](/assets/images/paperfaces-chetyeary-2-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chetyeary-2-process-4-600.jpg)](/assets/images/paperfaces-chetyeary-2-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chetyeary-2-process-5-600.jpg)](/assets/images/paperfaces-chetyeary-2-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-01-ipatrycjar-portrait.md",
    "content": "---\ntitle: \"Very Painterly\"\nexcerpt: \"PaperFaces portrait of @iPatrycjaR drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-ipatrycjar-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ipatrycjar-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@iPatrycjaR](https://twitter.com/ipatrycjar).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ipatrycjar-process-1-600.jpg)](/assets/images/paperfaces-ipatrycjar-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ipatrycjar-process-2-600.jpg)](/assets/images/paperfaces-ipatrycjar-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ipatrycjar-process-3-600.jpg)](/assets/images/paperfaces-ipatrycjar-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-ipatrycjar-process-4-600.jpg)](/assets/images/paperfaces-ipatrycjar-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-03-rosebuds-2-portrait.md",
    "content": "---\ntitle: \"The Twins Turn Two\"\nexcerpt: \"PaperFaces portrait of the two little rosebuds drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-rosebuds-2.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rosebuds-2-150.jpg\ngallery:\n  - url: /assets/images/paperfaces-rosebuds-2-process-1-lg.jpg\n    image_path: /assets/images/paperfaces-rosebuds-2-process-1-600.jpg\n    alt: \"work in process screenshot\"\n  - url: /assets/images/paperfaces-rosebuds-2-process-2-lg.jpg\n    image_path: /assets/images/paperfaces-rosebuds-2-process-2-600.jpg\n    alt: \"work in process screenshot\"\n  - url: /assets/images/paperfaces-rosebuds-2-process-3-lg.jpg\n    image_path: /assets/images/paperfaces-rosebuds-2-process-3-600.jpg\n    alt: \"work in process screenshot\"\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, twins]\nlast_modified_at: 2016-09-29T16:02:37-04:00\n---\n\nA PaperFaces drawing of the my two little girls Everly and Chloe on their second birthday.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-04-fynlay-p-portrait.md",
    "content": "---\ntitle: \"Half and Half\"\nexcerpt: \"PaperFaces portrait of Fynlay P. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-fynlay-p.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-fynlay-p-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Fynlay P. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-fynlay-p-process-1-600.jpg)](/assets/images/paperfaces-fynlay-p-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fynlay-p-process-2-600.jpg)](/assets/images/paperfaces-fynlay-p-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fynlay-p-process-3-600.jpg)](/assets/images/paperfaces-fynlay-p-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fynlay-p-process-4-600.jpg)](/assets/images/paperfaces-fynlay-p-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-fynlay-p-process-5-600.jpg)](/assets/images/paperfaces-fynlay-p-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-04-maryoma-b-portrait.md",
    "content": "---\ntitle: \"Wild Hair\"\nexcerpt: \"PaperFaces portrait of Maryoma B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-maryoma-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-maryoma-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Maryoma B. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-maryoma-b-process-1-600.jpg)](/assets/images/paperfaces-maryoma-b-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-maryoma-b-process-2-600.jpg)](/assets/images/paperfaces-maryoma-b-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-maryoma-b-process-3-600.jpg)](/assets/images/paperfaces-maryoma-b-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-maryoma-b-process-4-600.jpg)](/assets/images/paperfaces-maryoma-b-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-maryoma-b-process-5-600.jpg)](/assets/images/paperfaces-maryoma-b-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-maryoma-b-process-6-600.jpg)](/assets/images/paperfaces-maryoma-b-process-6-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-06-andrew-eick-portrait.md",
    "content": "---\ntitle: \"Fuzzy Sweater\"\nexcerpt: \"PaperFaces portrait of Andrew E. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-andrew-eick-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-andrew-eick-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of Andrew E.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-andrew-eick-process-1-600.jpg)](/assets/images/paperfaces-andrew-eick-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-andrew-eick-process-2-600.jpg)](/assets/images/paperfaces-andrew-eick-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-andrew-eick-process-3-600.jpg)](/assets/images/paperfaces-andrew-eick-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-andrew-eick-process-4-600.jpg)](/assets/images/paperfaces-andrew-eick-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-06-diego-s-portrait.md",
    "content": "---\ntitle: \"This Dog Stole My Hat\"\nexcerpt: \"PaperFaces portrait of Diego S. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-diego-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-diego-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Diego S. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-diego-s-process-1-600.jpg)](/assets/images/paperfaces-diego-s-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-diego-s-process-2-600.jpg)](/assets/images/paperfaces-diego-s-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-diego-s-process-3-600.jpg)](/assets/images/paperfaces-diego-s-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-diego-s-process-4-600.jpg)](/assets/images/paperfaces-diego-s-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-06-livetosail42-portrait.md",
    "content": "---\ntitle: \"Isn’t Easy Being Green\"\nexcerpt: \"PaperFaces portrait of @livetosail42 drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-livetosail42-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-livetosail42-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@livetosail42](https://twitter.com/livetosail42).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-livetosail42-process-1-600.jpg)](/assets/images/paperfaces-livetosail42-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-livetosail42-process-2-600.jpg)](/assets/images/paperfaces-livetosail42-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-livetosail42-process-3-600.jpg)](/assets/images/paperfaces-livetosail42-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-10-farbenprinz-portrait.md",
    "content": "---\ntitle: \"Watercolor Shades\"\nexcerpt: \"PaperFaces portrait of @Farbenprinz drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-farbenprinz-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-farbenprinz-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@Farbenprinz](https://twitter.com/farbenprinz).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-farbenprinz-process-1-600.jpg)](/assets/images/paperfaces-farbenprinz-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-farbenprinz-process-2-600.jpg)](/assets/images/paperfaces-farbenprinz-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-farbenprinz-process-3-600.jpg)](/assets/images/paperfaces-farbenprinz-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-farbenprinz-process-4-600.jpg)](/assets/images/paperfaces-farbenprinz-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-farbenprinz-process-5-600.jpg)](/assets/images/paperfaces-farbenprinz-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-10-gharpreet-portrait.md",
    "content": "---\ntitle: \"Bright Yellow\"\nexcerpt: \"PaperFaces portrait of @GHarpreet drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-gharpreet-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-gharpreet-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard]\n---\n\nPaperFaces portrait of [@GHarpreet](https://twitter.com/gharpreet).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-gharpreet-process-1-600.jpg)](/assets/images/paperfaces-gharpreet-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gharpreet-process-2-600.jpg)](/assets/images/paperfaces-gharpreet-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gharpreet-process-3-600.jpg)](/assets/images/paperfaces-gharpreet-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-gharpreet-process-4-600.jpg)](/assets/images/paperfaces-gharpreet-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-10-girl-cat-portrait.md",
    "content": "---\ntitle: \"Girl and Cat\"\nexcerpt: \"PaperFaces portrait of a girl and cat drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-girl-cat.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-girl-cat-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of a girl and cat.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-girl-cat-process-1-600.jpg)](/assets/images/paperfaces-girl-cat-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-girl-cat-process-2-600.jpg)](/assets/images/paperfaces-girl-cat-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-girl-cat-process-3-600.jpg)](/assets/images/paperfaces-girl-cat-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-10-sonja-b-portrait.md",
    "content": "---\ntitle: \"Blue is the Warmest Color\"\nexcerpt: \"PaperFaces portrait of Sonja B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-sonja-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sonja-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Sonja B. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sonja-b-process-1-600.jpg)](/assets/images/paperfaces-sonja-b-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sonja-b-process-2-600.jpg)](/assets/images/paperfaces-sonja-b-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sonja-b-process-3-600.jpg)](/assets/images/paperfaces-sonja-b-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sonja-b-process-4-600.jpg)](/assets/images/paperfaces-sonja-b-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-sonja-b-process-5-600.jpg)](/assets/images/paperfaces-sonja-b-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-14-charlotte-h-portrait.md",
    "content": "---\ntitle: \"Chalkboard Words\"\nexcerpt: \"PaperFaces portrait of the Charlotte H. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-charlotte-h.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-charlotte-h-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Charlotte H. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-charlotte-h-process-1-600.jpg)](/assets/images/paperfaces-charlotte-h-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-charlotte-h-process-2-600.jpg)](/assets/images/paperfaces-charlotte-h-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-charlotte-h-process-3-600.jpg)](/assets/images/paperfaces-charlotte-h-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-charlotte-h-process-4-600.jpg)](/assets/images/paperfaces-charlotte-h-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-14-east-docht-portrait.md",
    "content": "---\ntitle: \"Ska Killer\"\nexcerpt: \"PaperFaces portrait of the East Docht drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-east-docht.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-east-docht-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of East Docht inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-east-docht-process-1-600.jpg)](/assets/images/paperfaces-east-docht-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-east-docht-process-2-600.jpg)](/assets/images/paperfaces-east-docht-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-14-littlest-avenger-portrait.md",
    "content": "---\ntitle: \"The Littlest Avenger\"\nexcerpt: \"PaperFaces portrait of the littlest Avenger drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-littlest-avenger.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-littlest-avenger-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of the littlest Avenger inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-littlest-avenger-process-1-600.jpg)](/assets/images/paperfaces-littlest-avenger-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-littlest-avenger-process-2-600.jpg)](/assets/images/paperfaces-littlest-avenger-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-littlest-avenger-process-3-600.jpg)](/assets/images/paperfaces-littlest-avenger-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-littlest-avenger-process-4-600.jpg)](/assets/images/paperfaces-littlest-avenger-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-18-awinterghost-portrait.md",
    "content": "---\ntitle: \"A Drawing of a Ghost\"\nexcerpt: \"PaperFaces portrait of @AWinterGhost drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-awinterghost-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-awinterghost-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@AWinterGhost](https://twitter.com/AWinterGhost).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-awinterghost-process-1-600.jpg)](/assets/images/paperfaces-awinterghost-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-awinterghost-process-2-600.jpg)](/assets/images/paperfaces-awinterghost-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-awinterghost-process-3-600.jpg)](/assets/images/paperfaces-awinterghost-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-awinterghost-process-4-600.jpg)](/assets/images/paperfaces-awinterghost-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-awinterghost-process-5-600.jpg)](/assets/images/paperfaces-awinterghost-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-18-jonas-c-portrait.md",
    "content": "---\ntitle: \"Visible Pencil Strokes\"\nexcerpt: \"PaperFaces portrait of a Jonas C. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jonas-c.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jonas-c-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait commission of a Jonas C.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jonas-c-process-1-600.jpg)](/assets/images/paperfaces-jonas-c-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jonas-c-process-2-600.jpg)](/assets/images/paperfaces-jonas-c-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jonas-c-process-3-600.jpg)](/assets/images/paperfaces-jonas-c-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jonas-c-process-4-600.jpg)](/assets/images/paperfaces-jonas-c-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jonas-c-process-5-600.jpg)](/assets/images/paperfaces-jonas-c-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-18-modemlooper-portrait.md",
    "content": "---\ntitle: \"Data is Such a Card\"\nexcerpt: \"PaperFaces portrait of @modemlooper drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-modemlooper-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-modemlooper-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@modemlooper](https://twitter.com/modemlooper).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-modemlooper-process-1-600.jpg)](/assets/images/paperfaces-modemlooper-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-modemlooper-process-2-600.jpg)](/assets/images/paperfaces-modemlooper-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-modemlooper-process-3-600.jpg)](/assets/images/paperfaces-modemlooper-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-modemlooper-process-4-600.jpg)](/assets/images/paperfaces-modemlooper-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-18-pete-himself-portrait.md",
    "content": "---\ntitle: \"By Himself\"\nexcerpt: \"PaperFaces portrait of @pete_himself drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-pete-himself-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-pete-himself-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@pete_himself](https://twitter.com/pete_himself).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-pete-himself-process-1-600.jpg)](/assets/images/paperfaces-pete-himself-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-pete-himself-process-2-600.jpg)](/assets/images/paperfaces-pete-himself-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-pete-himself-process-3-600.jpg)](/assets/images/paperfaces-pete-himself-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-pete-himself-process-4-600.jpg)](/assets/images/paperfaces-pete-himself-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-21-hroxby-portrait.md",
    "content": "---\ntitle: \"Soft and Light\"\nexcerpt: \"PaperFaces portrait of @HRoxby drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-hroxby-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hroxby-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait of [@HRoxby](https://twitter.com/HRoxby).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-hroxby-process-1-600.jpg)](/assets/images/paperfaces-hroxby-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-hroxby-process-2-600.jpg)](/assets/images/paperfaces-hroxby-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-hroxby-process-3-600.jpg)](/assets/images/paperfaces-hroxby-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-hroxby-process-4-600.jpg)](/assets/images/paperfaces-hroxby-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-hroxby-process-5-600.jpg)](/assets/images/paperfaces-hroxby-process-5-lg.jpg)aperfaces-pete-himself-process-4-600.jpg\" alt=\"Work in process screenshot\">\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-21-mandy-b-portrait.md",
    "content": "---\ntitle: \"Vampires that Sparkle\"\nexcerpt: \"PaperFaces portrait of the Mandy B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-mandy-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mandy-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, Sktchy]\n---\n\nPaperFaces portrait of Mandy B. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mandy-b-process-1-600.jpg)](/assets/images/paperfaces-mandy-b-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mandy-b-process-2-600.jpg)](/assets/images/paperfaces-mandy-b-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mandy-b-process-3-600.jpg)](/assets/images/paperfaces-mandy-b-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mandy-b-process-4-600.jpg)](/assets/images/paperfaces-mandy-b-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mandy-b-process-5-600.jpg)](/assets/images/paperfaces-mandy-b-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-21-yorgle-portrait.md",
    "content": "---\ntitle: \"Lego Man\"\nexcerpt: \"PaperFaces portrait of @yorgle drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-yorgle-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-yorgle-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@yorgle](https://twitter.com/yorgle).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-yorgle-process-1-600.jpg)](/assets/images/paperfaces-yorgle-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yorgle-process-2-600.jpg)](/assets/images/paperfaces-yorgle-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yorgle-process-3-600.jpg)](/assets/images/paperfaces-yorgle-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-yorgle-process-4-600.jpg)](/assets/images/paperfaces-yorgle-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-25-bargenson-portrait.md",
    "content": "---\ntitle: \"Wind Blown Guile Hair\"\nexcerpt: \"PaperFaces portrait of @bargenson drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-bargenson-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-bargenson-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@bargenson](https://twitter.com/bargenson).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-bargenson-process-1-600.jpg)](/assets/images/paperfaces-bargenson-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bargenson-process-2-600.jpg)](/assets/images/paperfaces-bargenson-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bargenson-process-3-600.jpg)](/assets/images/paperfaces-bargenson-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bargenson-process-4-600.jpg)](/assets/images/paperfaces-bargenson-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-bargenson-process-4-600.jpg)](/assets/images/paperfaces-bargenson-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-25-chrissy-jo-portrait.md",
    "content": "---\ntitle: \"Lid Flip\"\nexcerpt: \"PaperFaces portrait of the Chrissy Jo drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-chrissy-jo.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-chrissy-jo-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nChrissy does [fantastic illustrations](http://chrissyjo.com/ ) and after she drew a [pretty rad portrait](https://sktchy.com/aLFwUD) of yours truly I decided to return the favor.\n\nPaperFaces portrait of Chrissy Jo inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-chrissy-jo-process-1-600.jpg)](/assets/images/paperfaces-chrissy-jo-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chrissy-jo-process-2-600.jpg)](/assets/images/paperfaces-chrissy-jo-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chrissy-jo-process-3-600.jpg)](/assets/images/paperfaces-chrissy-jo-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chrissy-jo-process-4-600.jpg)](/assets/images/paperfaces-chrissy-jo-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-chrissy-jo-process-5-600.jpg)](/assets/images/paperfaces-chrissy-jo-process-5-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-25-jmcquarrie-portrait.md",
    "content": "---\ntitle: \"Fine Line Glasses\"\nexcerpt: \"PaperFaces portrait of @jmcquarrie drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jmcquarrie-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jmcquarrie-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, beard]\n---\n\nPaperFaces portrait of [@jmcquarrie](https://twitter.com/jmcquarrie).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jmcquarrie-process-1-600.jpg)](/assets/images/paperfaces-jmcquarrie-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jmcquarrie-process-2-600.jpg)](/assets/images/paperfaces-jmcquarrie-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jmcquarrie-process-3-600.jpg)](/assets/images/paperfaces-jmcquarrie-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jmcquarrie-process-4-600.jpg)](/assets/images/paperfaces-jmcquarrie-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jmcquarrie-process-4-600.jpg)](/assets/images/paperfaces-jmcquarrie-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-25-vishnugopal-portrait.md",
    "content": "---\ntitle: \"Blue Green Grin\"\nexcerpt: \"PaperFaces portrait of @vishnugopal drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-vishnugopal-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vishnugopal-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@vishnugopal](https://twitter.com/vishnugopal).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-vishnugopal-process-1-600.jpg)](/assets/images/paperfaces-vishnugopal-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vishnugopal-process-2-600.jpg)](/assets/images/paperfaces-vishnugopal-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vishnugopal-process-3-600.jpg)](/assets/images/paperfaces-vishnugopal-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vishnugopal-process-4-600.jpg)](/assets/images/paperfaces-vishnugopal-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-26-princess-e-portrait.md",
    "content": "---\ntitle: \"Faking Pencil with Pencil\"\nexcerpt: \"PaperFaces portrait of the Princess E. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-princess-e.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-princess-e-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nEach time I use Paper's pencil tool I'm impressed with how well it performs. It doesn't just make textured marks like every other drawing app, but is able to replicate the nuance of *real* colored pencils.\n\nPaperFaces portrait of Princess E. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-princess-e-process-1-600.jpg)](/assets/images/paperfaces-princess-e-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-princess-e-process-2-600.jpg)](/assets/images/paperfaces-princess-e-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-princess-e-process-3-600.jpg)](/assets/images/paperfaces-princess-e-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-princess-e-process-4-600.jpg)](/assets/images/paperfaces-princess-e-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-27-blair-z-portrait.md",
    "content": "---\ntitle: \"Still Faking Pencil with Pencil\"\nexcerpt: \"PaperFaces portrait of the Blair Z. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-blair-z.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-blair-z-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Blair Z. inspired by a photograph on Sktchy.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-blair-z-process-1-600.jpg)](/assets/images/paperfaces-blair-z-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-blair-z-process-2-600.jpg)](/assets/images/paperfaces-blair-z-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-blair-z-process-3-600.jpg)](/assets/images/paperfaces-blair-z-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-blair-z-process-4-600.jpg)](/assets/images/paperfaces-blair-z-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-blair-z-process-5-600.jpg)](/assets/images/paperfaces-blair-z.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-28-jessebc-portrait.md",
    "content": "---\ntitle: \"Groomed Beard Blur\"\nexcerpt: \"PaperFaces portrait of @jessebc drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-jessebc-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-jessebc-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, black and white]\nlast_modified_at: 2017-09-07T16:15:33-04:00\n---\n\nPaperFaces portrait of [@jessebc](https://twitter.com/jessebc).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-jessebc-process-1-600.jpg)](/assets/images/paperfaces-jessebc-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jessebc-process-2-600.jpg)](/assets/images/paperfaces-jessebc-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jessebc-process-3-600.jpg)](/assets/images/paperfaces-jessebc-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jessebc-process-4-600.jpg)](/assets/images/paperfaces-jessebc-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-jessebc-process-5-600.jpg)](/assets/images/paperfaces-jessebc-twitter.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-08-29-veganwendy-2-portrait.md",
    "content": "---\ntitle: \"Revisiting the First PaperFace\"\nexcerpt: \"PaperFaces portrait of my wife revisited after two years of drawing with Paper.\"\nimage: \n  path: &image /assets/images/paperfaces-veganwendy-2-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-veganwendy-2-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\nlast_modified_at: 2017-09-07T16:18:52-04:00\n---\n\nWell it's been exactly two years since I started the [PaperFaces Project](/paperfaces/). Thought it would be interesting to draw [my wife](https://twitter.com/veganwendy) again to see how much my skills had improved over the course of the project.\n\nIt wasn't the most difficult photograph to recreate in Paper, seeing how the face is obscured and all that. But you can certainly see a change in technique and accuracy between the two.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"What a difference two years made.\" class:\"gallery-3-col\" %}\n[![first PaperFaces portrait](/assets/images/paperfaces-veganwendy-twitter-600.jpg)](/assets/images/paperfaces-veganwendy-twitter.jpg) [![last PaperFaces portrait?](/assets/images/paperfaces-veganwendy-2-twitter-600.jpg)](/assets/images/paperfaces-veganwendy-2-twitter.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-09-02-harvydanger-portrait.md",
    "content": "---\ntitle: \"Portrait Winner Number 1\"\nexcerpt: \"PaperFaces portrait of @harvydanger drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-harvydanger-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-harvydanger-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@harvydanger](https://twitter.com/harvydanger), winner of my first [portrait giveaway]({% post_url /notes/2014-08-24-paperfaces-giveaway %}).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-09-06-psychoticmilkma-2-portrait.md",
    "content": "---\ntitle: \"I Really Enjoy Gray Part 199\"\nexcerpt: \"PaperFaces portrait for giveaway winner Jason C. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-psychoticmilkma-2.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-psychoticmilkma-2-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, bokeh]\n---\n\nPaperFaces portrait for [@psychoticmilkma](https://twitter.com/psychoticmilkma), a winner from my first [portrait giveaway]({% post_url /notes/2014-08-24-paperfaces-giveaway %}).\n\n{% include_cached boilerplate/paperfaces-4.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-09-10-viktoriaderoy-portrait.md",
    "content": "---\ntitle: \"Portrait Winner Number 3\"\nexcerpt: \"PaperFaces portrait of @ViktoriaDeRoy drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-viktoriaderoy-twitter.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-viktoriaderoy-twitter-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of [@ViktoriaDeRoy](https://twitter.com/ViktoriaDeRoy), winner of a black and white drawing from my first [portrait giveaway]({% post_url /notes/2014-08-24-paperfaces-giveaway %}).\n\n{% include_cached boilerplate/paperfaces-2.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-viktoriaderoy-process-1-600.jpg)](/assets/images/paperfaces-viktoriaderoy-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-viktoriaderoy-process-2-600.jpg)](/assets/images/paperfaces-viktoriaderoy-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-viktoriaderoy-process-3-600.jpg)](/assets/images/paperfaces-viktoriaderoy-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-09-22-beer-pretzel-portrait.md",
    "content": "---\ntitle: \"Beer and Pretzel\"\nexcerpt: \"PaperFaces portrait commission drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-beer-pretzel.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-beer-pretzel-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\nlast_modified_at: 2017-09-07T16:10:59-04:00\n---\n\nPaperFaces portrait commission that is available for [remixing on Mix](https://mix.fiftythree.com/11098-Michael-Rose/147204).\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-beer-pretzel-process-1-600.jpg)](/assets/images/paperfaces-beer-pretzel-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-beer-pretzel-process-2-600.jpg)](/assets/images/paperfaces-beer-pretzel.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-09-22-lisset-m-portrait.md",
    "content": "---\ntitle: \"A Face That Hides\"\nexcerpt: \"PaperFaces portrait of the Lisset M. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-lisset-m.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lisset-m-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2017-09-07T16:17:44-04:00\n---\n\nPaperFaces portrait of Lisset M. inspired by a photograph on Sktchy.\n\nFor this drawing I wanted to try something a little looser than my latest drawings. Of course I couldn't leave well enough alone and refined contours and shapes after \"it was finished.\"\n\nThe original drawing is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/162842) if you want a closer look or to riff on.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lisset-m-process-1-600.jpg)](/assets/images/paperfaces-lisset-m-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lisset-m-process-2-600.jpg)](/assets/images/paperfaces-lisset-m.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-10-03-clayton-b-portrait.md",
    "content": "---\ntitle: \"He Did It. No He Did It!\"\nexcerpt: \"PaperFaces portrait commission of Clayton B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-clayton-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-clayton-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white]\n---\n\nPaperFaces portrait commission of Clayton B. \n\nDrawing is available on [on Mix](https://mix.fiftythree.com/11098-Michael-Rose/300453) if you want a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen capture Made with Paper.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-clayton-b-process-1-900.jpg)](/assets/images/paperfaces-clayton-b-process-1-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-10-03-nick-b-portrait.md",
    "content": "---\ntitle: \"Landscape of the Apocalypse\"\nexcerpt: \"PaperFaces portrait commission of Nick B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nick-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nick-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of Nick B. \n\nDrawing is available on [on Mix](https://mix.fiftythree.com/11098-Michael-Rose/277409) if you want a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen capture Made with Paper.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-nick-b-process-1-900.jpg)](/assets/images/paperfaces-nick-b-process-1-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-10-16-michel-t-portrait.md",
    "content": "---\ntitle: \"White Room with Gray\"\nexcerpt: \"PaperFaces portrait commission of Michel T. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-michel-t.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-michel-t-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of Michel T. \n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-michel-t-process-1-600.jpg)](/assets/images/paperfaces-michel-t-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-michel-t-process-2-600.jpg)](/assets/images/paperfaces-michel-t-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-michel-t-process-3-600.jpg)](/assets/images/paperfaces-michel-t-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-michel-t-process-4-600.jpg)](/assets/images/paperfaces-michel-t-process-4-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-10-16-rosebuds-pumpkins-portrait.md",
    "content": "---\ntitle: \"Rosebuds in the Pumpkin Patch\"\nexcerpt: \"PaperFaces portrait of my two little rosebuds playing at the Great Pumpkin Farm.\"\nimage: \n  path: &image /assets/images/paperfaces-rosebuds-pumpkins.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rosebuds-pumpkins-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, twins]\n---\n\nLast weekend Wendy and me took the girls to the Great Pumpkin Farm for the second time this autumn.\n\nThe first visit I took a bunch of photographs with my Canon EOS XTi camera but didn't feel like lugging it around this time. So using a few snaps from my iPhone 5S I combined my favorites into a new composition and drew it in [Paper for iPad](https://www.fiftythree.com/paper).\n\nI'm really enjoying [sharing my creations on Mix]({{ site.url}}{% post_url /mastering-paper/2014-09-16-mix-with-me %}) and have been trying to include them at [various stages of completeness](https://mix.fiftythree.com/11098-Michael-Rose/418184).\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rosebuds-pumpkins-process-1-600.jpg)](/assets/images/paperfaces-rosebuds-pumpkins-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rosebuds-pumpkins-process-2-600.jpg)](/assets/images/paperfaces-rosebuds-pumpkins-process-2-lg.jpg)\n{% endfigure %}\n\nThe best part is seeing what others do with them when remixed. I know some other creators in the Paper community have had their reservations about joining Mix. Personally the thought of someone making money off of my work or an immature kid defacing my drawings doesn't concern me. That kind of comes with the territory in this connected world we now live in --- whether you're sharing on Mix or not.\n\n{% figure caption:\"A couple of fun and creative remixes.\" class:\"gallery-3-col\" %}\n[![Twins with beards remix](/assets/images/paperfaces-rosebuds-pumpkins-remix-1-600.jpg)](https://mix.fiftythree.com/423648-Josh-Carter/424227) [![Chloe with balloons remix](/assets/images/paperfaces-rosebuds-pumpkins-remix-2-600.jpg)](https://mix.fiftythree.com/41733-Yuko-Rabbit/420387) [![Chloe the slug remix](/assets/images/paperfaces-rosebuds-pumpkins-remix-4-600.jpg)](https://mix.fiftythree.com/431989-Juan-De-Salas/432123)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-10-24-remi-l-portrait.md",
    "content": "---\ntitle: \"A Beard That Hides\"\nexcerpt: \"PaperFaces portrait of the Remi L. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-remi-l.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-remi-l-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, beard]\n---\n\nPaperFaces portrait of Remi L. inspired by a [photograph on Sktchy](https://sktchy.com/wIZBLC).\n\nI started this drawing on a 3rd generation iPad with retina screen and finished it on the new iPad Air 2. The Air 2 feels so much more comfortable during long drawing sessions compared to the heavy brick that was the iPad 3.\n\nThe original drawing is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/513427) if you want a closer look or to riff off of.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-remi-l-process-1-600.jpg)](/assets/images/paperfaces-remi-l-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-remi-l-process-2-600.jpg)](/assets/images/paperfaces-remi-l-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-10-27-nick-b-2-portrait.md",
    "content": "---\ntitle: \"Winter Ready\"\nexcerpt: \"PaperFaces portrait commission of Nick B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-nick-b-2.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-nick-b-2-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait commission of Nick B. \n\nDrawing is available on [on Mix](https://mix.fiftythree.com/11098-Michael-Rose/585896) if you want a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen capture Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-nick-b-2-process-1-600.jpg)](/assets/images/paperfaces-nick-b-2-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-nick-b-2-process-2-600.jpg)](/assets/images/paperfaces-nick-b-2-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-10-30-renate-w-portrait.md",
    "content": "---\ntitle: \"Let's Get Spooky\"\nexcerpt: \"PaperFaces portrait of the Renate W. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-renate-w.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-renate-w-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Renate W. inspired by a [photograph on Sktchy](https://sktchy.com/4ml2W).\n\nPlayed with Surface Pressure and the recently updated Sketch tool in Paper tonight to create this Halloween inspired portrait. By working in reverse and applying white on black (instead of the other around) I was able to achieve a macabre feel to the piece.\n\nThe original drawing is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/659426/remixes) if you want a closer look or to riff off of.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-11-07-abby-b-portrait.md",
    "content": "---\ntitle: \"You Need a Mouth to Mumble\"\nexcerpt: \"PaperFaces portrait of the Abby B. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-abby-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-abby-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Abby B. inspired by a [photograph on Sktchy](https://sktchy.com/yCCAgH).\n\nIt's been a while since I last drew a faceless portrait, so I decided to go back to my roots with this one.\n\nThe original drawing is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/751119/remixes) if you want a closer look or to riff off of.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-11-11-danya-w-portrait.md",
    "content": "---\ntitle: \"Hooded Girl that Hides\"\nexcerpt: \"PaperFaces portrait of the Danya W. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-danya-w.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-danya-w-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Danya W. inspired by a [photograph on Sktchy](https://sktchy.com/NjZR3H).\n\nLately I've been drawn to images of figures partially obscured by shadow. I find it easier to work them into a composition that covers the entirety of Paper's digital canvas.\n\nThe original illustration is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/799752/remixes) if you want to rework it or get a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-danya-w-process-1-600.jpg)](/assets/images/paperfaces-danya-w-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-danya-w-process-2-600.jpg)](/assets/images/paperfaces-danya-w-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-12-04-killing-joke-portrait.md",
    "content": "---\ntitle: \"The Killing Joke\"\nexcerpt: \"PaperFaces portrait of the Joker from The Dark Knight drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2017-09-07T16:16:56-04:00\nimage: \n  path: &image /assets/images/paperfaces-joker.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-joker-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nWhile browsing through Mix looking for inspiration I came across a drawing shared by [赵 志欣](https://mix.fiftythree.com/122266--) of Heath Ledger from **The Dark Knight**.\n\nI gave it a star to bookmark it for later, and then during the holiday weekend I got around to enhancing it some. I started by reworking the placement and proportions of the face and hand using an image of the Joker from one of the film's posters.\n\nUsing a soft and more loose approach, I painted with white to pull out highlights from the darker background. Followed by painting blue tones over the entire canvas to mimic the colors found in the poster. As always I finished up with pencil strokes to sharpen edges and correct any paint strokes that might have bleed more than I liked.\n\nThe original illustration is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/1110713) for your remixing pleasure.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Original drawing by 赵 志欣 with my work on the right.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-joker-original-1-600.jpg)](/assets/images/paperfaces-joker-original-1.jpg) [![Work in process screenshot](/assets/images/paperfaces-joker-process-1-600.jpg)](/assets/images/paperfaces-joker-process-1-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2014-12-10-vanessa-s-portrait.md",
    "content": "---\ntitle: \"Tiger Style\"\nexcerpt: \"PaperFaces portrait of the Vanessa S. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2014-12-10T14:21:27-05:00\nimage: \n  path: &image /assets/images/paperfaces-vanessa-s.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vanessa-s-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Vanessa S. inspired by a [photograph on Sktchy](https://sktchy.com/NjZR3H).\n\nThe original illustration in various stages is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/1265535) if you want to rework it or get a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-vanessa-s-process-1-600.jpg)](/assets/images/paperfaces-vanessa-s-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-vanessa-s-process-2-600.jpg)](/assets/images/paperfaces-vanessa-s-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-01-03-dark-knight-rises-portrait.md",
    "content": "---\ntitle: \"The Dark Knight Rises\"\nexcerpt: \"PaperFaces portrait of Batman drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-dark-knight.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-dark-knight-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS]\n---\n\nPaperFaces portrait of the Dark Knight to go along with a drawing I did of the [Clown Prince]({% post_url /paperfaces/2014-12-04-killing-joke-portrait %}) a few weeks ago.\n\nThe original illustration is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/1420093) in various stages of completion if you want to rework it or get a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-dark-knight-process-1-600.jpg)](/assets/images/paperfaces-dark-knight-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-dark-knight-process-2-600.jpg)](/assets/images/paperfaces-dark-knight-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-dark-knight-process-3-600.jpg)](/assets/images/paperfaces-dark-knight-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-01-03-vanessa-j-portrait.md",
    "content": "---\ntitle: \"Pull My Lips\"\nexcerpt: \"PaperFaces portrait of the Vanessa J. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-vanessa-j.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-vanessa-j-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Vanessa J. inspired by a [photograph on Sktchy](https://sktchy.com/FxLxqH).\n\nThe original illustration is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/1420093) if you want to rework it or get a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-vanessa-j-process-1-900.jpg)](/assets/images/paperfaces-vanessa-j-process-1-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-01-07-mi-mo-portrait.md",
    "content": "---\ntitle: \"From Blue to Fuchsia\"\nexcerpt: \"PaperFaces portrait of the Mi Mo drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-mi-mo.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mi-mo-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Mi Mo inspired by a [photograph on Sktchy](https://sktchy.com/oIkdLC).\n\nThe original illustration is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/1619293) if you want to rework it or get a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-mi-mo-process-1-600.jpg)](/assets/images/paperfaces-mi-mo-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-mi-mo-process-2-600.jpg)](/assets/images/paperfaces-mi-mo-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-01-14-lindsey-m-portrait.md",
    "content": "---\ntitle: \"Drape Fold the Shoulder\"\nexcerpt: \"PaperFaces portrait of the Lindsey M. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-lindsey-m.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-lindsey-m-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Lindsey M. inspired by a [photograph on Sktchy](https://sktchy.com/Tnu9X).\n\nThe original illustration is [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/1726955) if you want to rework it or get a closer look.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-lindsey-m-process-1-600.jpg)](/assets/images/paperfaces-lindsey-m-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-lindsey-m-process-2-600.jpg)](/assets/images/paperfaces-lindsey-m-process-2-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-01-20-rachel-b-portrait.md",
    "content": "---\ntitle: \"See Right Through Me\"\nexcerpt: \"PaperFaces portrait of the Rachel B. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-rachel-b.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rachel-b-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Rachel B. inspired by a [photograph on Sktchy](https://sktchy.com/Ptkxs).\n\nKnowing when to stop and leave well enough alone is something I wrestle with every time I draw. The in-between draws tend to be more interesting than the finished piece just because all of the blanks have been filled in. Something I need to remember for next time.\n\nAs always, I've shared the original illustration [on Mix](https://mix.fiftythree.com/11098-Michael-Rose/1795397) for closer examination and remixing.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rachel-b-process-1-600.jpg)](/assets/images/paperfaces-rachel-b-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rachel-b-process-2-600.jpg)](/assets/images/paperfaces-rachel-b-process-2-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-rachel-b-process-3-600.jpg)](/assets/images/paperfaces-rachel-b-process-3-lg.jpg)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-01-26-eliza-t-portrait.md",
    "content": "---\ntitle: \"Rabbit Rabbit\"\nexcerpt: \"PaperFaces portrait of the Eliza T. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-eliza-t.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-eliza-t-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, black and white, Sktchy]\n---\n\nPaperFaces portrait of Eliza T. inspired by a [photograph on Sktchy](https://sktchy.com/FsO57C).\n\nThe more I use Paper's pencil and watercolor tools the more I want to pick up my old art supplies. Someday I suppose...\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress drawing available on Mix.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-eliza-t-process-1-900.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/1837294)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-02-02-asja-k-portrait.md",
    "content": "---\ntitle: \"Violet Moon\"\nexcerpt: \"PaperFaces portrait of the Asja K. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-asja-k.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-asja-k-150.jpg\ngallery:\n  - url: https://mix.fiftythree.com/11098-Michael-Rose/1887226\n    image_path: /assets/images/paperfaces-asja-k-process-1-600.jpg\n    alt: \"work in process screenshot\"\n  - url: https://mix.fiftythree.com/11098-Michael-Rose/1887463\n    image_path: /assets/images/paperfaces-asja-k-process-2-600.jpg\n    alt: \"work in process screenshot\"\n  - url: https://mix.fiftythree.com/11098-Michael-Rose/1896998\n    image_path: /assets/images/paperfaces-asja-k-process-3-600.jpg\n    alt: \"work in process screenshot\"\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\nlast_modified_at: 2016-09-28T21:40:33-04:00\n---\n\nPaperFaces portrait of Asja K. inspired by a [photograph on Sktchy](https://sktchy.com/d5SaaC).\n\nI will take grit and texture over polished and airbrushed any day of the week. It's these characteristics that have me preferring Paper over more feature-rich sketching apps.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-02-09-kalani-o-portrait.md",
    "content": "---\ntitle: \"Bubble Bubble\"\nexcerpt: \"PaperFaces portrait of the Kalani O. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-kalani-o.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kalani-o-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Kalani O. inspired by a [photograph on Sktchy](https://sktchy.com/IfaqVH).\n\nI often find I work fairly quick when dealing in grayscale, especially when the contrast is dialed up high. To really sell the realism in this one I spent a good deal of time drawing individual strands of hair with the pencil tool.\n\nStarted with dark grays and gradually increased the brightness until I was selectively adding wisps of pure white. A few coats of gray watercolor to smoothen out any abrupt transitions of color, and I called it a day.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress drawings available on Mix.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-kalani-o-process-1-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2075207) [![Work in process screenshot](/assets/images/paperfaces-kalani-o-process-2-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2086067)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-02-16-kapi-m-portrait.md",
    "content": "---\ntitle: \"Oh Eye Dunno\"\nexcerpt: \"PaperFaces portrait of the Kapi M. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-kapi-m.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-kapi-m-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Kapi M. inspired by a [photograph on Sktchy](https://sktchy.com/udfGaD).\n\nNow that I've removed the sense of urgency I previously felt when working on portraits, I find myself having more time to fill Paper's digital canvas. With this drawing I set my sights on an eye... har har get it?\n\nIt's [been a while since I drew one](/tag/eye/) and thought it might be fun to challenge myself and see how much detail I could knock out. The contours got away from me in a few places since I still find blending imprecise and over aggressive, but that's to be expected with a tool like Paper.\n\nOverall I'm happy with the finished results, especially when you reduced the size of the drawing --- it looks just like a photograph!\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress drawings available on Mix.\" class:\"gallery-3-col\" %}\n  <a href=\"https://mix.fiftythree.com/11098-Michael-Rose/2075207\"><img src=\"/assets/images/paperfaces-kalani-o-process-1-600.jpg\" alt=\"Work in process screenshot\"></a>\n  <a href=\"https://mix.fiftythree.com/11098-Michael-Rose/2086067\"><img src=\"/assets/images/paperfaces-kalani-o-process-2-600.jpg\" alt=\"Work in process screenshot\"></a>\n  {% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-02-23-emily-d-portrait.md",
    "content": "---\ntitle: \"Flipped Shirt\"\nexcerpt: \"PaperFaces portrait of the Emily D. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-emily-d.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-emily-d-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, time lapse]\n---\n\nPaperFaces portrait of Emily D. inspired by a [photograph on Sktchy](https://sktchy.com/XBuFq).\n\nFor the last week or so I've been experimenting with time lapse photography on my iPhone 5s. Creating time lapse videos of my Paper by FiftyThree works is nothing new for me, but recording the movement of my hands is... sort of.\n\nI've begun experimenting with [Hyperlapse](https://itunes.apple.com/us/app/hyperlapse-from-instagram/id740146917?mt=8) for iOS along with the time lapse feature that is part of iOS 8. I like how Hyperlapse lets you adjust the playback speed but since it only records up to an hour of footage I've started using the iPhone's built-in Camera app more.\n\nAfter I try out some other time lapse iOS apps I plan on sharing what I've learned. But for now here's a short video I shot, edited, and published with just an iPhone.\n\n{% figure caption:\"[Time lapse videos](https://www.youtube.com/watch?v=9RTXF6wLMjw&list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao) recorded with an iPhone 5s.\" %}\n{% youtube NShkvK72JTc %}\n{% endfigure %}\n\n{% figure caption:\"Work in progress drawings available on Mix.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-emily-d-process-1-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2256482) [![Work in process screenshot](/assets/images/paperfaces-emily-d-process-2-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2298299)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-02-24-rosebuds-blur-portrait.md",
    "content": "---\ntitle: \"Rosebuds in Blur\"\nexcerpt: \"PaperFaces portrait of the my two little rosebuds drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-rosebuds-blur.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rosebuds-blur-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, twins, time lapse, black and white, bokeh]\n---\n\nPaperFaces portrait of my twin girls Everly and Chloe (hiding in the bokeh).\n\nIn keeping with my recent \"time lapse kick,\" here's a video showing the creation of this drawing from start to finish. Instead of using the built-in time lapse feature of the iPhone's camera, I gave [**Lapse It**](http://www.lapseit.com/) by Interactive Universe a try.\n\nFound that Lapse It offers way more customization than iOS's Camera app or [Hyperlapse](https://itunes.apple.com/us/app/hyperlapse-from-instagram/id740146917?mt=8) allowing for greater control over the final render. Around a minute seems like a good length for these sorts of things since anything longer tends to get boring...\n\n{% figure caption:\"[Time lapse video](https://www.youtube.com/watch?v=9RTXF6wLMjw&list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao) recorded with an iPhone 5s.\" %}\n{% youtube 59pWYBvDtSM %}\n{% endfigure %}\n\nI've also shared an [in-process sketch](https://mix.fiftythree.com/11098-Michael-Rose/2323353) and the [finished illustration](https://mix.fiftythree.com/11098-Michael-Rose/2334429) on Mix.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-03-02-mr-spock-portrait.md",
    "content": "---\ntitle: \"Live Long and Prosper\"\nexcerpt: \"PaperFaces portrait tribute of Leonard Nimoy as Mr. Spock drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-mr-spock.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-mr-spock-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, time lapse, black and white]\n---\n\nPaperFaces portrait tribute of Leonard Nimoy as Mr. Spock.\n\nI worked on this drawing for little over 3 hours during two sittings. The best part of using [**Lapse It**](http://www.lapseit.com/) to generate time lapse videos of my work... playing them for the first time. \n\nGetting pretty close to a setup that works well for me, just need to nail down the lighting next. As anyone who's tried to photograph an iPad's screen, it can be tricky getting exposure and white balance right.\n\n{% figure caption:\"[Time lapse video](https://www.youtube.com/watch?v=qhEtbFlxfm4) recorded with an iPhone 5s and **Lapse It**.\" %}\n{% youtube qhEtbFlxfm4 %}\n{% endfigure %}\n\nI've also shared several in-process sketches and the [finished illustration](https://mix.fiftythree.com/11098-Michael-Rose/2406576) on Mix for anyone to Remix.\n\n{% include_cached boilerplate/paperfaces-5.md %}\n\n{% figure caption:\"Work in progress drawings available on Mix.\" class:\"third' %}\n[![Work in process screenshot](/assets/images/paperfaces-mr-spock-process-1-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2394700) [![Work in process screenshot](/assets/images/paperfaces-mr-spock-process-2-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2394966) [![Work in process screenshot](/assets/images/paperfaces-mr-spock-process-3-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2400718)\n{% endfigure %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-03-10-rafi-z-portrait.md",
    "content": "---\ntitle: \"The Battle Within\"\nexcerpt: \"PaperFaces portrait of the Rafi Z. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-rafi-z.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-rafi-z-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, time lapse, black and white]\n---\n\nPaperFaces portrait of Rafi Z. inspired by a [photograph on Sktchy](https://sktchy.com/WsDAeD).\n\nAnother experiment in recording my drawing process using on iPad, recorded with an iPhone 5s and the Lapse It app. Drawing was completed over three sessions totaling 3 hours and 25 minutes.\n\n{% figure caption:\"[Time lapse videos](https://www.youtube.com/watch?v=9RTXF6wLMjw&list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao) recorded with an iPhone 5s.\" %}\n{% youtube i5DUn3K60eg %}\n{% endfigure %}\n\n{% figure caption:\"Work in progress drawings available on Mix.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-rafi-z-process-1-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2359890) [![Work in process screenshot](/assets/images/paperfaces-rafi-z-process-2-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2370683)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-5.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-03-12-ally-cat-portrait.md",
    "content": "---\ntitle: \"Red vs Green\"\nexcerpt: \"PaperFaces portrait of the Ally Cat drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-ally-cat.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-ally-cat-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, time lapse]\n---\n\nPaperFaces portrait of Ally Cat inspired by a [photograph on Sktchy](https://sktchy.com/VxlSm).\n\nI tend to work in landscape mode with Paper by FiftyThree because the tools and interface appear to be more optimized for it. Since the tool tray is always situated in the same location regardless of how you hold the iPad, it can sometimes get in your way or be tricky to hide/reveal. But that's a tale for another day...\n\nThe reference photo I selected from Sktchy doesn't really work horizontally, so in the best interest of the drawing I flipped the iPad into portrait mode. Sure it won't be orientated correctly when shared to FiftyThree's Mix, but that's a small detail I'm willing to look past...\n\nContinuing on with my time lapse kick, here's another video I recorded over several drawing sessions using an iPhone 5s and the [Lapse It app](http://www.lapseit.com/). Took me around 3 hours to complete with some subtle blend action going on towards the end. Enjoy!\n\n{% figure caption:\"[Time lapse videos](https://www.youtube.com/watch?v=9RTXF6wLMjw&list=PLaLqP2ipMLc6UugVLyTwWTiFtmmZzj7ao) recorded with an iPhone 5s.\" %}\n{% youtube K2dgaV9_rCI %}\n{% endfigure %}\n\n{% figure caption:\"Work in progress drawings available on Mix.\" class:\"gallery-2-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-ally-cat-process-1-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2483829) [![Work in process screenshot](/assets/images/paperfaces-ally-cat-process-2-600.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2494030)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-5.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-03-21-shannon-v-portrait.md",
    "content": "---\ntitle: \"Driving Sunset\"\nexcerpt: \"PaperFaces portrait of the Shannon V. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-shannon-v.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-shannon-v-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy]\n---\n\nPaperFaces portrait of Shannon V. inspired by a [photograph on Sktchy](https://sktchy.com/tQUwNH).\n\nSometimes when I feel lazy I go after a silhouette. Shading goes out the window and the only thing you really need to be considered with is drawing an accurate contour. The rest is just coloring within the lines...\n\n{% figure caption:\"Work in progress drawing available on Mix.\" %}\n[![Work in process screenshot](/assets/images/paperfaces-shannon-v-process-1-900.jpg)](https://mix.fiftythree.com/11098-Michael-Rose/2575904)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-04-13-hannah-l-portrait.md",
    "content": "---\ntitle: \"White Eyes Glow Sometimes\"\nexcerpt: \"PaperFaces portrait of the Hannah L. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-hannah-l.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-hannah-l-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, time lapse]\n---\n\nPaperFaces portrait of Hannah L. inspired by a [photograph on Sktchy](https://sktchy.com/7gqmFc).\n\nDecided to give live streaming a try when I set out to draw this portrait. Wow, what a disaster of an idea that was.\n\nFirst. Finding a way to record my hands drawing while simultaneously mirroring my iPad's screen proved to be quite the challenge. Since I don't have a dedicated video camera, I had to get creative if I wanted to display two video feeds together during the live stream.\n\nUsing the iPhone 5s's as a webcam of sorts I tethered it to my iMac over a Lightning cable and used a new Quicktime[^yosemite-capture] feature to mirror its screen. Originally I tried the default Camera app but the persistent UI was distracting and the screen kept turning off after a few minutes of drawing. \n\nTo solve these issues I went with my go to time lapse app, [**Lapse It**](http://lapseit.com). It has screen dimming controls and the UI conveniently disappears while recording. Double bonus!\n\n[**Reflector**](http://www.airsquirrels.com/reflector/) was used to mirror my iPad Air's screen over AirPlay to the iMac, with [**Open Broadcaster Software**](https://obsproject.com/) taking care of stitching together both feeds and transmitting to YouTube. I was pleasantly surprised OBS didn't crash from all the goofiness I was doing to pull in video.\n\n[^yosemite-capture]: A new feature included in Mac OS X Yosemite, is the ability to [capture video and audio from an iOS device](http://9to5mac.com/2015/03/21/how-to-record-video-from-phone-to-mac/) using a Lightning cable.\n\n### Bandwidth Woes\n\nThis setup worked out pretty well apart from me having to sit in a really awkward position for over an hour. But the real pain turned out to be my ISP and the weak internet plan I was on. I quickly found out 1Mbps upload speeds are garbage for live streaming unless you want to crank the output quality way down.\n\n{% figure caption:\"I record iPad drawing time lapse videos with an iPhone 5s clipped to a [reflector holder boom stand](http://www.amazon.com/gp/product/B005XOIFNW/ref=as_li_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B005XOIFNW&linkCode=as2&tag=mademist-20&linkId=LG5MJOGKZTN62QOH) %}\n![iPad drawing time lapse setup](/assets/images/ipad-drawing-setup.jpg)\n{% endfigure %}\n\nFor [my first attempt](https://www.youtube.com/watch?v=FH2H9kHduRs) the stream was completely unwatchable and played more like a stop motion slideshow than a movie. Eventually I bumped up my plan to the next tier to double my upload bandwidth (which is still crazy slow), giving me a smooth and [hiccup free 480p stream](https://www.youtube.com/watch?v=OaLAeb7Pc90).\n\n### Paint Drying\n\nWhile a fun exercise in technical wizardry, live streaming in this way is probably more trouble than it's worth. I'm sure someone out there might find it useful to watch in real time as I create with Paper by FiftyThree, but personally I think it's super boring. At least until I can find a decent way of adding audio commentary as I draw...\n\nI suppose if the demand is there I might try this again some night when my wife isn't streaming Netflix. For now I think the sped up time lapse approach is the way to go.\n\n{% figure caption:\"[Time lapse video](https://www.youtube.com/watch?v=qhEtbFlxfm4) recorded with an iPhone 5s and **Lapse It**.\" %}\n{% youtube Qxpss8umvG4 %}\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-5.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-05-18-luke-skywalker-cave-portrait.md",
    "content": "---\ntitle: \"...I feel cold. Death.\"\nexcerpt: \"PaperFaces portrait Luke Skywalker and Darth Vader drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-luke-vader-cave.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-luke-vader-cave-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Star Wars]\ngallery:\n  - url: /assets/images/star-wars-canvaspop-1.jpg\n    image_path: /assets/images/star-wars-canvaspop-1-600.jpg\n    alt: \"CanvasPop print packaged up\"\n  - url: /assets/images/star-wars-canvaspop-2.jpg\n    image_path: /assets/images/star-wars-canvaspop-2-600.jpg\n    alt: \"50 inch CanvasPop Star Wars print\"\n  - url: /assets/images/star-wars-canvaspop-3.jpg\n    image_path: /assets/images/star-wars-canvaspop-3-600.jpg\n    alt: \"Detail shot of Luke Skywalker illustration\"\nlast_modified_at: 2016-12-16T21:30:28-05:00\n---\n\nPaperFaces portrait of Luke Skywalker and Darth Vader from *Episode V: The Empire Strikes Back*.\n\nAs I have done for the last 2 years, here's a new illustration drawn with Paper by FiftyThree in celebration of [**Star Wars Day**](http://www.starwars.com/may-the-4th). \"May the Fourth Be With You!\"\n\nTo the right are some shots of the gigantic 40\\\" framed print I received for being one of eleven winning entries in the [**FiftyThree** and **CanvasPop** design contest](http://blog.fiftythree.com/canvaspop-design-contest-winners). Don't mind the glare, photographing a dark piece of artwork behind glass wasn't easy.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n\n{% figure caption:\"Work in progress screen captures Made with Paper.\" class:\"gallery-3-col\" %}\n[![Work in process screenshot](/assets/images/paperfaces-luke-vader-cave-process-1-600.jpg)](/assets/images/paperfaces-luke-vader-cave-process-1-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-luke-vader-cave-process-3-600.jpg)](/assets/images/paperfaces-luke-vader-cave-process-3-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-luke-vader-cave-process-4-600.jpg)](/assets/images/paperfaces-luke-vader-cave-process-4-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-luke-vader-cave-process-5-600.jpg)](/assets/images/paperfaces-luke-vader-cave-process-5-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-luke-vader-cave-process-6-600.jpg)](/assets/images/paperfaces-luke-vader-cave-process-6-lg.jpg) [![Work in process screenshot](/assets/images/paperfaces-luke-vader-cave-process-7-600.jpg)](/assets/images/paperfaces-luke-vader-cave-process-7-lg.jpg)\n{% endfigure %}\n\n\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-05-18-sus-pek-portrait.md",
    "content": "---\ntitle: \"Bearded Skull of the Night\"\nexcerpt: \"PaperFaces portrait of the Sus Pek drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2015-05-18T11:33:26-05:00\nimage: \n  path: &image /assets/images/paperfaces-sus-pek.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-sus-pek-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, beard, Sktchy]\n---\n\nPaperFaces portrait of Sus Pek inspired by a [photograph on Sktchy](https://sktchy.com/ucx5rc).\n\nI'm a sucker for dramatic lit faces and have more queued up than I have time to draw. This one in particular stuck out to me while listening to **Xasthur** on repeat. The skull like visage and grit found in the original image didn't hurt either... \n\n{% figure caption:\"Work in progress drawings are [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/2963830).\" %}\n[![Work in process screenshot](/assets/images/paperfaces-sus-pek-process-1-900.jpg)](/assets/images/paperfaces-sus-pek-process-1-lg.jpg)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-05-22-becca-pj-portrait.md",
    "content": "---\ntitle: \"Broken Neck Lines\"\nexcerpt: \"PaperFaces portrait of the Becca P.J. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2016-10-10T15:18:53-04:00\nimage: \n  path: &image /assets/images/paperfaces-becca-pj.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-becca-pj-150.jpg\ngallery:\n  - url: /assets/images/paperfaces-becca-pj-process-1-lg.jpg\n    image_path: /assets/images/paperfaces-becca-pj-process-1-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-becca-pj-process-2-lg.jpg\n    image_path: /assets/images/paperfaces-becca-pj-process-2-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-becca-pj-process-3-lg.jpg\n    image_path: /assets/images/paperfaces-becca-pj-process-3-600.jpg\n    alt: \"Work in process screenshot\"\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Becca P.J. inspired by a [photograph on Sktchy](https://sktchy.com/WCFVrC).\n\nThere's something about the look of [white on dark](https://mix.fiftythree.com/11098-Michael-Rose/3471365) that I really enjoy. Perhaps it's the chalky like quality of Paper's soft lead pencil tool that appeals to me?\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-08-24-myriam-j-portrait.md",
    "content": "---\ntitle: \"Unfinished Except Nose\"\nexcerpt: \"PaperFaces portrait of Myriam J. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/paperfaces-myriam-j.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-myriam-j-150.jpg\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\n---\n\nPaperFaces portrait of Myriam J. inspired by a [photograph on Sktchy](https://sktchy.com/kMXyoD).\n\nLately I've been trying to strike a balance between unfinished and over-worked by selectively adding detail to a piece. \n\nOne thing I've found working digitally these last couple of years is it can be a challenge to capture the same *sketchy* quality of a real pencil. In some cases you have to do more work to fake it, which is probably why you find so many digital works that look over worked and airbrushed.\n\n{% figure caption:\"Work in progress drawings are [available on Mix](https://mix.fiftythree.com/11098-Michael-Rose/3671059).\" %}\n[![Work in process screenshot](/assets/images/paperfaces-myriam-j-process-1-900.jpg)](/assets/images/paperfaces-myriam-j-process-1-lg.jpg)\n{% endfigure %}\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-08-24-neon-l-portrait.md",
    "content": "---\ntitle: \"Bokeh Behind that Purple\"\nexcerpt: \"PaperFaces portrait of Neon L. drawn with Paper for iOS on an iPad.\"\nlast_modified_at: 2016-10-10T15:13:08-04:00\nimage: \n  path: &image /assets/images/paperfaces-neon-l.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-neon-l-150.jpg\ngallery:\n  - url: /assets/images/paperfaces-neon-l-process-1-lg.jpg\n    image_path: /assets/images/paperfaces-neon-l-process-1-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-neon-l-process-2-lg.jpg\n    image_path: /assets/images/paperfaces-neon-l-process-2-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-neon-l-process-3-lg.jpg\n    image_path: /assets/images/paperfaces-neon-l-process-3-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-neon-l-process-4-lg.jpg\n    image_path: /assets/images/paperfaces-neon-l-process-4-600.jpg\n    alt: \"Work in process screenshot\"\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, bokeh]\n---\n\nPaperFaces portrait of Neon L. inspired by a [photograph on Sktchy](https://sktchy.com/iYeI6c).\n\nOnce again... [faking that bokeh](https://mix.fiftythree.com/11098-Michael-Rose/3957855) with a few quick swipes of the finger.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-08-25-katelyn-m-portrait.md",
    "content": "---\ntitle: \"Unstoppable Hand\"\nexcerpt: \"PaperFaces portrait of Katelyn M. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-katelyn-m.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-katelyn-m-150.jpg\ngallery:\n  - url: /assets/images/paperfaces-katelyn-m-process-1-lg.jpg\n    image_path: /assets/images/paperfaces-katelyn-m-process-1-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-katelyn-m-process-2-lg.jpg\n    image_path: /assets/images/paperfaces-katelyn-m-process-2-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-katelyn-m-process-3-lg.jpg\n    image_path: /assets/images/paperfaces-katelyn-m-process-3-600.jpg\n    alt: \"Work in process screenshot\"\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white, bokeh]\nlast_modified_at: 2016-10-10T14:56:57-04:00\n---\n\nPaperFaces portrait of Katelyn M. inspired by a [photograph on Sktchy](https://sktchy.com/0STT5).\n\nOnce again... [depth of field tricks](https://mix.fiftythree.com/11098-Michael-Rose/4593845) with a few quick swipes of the finger.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/paperfaces/2015-09-17-brooke-t-portrait.md",
    "content": "---\ntitle: \"Hair Scarf\"\nexcerpt: \"PaperFaces portrait of Brooke T. drawn with Paper for iOS on an iPad.\"\nimage: \n  path: &image /assets/images/paperfaces-brooke-t.jpg \n  feature: *image\n  thumbnail: /assets/images/paperfaces-brooke-t-150.jpg\ngallery:\n  - url: /assets/images/paperfaces-brooke-t-process-1-lg.jpg\n    image_path: /assets/images/paperfaces-brooke-t-process-1-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-brooke-t-process-2-lg.jpg\n    image_path: /assets/images/paperfaces-brooke-t-process-2-600.jpg\n    alt: \"Work in process screenshot\"\n  - url: /assets/images/paperfaces-brooke-t-process-3-lg.jpg\n    image_path: /assets/images/paperfaces-brooke-t-process-3-600.jpg\n    alt: \"Work in process screenshot\"\ncategories: [paperfaces]\ntags: [portrait, illustration, Paper for iOS, Sktchy, black and white]\nlast_modified_at: 2016-10-10T14:51:40-04:00\n---\n\nPaperFaces portrait of Brooke T. inspired by a [photograph on Sktchy](https://sktchy.com/S3B8m).\n\nMy [first drawing](https://paper.fiftythree.com/11098-Michael-Rose/5492331) completed with version 3.0 of Paper by FiftyThree. So far really enjoying the full screen zoom just wish it had more levels of magnification.\n\n{% include_cached boilerplate/paperfaces-3.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2013-09-03-wendy-rose-portrait.md",
    "content": "---\ntitle: \"Tattoos turning to mud\"\nexcerpt: \"Portrait of Wendy Rose, digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-11-06\nimage: \n  path: &image /assets/images/wendy-rose-procreate.jpg\n  width: 2048\n  height: 1536\n  feature: *image\n  thumbnail: /assets/images/wendy-rose-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse]\n---\n\nPortrait of Wendy inspired by a portrait I [originally drew in Paper]({% post_url /paperfaces/2012-09-01-veganwendy-portrait %}) and [revisited]({% post_url /paperfaces/2014-08-29-veganwendy-2-portrait %}) several years later. Digitally painted with Procreate on a 3rd generation iPad. \n\nThis was my first attempt at using [**Procreate**](http://procreate.si/) and decided to give it a try in between working on my [PaperFaces Project](/paperfaces/).\n\nHaving used [FiftyThree's Paper app](http://www.fiftythree.com/) exclusively up until this point I was quickly overwhelmed by all of Procreate's features. The power was certainly there, but the simplicity of picking up an iPad and stylus to start a sketch wasn't.\n\nPaper's sketchbook motif resonated with me more than the approach digital painting powerhouses like Procreate were pursuing. Learning a complex and feature rich app was not something I had the time to mess with. So I abandoned Procreate with the goal of returning to it a year or two...\n\n{% figure caption:\"Time lapse video recorded within Procreate.\" %}\n{% youtube w2e0phIhGq8 %}\n{% endfigure %}\n\n#### Tools Used\n\n- [Pogo Connect Bluetooth Smart Pen](http://www.amazon.com/gp/product/B009K448L4/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=B009K448L4&linkCode=as2&tag=mademist-20)\n- [Procreate](http://procreate.si/)\n"
  },
  {
    "path": "src/_posts/procreate/2015-08-24-mr-allan-portrait.md",
    "content": "---\ntitle: \"Getting lost in the drab\"\nexcerpt: \"Portrait of Mr. Allan, digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-11-05T16:28:29-05:00\nimage: \n  path: &image /assets/images/mr-allan-procreate.jpg\n  width: 2048\n  height: 1536\n  feature: *image\n  thumbnail: /assets/images/mr-allan-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, Sktchy]\n---\n\nPortrait of Mr. Allan inspired by a [photograph on Sktchy](https://sktchy.com/OgixZC). Digitally painted with Procreate on an iPad Air 2. \n\nAfter promising myself I'd someday return to [**Procreate**](http://procreate.si/), it was the [announcement of the iPad Pro]({% post_url /articles/2015-09-25-ipad-pro %}) and Apple designed Pencil that got me back in the game. \n\nNot impressed with my early flirtations with Procreate I decided to read the entire manual[^manual] to familiarize myself with the app. Armed with a better understanding of all the tools and their possibilities I dug in, determined to make the app work for me this time.\n\n[^manual]: Available for free download in Apple's iBook store.\n\n<blockquote>\n  <p>Once I modified my workflow slightly from what worked in Paper by FiftyThree I started to enjoy the app more.</p>\n</blockquote>\n\nWhere I struggled originally was applying the right customizations to my brushes to tone down the *oil paint* feel of the default brushes. As a heavy Paper user I grew accustomed to pencil and paint strokes behaving in a certain way, and Procreate was pretty much the opposite of that. Modifying brushes to paint as glazes was a huge help, allowing me to layer up tones instead of smearing opaque color around.\n\n{% figure caption:\"Time lapse video recorded within Procreate.\" %}\n{% youtube vrqoIbu7gU0 %}\n{% endfigure %}\n\nNow if I can only figure out how to replicate the watercolor and pencil look I took for granted with Paper...\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2015-09-07-jenell-d-portrait.md",
    "content": "---\ntitle: \"Don't play with soot\"\nexcerpt: \"Portrait of Jenell D., digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-11-05T16:28:34-05:00\nimage: \n  path: &image /assets/images/jenell-d-procreate.jpg\n  width: 1536\n  height: 2048\n  feature: *image\n  thumbnail: /assets/images/jenell-d-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, Sktchy, black and white]\n---\n\nPortrait of Jenell D. inspired by a [photograph on Sktchy](https://sktchy.com/7i99Kc). Digitally painted with Procreate on an iPad Air 2. \n\nThings got a little dark in the face, but I guess that's what inexperience with digital charcoals gets you. Yup, still haven't a clue what I'm doing with this app yet...\n\n{% figure caption:\"Time lapse video recorded within Procreate.\" %}\n{% youtube A7ZlCZt9SoQ %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2015-09-14-jordan-s-portrait.md",
    "content": "---\ntitle: \"Blushing my cheeks\"\nexcerpt: \"Portrait of Jordan S., digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-11-06T10:03:00-05:00\nimage: \n  path: &image /assets/images/jordan-s-procreate.jpg\n  width: 1536\n  height: 1938\n  feature: *image\n  thumbnail: /assets/images/jordan-s-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, Sktchy]\n---\n\nPortrait of Jordan S. inspired by a [photograph on Sktchy](https://sktchy.com/BXA9OC). Digitally painted with Procreate on an iPad Air 2. \n\nNot as muddy as some of my other Procreate paintings, but it still has that *oil* feel. I'm determined to make these tools behave more like watercolor, ink, and pencil if it's the last thing I do.\n\n{% figure caption:\"Time lapse video recorded within Procreate.\" %}\n{% youtube vtlXSRvbXYg %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2015-10-28-jj-plix-portrait.md",
    "content": "---\ntitle: \"Sunny sky in your eye\"\nexcerpt: \"Portrait of Jj Plix, digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-11-05T16:27:03-05:00\nimage: \n  path: &image /assets/images/jj-plix-procreate.jpg\n  width: 1536\n  height: 2048\n  feature: *image\n  thumbnail: /assets/images/jj-plix-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, Sktchy]\n---\n\nPortrait of Jj Plix inspired by a [photograph on Sktchy](https://sktchy.com/BXA9OC). Digitally painted with Procreate on an iPad Air 2. \n\nNow we're getting somewhere. Half finished is the new finished.\n\n{% figure caption:\"Time lapse video recorded within Procreate.\" %}\n{% youtube 38nMoHaAJxQ %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2015-11-16-madison-s-portrait.md",
    "content": "---\ntitle: \"That vintage look\"\nexcerpt: \"Portrait of Madison S., digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-11-16T11:48:50-05:00\nimage: \n  path: &image /assets/images/madison-s-procreate.jpg\n  width: 3000\n  height: 4500\n  feature: *image\n  thumbnail: /assets/images/madison-s-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, Sktchy]\n---\n\nPortrait of Madison S. inspired by a [photograph on Sktchy](https://sktchy.com/clIrcc). Digitally painted with Procreate on an iPad Air 2. \n\nI still don't own an [iPad Pro or Apple Pencil]({% post_url /articles/2015-09-25-ipad-pro %}), but that's not stopping me from enjoying the newest Procreate update. I'm starting to get the hang of the app more and more, but really want to step away from the \"digital oil painting\" look. For my next portrait I'm definitely going to explore the various brushes to try and achieve the feel of watercolor and pencil.\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in 6 hours and 8 minutes.\" %}\n{% youtube ggx-gAmrKiM %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2015-11-27-t-steinheil-portrait.md",
    "content": "---\ntitle: \"Noise on the grain\"\nexcerpt: \"Portrait of T. Steinheil digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-11-27T00:00:00-05:00\nimage: \n  path: &image /assets/images/t-steinheil-procreate.jpg\n  width: 1600\n  height: 2400\n  feature: *image\n  thumbnail: /assets/images/t-steinheil-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, black and white, time lapse, Sktchy]\n---\n\nPortrait of T. Steinheil inspired by a [photograph on Sktchy](https://sktchy.com/hvnEKC). Digitally painted with Procreate on an iPad Air 2. \n\nMy confidence level with color hasn't really been high as of late, so I decided to retreat to working in *black and white*. Haven't really settled on a set of brushes I like 100% with Procreate yet so things still have that oil painting look. To counter some of that \"over blended-ness\" I applied some grain with the noise brush after getting the facial structure locked.\n\nNow to find paper textures I can import into Procreate to build drawings on top of...\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in 4 hours and 50 minutes.\" %}\n{% youtube 3FI6OblgfeY %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2015-12-07-molly-m-portrait.md",
    "content": "---\ntitle: \"The better to see you\"\nexcerpt: \"Portrait of Molly M. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-12-07T14:52:04-05:00\nimage: \n  path: &image /assets/images/molly-m-procreate.jpg\n  width: 1600\n  height: 2400\n  feature: *image\n  thumbnail: /assets/images/molly-m-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, Sktchy]\n---\n\nPortrait of Molly M. inspired by a [photograph on Sktchy](https://sktchy.com/hvnEKC). Digitally painted with Procreate on an iPad Air 2.\n\nThe new split view in iOS 9 on the iPad is fantastic. Swiping over the Photos app with my reference material instead of importing and wasting valuable canvas space is a treat.\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in approximately 6 hours.\" %}\n{% youtube 8DPmXlx58Dk %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2015-12-27-skylar-s-portrait.md",
    "content": "---\ntitle: \"Rough is not rough enough\"\nexcerpt: \"Portrait of Skylár S. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-12-27T00:00:00-00:00\nimage: \n  path: &image /assets/images/skylar-s-procreate.jpg\n  width: 2048\n  height: 3072\n  feature: *image\n  thumbnail: /assets/images/skylar-s-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, black and white, Sktchy]\n---\n\nPortrait of Skylár S. inspired by a [photograph on Sktchy](https://sktchy.com/hvnEKC). Digitally painted with Procreate on an iPad Air 2.\n\nPlease excuse the rough hatching as I was trying to avoid over polishing the face. Maybe some day I'll pick this up again and actually finish it.\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in approximately 2.5 hours.\" %}\n{% youtube eFr3E4yqmzM %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-01-03-david-g-portrait.md",
    "content": "---\ntitle: \"Beard strokes for days\"\nexcerpt: \"Portrait of David G. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2015-12-27T00:00:00-00:00\nimage: \n  path: &image /assets/images/david-g-procreate.jpg\n  width: 1600\n  height: 2400\n  feature: *image\n  thumbnail: /assets/images/david-g-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, beard, Sktchy]\n---\n\nPortrait of David G. inspired by a [photograph on Sktchy](https://sktchy.com/CIyk0D). Digitally painted with Procreate on an iPad Air 2.\n\nI could have easily spent another 5 hours meticulously rendering beard whiskers and cleaning up some sloppy color transitions. But at some point you just have to put your kid to bed to rest and grow.\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in approximately 5 hours.\" %}\n{% youtube oekapLJEWfs %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-01-25-rakso-s-portrait.md",
    "content": "---\ntitle: \"Right amount of beard sparkle\"\nexcerpt: \"Portrait of Rakso S. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2016-10-10T10:49:10-04:00\nimage: \n  path: &image /assets/images/rakso-s-procreate.jpg\n  width: 1600\n  height: 1200\n  feature: *image\n  thumbnail: /assets/images/rakso-s-procreate-250.jpg\ngallery:\n  - url: /assets/images/rakso-s-process-1-lg.jpg\n    image_path: /assets/images/rakso-s-process-1-320.jpg\n    alt: \"line drawing work in process screenshot\"\n  - url: /assets/images/rakso-s-process-2-lg.jpg\n    image_path: /assets/images/rakso-s-process-2-320.jpg\n    alt: \"glazing work in process screenshot\"\n  - url: /assets/images/rakso-s-process-3-lg.jpg\n    image_path: /assets/images/rakso-s-process-3-320.jpg\n    alt: \"work in progress screenshot\"\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, time lapse, beard, Sktchy, black and white]\n---\n\nPortrait of Rakso S. inspired by a [photograph on Sktchy](https://sktchy.com/a4RQUD). Digitally painted with Procreate on an iPad Air 2.\n\nIf you squint your eyes just right it almost looks like a photograph. Just don't zoom in on the forehead or else you'll notice how unpolished the painting really is. But I'm not complaining, 3 hours of work with results like this --- I'll take it!\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in approximately 3 hours.\" %}\n{% youtube gn6it_JASKY %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-02-18-jenny-x-portrait.md",
    "content": "---\ntitle: \"Painterly fringed collar\"\nexcerpt: \"Portrait of Jenny x. digitally painted with Procreate on an iPad.\"\nlast_modified_at: \nimage: \n  path: &image /assets/images/jenny-x-procreate.jpg\n  width: 1800\n  height: 2400\n  feature: *image\n  thumbnail: /assets/images/jenny-x-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, time lapse]\n---\n\nPortrait of Jenny x. inspired by a [photograph on Sktchy](https://sktchy.com/rK7LX). Digitally painted with Procreate on an iPad Air 2.\n\nIn an attempt to fool my brain into seeing shapes and paint more accurately I flipped the canvas upside-down. Not sure if it was the lighting in the reference photo that tripped me up, but I really struggled with the nose and lips.\n\nIt's kind of hard to look at now because all I see are the spots I botched. Suppose that's the benefit of working digitally, it's fairly easy to go back in and make alterations --- if I only had the time...\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in approximately 6 hours.\" %}\n{% youtube l2Of1-d5E5o %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-03-01-morgan-f-portrait.md",
    "content": "---\ntitle: \"Tales of round brushing\"\nexcerpt: \"Portrait of Morgan F. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2016-03-01T15:02:19-05:00\nimage: \n  path: &image /assets/images/morgan-f-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/morgan-f-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, time lapse]\n---\n\nPortrait of Morgan F. inspired by a [photograph on Sktchy](https://sktchy.com/rK7LX). Digitally painted with Procreate on an iPad Air 2.\n\n![Procreate glazing brush](/assets/images/procreate-glazing-brush.jpg){: .align-right}\n\nGoing back to my friend the **round brush** in Procreate has been fun. I've experimented with textured brushes recently, but haven't been completely happy with the results compared to the default round brush.\n\nI've found playing with opacity and the glazing toggles gets color results similar to what I'd achieve with [Paper's watercolor brush]({% post_url /mastering-paper/2014-09-16-watercolor-brush-update %}). Brushes in Procreate don't exactly have the same level of organic-ness, but with enough glazes and on-canvas mixing you can get close.\n\n{% figure caption:\"Time lapse video recorded within Procreate, completed in approximately 4 hours.\" %}\n{% youtube -PVofD2A9t8 %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-04-15-april-c-portrait.md",
    "content": "---\ntitle: \"Messy paint across the scalp\"\nexcerpt: \"Portrait of April C. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2016-04-15T12:14:37-04:00\nimage: \n  path: &image /assets/images/april-c-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/april-c-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, time lapse]\n---\n\nPortrait of April C. inspired by a [photograph on Sktchy](https://sktchy.com/idj87H). Digitally painted with Procreate on an iPad Air 2.\n\nIt's been a hectic start to spring so I haven't had too much free time to paint. The announcement of the smaller iPad Pro almost had me pulling the trigger, but I really want the larger version --- but with the True Tone display. I suppose I can wait until this fall...\n\n<blockquote class=\"twitter-video\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\">Messy messy <a href=\"https://twitter.com/hashtag/Procreate?src=hash\">#Procreate</a> <a href=\"https://twitter.com/hashtag/Sktchy?src=hash\">#Sktchy</a> <a href=\"https://t.co/C5PjBiY5P0\">pic.twitter.com/C5PjBiY5P0</a></p>&mdash; Michael Rose (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/719340953656508416\">April 11, 2016</a></blockquote>\n<script async src=\"//platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n\n{% include_cached boilerplate/procreate.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-04-26-emil-i-portrait.md",
    "content": "---\ntitle: \"Watercolor, not watercolor\"\nexcerpt: \"Portrait of Emil I. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2017-09-08T10:24:20-04:00\nimage: \n  path: &image /assets/images/emil-i-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/emil-i-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, time lapse]\n---\n\nPortrait of Emil I. inspired by a [photograph on Sktchy](https://sktchy.com/TXmmCc). Digitally painted with Procreate on an iPad Air 2.\n\nWhen Adobe and Adonit released the [Ink & Slide](https://www.amazon.com/Adobe-Creative-Connected-Precision-Stylus/dp/B00LNECVN6/ref=as_li_ss_tl?ie=UTF8&linkCode=ll1&tag=mademist-20&linkId=643de6452764ad91cc2a8a8077f11204) stylus and ruler combo I was intrigued. There really weren't any well designed pressure sensitive styli out there with a fine tip. The high sticker price scared me away initially, after being burned by the [Pogo Connect]({% post_url /mastering-paper/2013-07-08-pogo-connect-smart-pen %}) and its myriad of hardware issues --- so I decided to wait.\n\nFast forward to last week when bought an Adobe Ink that was on sale for 90% off. I could live with losing $20 if it turned out to be a dud...\n\n![Work in progress with the Adonit Ink stylus](/assets/images/emil-i-procreate-adonit-ink-900.jpg)\n\nWell after drawing with it for a few hours it definitely has some issues. Most of can be traced back to the [iPad Air 2](http://www.adonit.net/blog/archives/2015/05/07/ipad-air-2-performance/), which doesn't exactly support the stylus properly.\n\nThere's some serious lag which I can give it a pass on since this thing came out way before the Apple Pencil. That said, if you can get used to the lag it gets the job done.\n\nOn the positive side, the tip is made of a hard plastic. Unlike styli that have the fat rubber nibs --- it doesn't appear it will ever wear out. Plus it doesn't smear grease all over the screen which is a big win in my book.\n\nAfter getting a taste at what pressure sensitive drawing with Procreate could be like, I just want to own the real thing --- an [Apple Pencil and iPad Pro]({% post_url /articles/2015-09-25-ipad-pro %}) :smile:.\n\n{% figure caption:\"Time lapse video recorded within Procreate.\" %}\n{% youtube fFX1CUO472U %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate-2.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-05-18-jonathan-h-portrait.md",
    "content": "---\ntitle: \"Blue and pink lights\"\nexcerpt: \"Portrait of Jonathan H. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2016-05-18T10:46:51-04:00\nimage: \n  path: &image /assets/images/jonathan-h-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/jonathan-h-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, time lapse]\n---\n\nPortrait of Jonathan H. inspired by a [photograph on Sktchy](https://sktchy.com/4cnY0H). Digitally painted with Procreate on an iPad Air 2.\n\nThe more I've been using this [**Adonit Ink**](http://www.amazon.com/Adobe-Creative-Connected-Precision-Stylus/dp/B00LNECVN6/ref=as_li_ss_tl?ie=UTF8&qid=1461688574&sr=8-1&keywords=adobe+ink&linkCode=ll1&tag=mademist-20&linkId=85c30649adf50e2ff0b9c753f6dfe2c9) stylus the more I want an Apple Pencil. \n\nI knew going in that support for the Ink was likely going to be poor with my **iPad Air 2**. That hasn't stopped me from trying to get the most out of it though. It reminds me of the days of using a Pogo Connect that would register a touch around 60% of the time forcing you to redo your marks.\n\n{% figure caption:\"I planned on spending more time detailing and refining things, but the frustration of working with unresponsive and inaccurate styli got the better of me.\" %}\n{% youtube yFpaUg5AH_o %}\n{% endfigure %}\n\nMaybe I should just give the digital stuff a break for now and go old school with paper and pencil. Using such powerful tools like the iPad and [**Procreate**](http://procreate.si/) make things almost too easy. If I'm to improve my observation and drawing skills I really need to focus on the basics.\n\nOnly problem I have is I love the freedom and convenience of digital art. I've gotten so used to not working at a desk and getting messy it would be hard to go back. Hmm...\n\n{% include_cached boilerplate/procreate-2.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-05-18-maria-g-portrait.md",
    "content": "---\ntitle: \"Nose ring oil\"\nexcerpt: \"Portrait of María G. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2016-05-18T10:46:46-04:00\nimage: \n  path: &image /assets/images/maria-g-procreate.jpg\n  width: 1600\n  height: 1200\n  feature: *image\n  thumbnail: /assets/images/maria-g-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, time lapse]\n---\n\nPortrait of María G. inspired by a [photograph on Sktchy](https://sktchy.com/buLgeD). Digitally painted with Procreate on an iPad Air 2.\n\nRecently noticed that **Reflector** no longer worked for mirroring my iOS devices' screens to my iMac because of an iOS 9 incompatibility. Since the upgrade to [**Reflector 2**](http://www.airsquirrels.com/reflector/) was pretty cheap I did that and decided to do a test recording from my iPad.\n\nThe updates I'm enjoying the most are:\n\n- Can now record at 1080p from my iPad (previously capped at 720p).\n- Can simultaneously record multiple devices at once.\n- Options to change the background color and image.\n- Can now directly live stream to YouTube from Reflector without using an additional app like [**Open Broadcasting Software**](https://obsproject.com/).\n\n<figure>\n  <blockquote class=\"instagram-media\" data-instgrm-captioned data-instgrm-version=\"7\" style=\" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:658px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); width:calc(100% - 2px);\"><div style=\"padding:8px;\"> <div style=\" background:#F8F8F8; line-height:0; margin-top:40px; padding:50.0% 0; text-align:center; width:100%;\"> <div style=\" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAApWqozAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURczMzPf399fX1+bm5mzY9AMAAADiSURBVDjLvZXbEsMgCES5/P8/t9FuRVCRmU73JWlzosgSIIZURCjo/ad+EQJJB4Hv8BFt+IDpQoCx1wjOSBFhh2XssxEIYn3ulI/6MNReE07UIWJEv8UEOWDS88LY97kqyTliJKKtuYBbruAyVh5wOHiXmpi5we58Ek028czwyuQdLKPG1Bkb4NnM+VeAnfHqn1k4+GPT6uGQcvu2h2OVuIf/gWUFyy8OWEpdyZSa3aVCqpVoVvzZZ2VTnn2wU8qzVjDDetO90GSy9mVLqtgYSy231MxrY6I2gGqjrTY0L8fxCxfCBbhWrsYYAAAAAElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;\"></div></div> <p style=\" margin:8px 0 0 0; padding:0 4px;\"> <a href=\"https://www.instagram.com/p/BFZ4HeEgU48/\" style=\" color:#000; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none; word-wrap:break-word;\" target=\"_blank\">Testing Reflector 2 with #Procreate, please excuse the awful painting.</a></p> <p style=\" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; line-height:17px; margin-bottom:0; margin-top:8px; overflow:hidden; padding:8px 0 7px; text-align:center; text-overflow:ellipsis; white-space:nowrap;\">A video posted by Michael Rose (@mmistakes) on <time style=\" font-family:Arial,sans-serif; font-size:14px; line-height:17px;\" datetime=\"2016-05-14T22:24:35+00:00\">May 14, 2016 at 3:24pm PDT</time></p></div></blockquote>\n  <script async defer src=\"//platform.instagram.com/en_US/embeds.js\"></script>\n</figure>\n\nThe painting is really rough and needs a lot more work. I was mainly interested and see how Reflector handled the recording than the actual painting.\n\n{% include_cached boilerplate/procreate-2.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2016-07-22-mahalia-h-portrait.md",
    "content": "---\ntitle: \"Eyes be damned\"\nexcerpt: \"Portrait of Mahalia H. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2016-07-22T10:48:14-04:00\nimage: \n  path: &image /assets/images/mahalia-h-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/mahalia-h-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, time lapse]\n---\n\nPortrait of Mahalia H. inspired by a [photograph on Sktchy](https://sktchy.com/hZqgKD). Digitally painted with Procreate on an iPad Air 2.\n\nLooks like the 3.1 update to Procreate improved support for Adobe's Ink stylus. Whether it was a set of changes to the [Jot Touch iOS SDK](https://github.com/Adonit/Adonit-iOS-SDK) or Procreate I don't know, but the stylus seems to register input more reliably with an iPad Air 2.\n\nI'm sure it's nowhere close to the responsiveness one experiences with Apple's Pencil[^apple-pencil], but for the budget-minded it does the job.\n\n[^apple-pencil]: I still haven't had the opportunity to try an [iPad Pro and Apple Pencil]({% post_url /articles/2015-09-25-ipad-pro %}) yet. I know I know... :frowning:\n\n{% figure caption:\"Time lapse video recorded within Procreate.\" %}\n{% youtube W0q-UBnz6QA %}\n{% endfigure %}\n\n{% include_cached boilerplate/procreate-2.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2017-08-31-lunar-ashes-portrait.md",
    "content": "---\ntitle: \"Choke's embrace\"\nexcerpt: \"Portrait of Lunar Ashes digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2017-08-31T14:31:18-04:00\nimage: \n  path: &image /assets/images/lunar-ashes-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/lunar-ashes-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, black and white, time lapse]\n---\n\nPortrait of Lunar Ashes inspired by a [photograph on Sktchy](https://sktchy.com/pSkSa). Digitally painted with Procreate on an iPad Air 2.\n\nA lovers embrace painting for a Valentine's Day inspired Sktchy challenge titled #WAXcupid.\n\n<figure>\n  <blockquote class=\"twitter-tweet\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\">Stupid unresponsive stylus. Need a Pro + Pencil already 😭 <a href=\"https://t.co/95x5rXVsyr\">pic.twitter.com/95x5rXVsyr</a></p>&mdash; Michael Rose (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/833362456743440384\">February 19, 2017</a></blockquote>\n  <script async src=\"//platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n</figure>\n\n{% include_cached boilerplate/procreate-2.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2018-03-22-marion-k-portrait.md",
    "content": "---\ntitle: \"Back at it\"\nexcerpt: \"Portrait of Marion K. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2018-03-22T09:21:18-04:00\nimage: \n  path: &image /assets/images/marion-k-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/marion-k-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, black and white, time lapse]\n---\n\nPortrait of Marion K. inspired by a [photograph on Sktchy](http://​sktchy.com/p6juFc ). Digitally painted with Procreate on a 12.9\" iPad Pro.\n\nI finally got my hands on a new iPad Pro and the highly responsive Apple Pencil. This is [the stylus I have been waiting for]({% post_url /articles/2015-09-25-ipad-pro %})!\n\n<figure>\n  <blockquote class=\"twitter-tweet\" data-conversation=\"none\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\">Process video <a href=\"https://t.co/MfP9TmESlR\">pic.twitter.com/MfP9TmESlR</a></p>&mdash; Michael Rose (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/976620815662960640?ref_src=twsrc%5Etfw\">March 22, 2018</a></blockquote>\n  <script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n</figure>\n\n{% include_cached boilerplate/procreate-3.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2018-04-03-foggy-365-portrait.md",
    "content": "---\ntitle: \"Glowing pencil practice\"\nexcerpt: \"Portrait of Foggy 365 digitally painted with Procreate on an iPad.\"\nlast_modified_at:\nimage: \n  path: &image /assets/images/foggy-365-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/foggy-365-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, black and white, time lapse]\n---\n\nPortrait of Foggy 365 inspired by a [photograph on Sktchy](https://sktchy.com/QFzi9D). Digitally painted with Procreate on a 12.9\" iPad Pro.\n\nTrying to emulate the look of graphite on paper...\n\n<figure>\n  <blockquote class=\"twitter-tweet\" data-conversation=\"none\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\">Time-lapse replay exported from <a href=\"https://twitter.com/Procreate?ref_src=twsrc%5Etfw\">@Procreate</a> <a href=\"https://t.co/Ww2m40qdoI\">pic.twitter.com/Ww2m40qdoI</a></p>&mdash; Michael Rose (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/977574457278640128?ref_src=twsrc%5Etfw\">March 24, 2018</a></blockquote>\n  <script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n</figure>\n\n{% include_cached boilerplate/procreate-3.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2018-04-03-maya-z-portrait.md",
    "content": "---\ntitle: \"Corpse paint your tears\"\nexcerpt: \"Portrait of Maya Z. digitally painted with Procreate on an iPad.\"\nlast_modified_at:\nimage: \n  path: &image /assets/images/maya-z-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/maya-z-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, black and white, time lapse]\n---\n\nPortrait of Maya Z. inspired by a [photograph on Sktchy](https://sktchy.com/efNbvC). Digitally painted with Procreate on a 12.9\" iPad Pro.\n\n{% figure caption:\"Slowly building up tones.\" class:\"gallery-2-col\" %}\n[![work in progress screenshot](/assets/images/maya-z-progress-1.jpg)](/assets/images/maya-z-progress-1-lg.jpg)\n[![work in progress screenshot](/assets/images/maya-z-progress-2.jpg)](/assets/images/maya-z-progress-2-lg.jpg)\n{% endfigure %}\n\n<figure>\n  <blockquote class=\"twitter-tweet\" data-conversation=\"none\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\"><a href=\"https://twitter.com/hashtag/Procreate?src=hash&amp;ref_src=twsrc%5Etfw\">#Procreate</a> time-lapse export <a href=\"https://t.co/dSNE7fKHWb\">pic.twitter.com/dSNE7fKHWb</a></p>&mdash; Michael Rose (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/980117629473083394?ref_src=twsrc%5Etfw\">March 31, 2018</a></blockquote>\n  <script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n</figure>\n\n{% include_cached boilerplate/procreate-3.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2018-04-14-tatha-s-portrait.md",
    "content": "---\ntitle: \"Turn away\"\nexcerpt: \"Portrait of Tatha S. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2018-04-14T14:27:36-04:00\nimage: \n  path: &image /assets/images/tatha-s-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/tatha-s-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, black and white, time lapse]\n---\n\nPortrait of Tatha S. inspired by a [photograph on Sktchy](https://sktchy.com/Eoee2D). Digitally painted with Procreate on a 12.9\" iPad Pro.\n\n{% figure caption:\"Using Apple Pencil to lay lines.\" class:\"gallery-2-col\" %}\n[![work in progress screenshot](/assets/images/tatha-s-progress-1.jpg)](/assets/images/tatha-s-progress-1-lg.jpg)\n[![work in progress screenshot](/assets/images/tatha-s-progress-2.jpg)](/assets/images/tatha-s-progress-2-lg.jpg)\n{% endfigure %}\n\n<figure>\n  <blockquote class=\"twitter-tweet\" data-conversation=\"none\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\">Procreate time-lapse export <a href=\"https://t.co/Xw5ozxENYI\">pic.twitter.com/Xw5ozxENYI</a></p>&mdash; 𝔐𝔦𝔠𝔥𝔞𝔢𝔩 ℜ𝔬𝔰𝔢 (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/984246043511607297?ref_src=twsrc%5Etfw\">April 12, 2018</a></blockquote>\n  <script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n</figure>\n\n{% include_cached boilerplate/procreate-3.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2018-04-30-ale-b-portrait.md",
    "content": "---\ntitle: \"The two hour beard\"\nexcerpt: \"Portrait of Ale B. digitally painted with Procreate on an iPad.\"\nlast_modified_at: 2018-04-30T16:22:39-04:00\nimage: \n  path: &image /assets/images/ale-b-procreate.jpg\n  width: 1600\n  height: 2133\n  feature: *image\n  thumbnail: /assets/images/ale-b-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, black and white, beard, time lapse]\n---\n\nPortrait of Ale B. inspired by a [photograph on Sktchy](https://sktchy.com/pGkOfH). Digitally painted with Procreate on a 12.9\" iPad Pro.\n\nTwo hours and 30 minutes of beard scribbling over the last couple of weeks. Because who has time to relax draw in a single sitting?\n\n{% figure caption:\"Work in progress\" %}\n[![work in progress screenshot](/assets/images/ale-b-progress-1.jpg)](/assets/images/ale-b-progress-1-lg.jpg)\n{% endfigure %}\n\n<figure>\n  <blockquote class=\"twitter-tweet\" data-conversation=\"none\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\">Time-lapse export video via <a href=\"https://twitter.com/hashtag/Procreate?src=hash&amp;ref_src=twsrc%5Etfw\">#Procreate</a> <a href=\"https://twitter.com/hashtag/WIP?src=hash&amp;ref_src=twsrc%5Etfw\">#WIP</a> <a href=\"https://twitter.com/hashtag/Sktchy?src=hash&amp;ref_src=twsrc%5Etfw\">#Sktchy</a> <a href=\"https://t.co/uqMtzknWYp\">pic.twitter.com/uqMtzknWYp</a></p>&mdash; 𝔐𝔦𝔠𝔥𝔞𝔢𝔩 ℜ𝔬𝔰𝔢 (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/990746870380195840?ref_src=twsrc%5Etfw\">April 30, 2018</a></blockquote>\n  <script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n</figure>\n\n{% include_cached boilerplate/procreate-3.md %}\n"
  },
  {
    "path": "src/_posts/procreate/2018-06-04-marie-m-portrait.md",
    "content": "---\ntitle: \"Water tension\"\nexcerpt: \"Portrait of Marie M. digitally painted with Procreate on an iPad.\"\nlast_modified_at:\nimage: \n  path: &image /assets/images/marie-m-procreate.jpg\n  width: 1600\n  height: 900\n  feature: *image\n  thumbnail: /assets/images/marie-m-procreate-250.jpg\ncategories: [procreate-paintings]\ntags: [Procreate, portrait, illustration, Sktchy, black and white, time lapse]\n---\n\nPortrait of Marie M. inspired by a [photograph on Sktchy](https://sktchy.com/FVAa3D). Digitally painted with Procreate on a 12.9\" iPad Pro.\n\nApproximately 6 hours of work spread across a couple of weeks.\n\n<figure>\n  <blockquote class=\"twitter-tweet\" data-conversation=\"none\" data-lang=\"en\"><p lang=\"en\" dir=\"ltr\">~6 hours of work spread across a couple of weeks, because who has time? <a href=\"https://t.co/faECZVYPSP\">pic.twitter.com/faECZVYPSP</a></p>&mdash; 𝔐𝔦𝔠𝔥𝔞𝔢𝔩 ℜ𝔬𝔰𝔢 (@mmistakes) <a href=\"https://twitter.com/mmistakes/status/1003311926024294402?ref_src=twsrc%5Etfw\">June 3, 2018</a></blockquote>\n  <script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n</figure>\n\n{% include_cached boilerplate/procreate-3.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-bith-painting.md",
    "content": "---\ntitle: \"Sexy Saxophone\"\nexcerpt: \"Tiny portrait of a Bith painted with watercolor on hot press paper.\"\nlast_modified_at: 2016-10-10T11:22:24-04:00\nimage: \n  path: &image /assets/images/painting-bith.jpg\n  width: 1600\n  height: 875\n  feature: *image\n  thumbnail: /assets/images/painting-bith-250.jpg\ngallery:\n  - url: /assets/images/painting-bith-process-1-lg.jpg\n    image_path: /assets/images/painting-bith-process-1-900.jpg\n    alt: \"Work in process\"\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Star Wars]\n---\n\nTiny portrait of a Bith from **Star Wars**. Painted with watercolor on hot press paper.\n\nFinal painting measures 1.5\\\" x 1.5\\\". There sure are a lot of fun freaks from the Mos Eisley Cantina scene to choose from. Could have greatly benefited from a clear reference photograph...\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-gamorrean-guard-painting.md",
    "content": "---\ntitle: \"Pig Lizard\"\nexcerpt: \"Tiny portrait of a Gamorrean Guard from Return of the Jedi, painted with watercolor on hot press paper.\"\nlast_modified_at: 2015-11-16T11:22:01-05:00\nimage: \n  path: &image /assets/images/painting-gamorrean-guard.jpg\n  width: 1570\n  height: 969\n  feature: *image\n  thumbnail: /assets/images/painting-gamorrean-guard-250.jpg\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Star Wars]\n---\n\nTiny portrait of a Gamorrean Guard from **Return of the Jedi**. Painted with watercolor on hot press paper.\n\nFinal painting measures 1.5\\\" x 1.5\\\". Ended up a little more illustrative than realistic, but I'll take it.\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-grand-moff-tarkin-painting.md",
    "content": "---\ntitle: \"Charming to the last\"\nexcerpt: \"Tiny portrait of a Grand Moff Tarkin painted with watercolor on hot press paper.\"\nlast_modified_at: 2016-10-10T11:21:40-04:00\nimage: \n  path: &image /assets/images/painting-grand-moff-tarkin.jpg\n  width: 1600\n  height: 943\n  feature: *image\n  thumbnail: /assets/images/painting-grand-moff-tarkin-250.jpg\ngallery:\n  - url: /assets/images/painting-grand-moff-tarkin-process-1-lg.jpg\n    image_path: /assets/images/painting-grand-moff-tarkin-process-1-900.jpg\n    alt: \"Pencil sketch work in process\"\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Star Wars]\n---\n\nTiny portrait of Grand Moff Tarkin from **Star Wars**. Painted with watercolor on hot press paper.\n\nFinal painting measures 1.5\\\" x 1.5\\\" and was completed about 3 hours. Was convinced he was going to resemble Magneto by the end of it, but was able to pull it together once the color started to flow.\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-greedo-painting.md",
    "content": "---\ntitle: \"Going somewhere, Solo?\"\nexcerpt: \"Tiny portrait of Greedo painted with watercolor on hot press paper.\"\nlast_modified_at: 2016-10-10T11:20:57-04:00\nimage: \n  path: &image /assets/images/painting-greedo.jpg\n  width: 1600\n  height: 1059\n  feature: *image\n  thumbnail: /assets/images/painting-greedo-250.jpg\ngallery:\n  - url: /assets/images/painting-greedo-process-1-lg.jpg\n    image_path: /assets/images/painting-greedo-process-1-900.jpg\n    alt: \"Pencil sketch work in process\"\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Star Wars]\n---\n\nTiny portrait of Greedo from **Star Wars**. Painted with watercolor on hot press paper.\n\nFinal painting measures 1.5\\\" x 1.5\\\". Patience is one thing I struggle with when painting so small. Trying to rush things along really screwed me in a few places. That and leaving too much water on my brush...\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-michael-rose-painting.md",
    "content": "---\ntitle: \"Cut My Face in Half\"\nexcerpt: \"Tiny portrait of Michael Rose painted with watercolor on hot press paper.\"\nlast_modified_at: 2016-10-10T11:19:28-04:00\nimage: \n  path: &image /assets/images/painting-michael-rose.jpg\n  width: 1600\n  height: 915\n  feature: *image\n  thumbnail: /assets/images/painting-michael-rose-250.jpg\ngallery:\n  - url: /assets/images/painting-michael-rose-process-1-lg.jpg\n    image_path: /assets/images/painting-michael-rose-process-1-600.jpg\n    alt: \"Pencil sketch work in process\"\n  - url: /assets/images/painting-michael-rose-process-2-lg.jpg\n    image_path: /assets/images/painting-michael-rose-process-2-600.jpg\n    alt: \"First layer of watercolor glaze\"\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, self portrait, illustration]\n---\n\nTiny self portrait painted with watercolor on hot press paper.\n\nFinal painting measures 1.5\\\" x 1.5\\\" and was completed in just under one hour. I find its always easier to work with foreign media when starting with a familiar subject. In this case it was my own face... well part of it at least.\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-myah-graham-painting.md",
    "content": "---\ntitle: \"Hey Blue\"\nexcerpt: \"Tiny portrait of Myah Graham, painted with watercolor on hot press paper.\"\nlast_modified_at: 2015-11-05T14:39:38-05:00\nimage: \n  path: &image /assets/images/painting-myah-graham.jpg\n  width: 1600\n  height: 908\n  feature: *image\n  thumbnail: /assets/images/painting-myah-graham-250.jpg\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Sktchy]\n---\n\nTiny portrait of Myah Graham inspired by a [photograph on Sktchy](https://sktchy.com/gAj7DH). Painted with watercolor on hot press paper. \n\nFinal painting measures 2.5\\\" x 1.5\\\". Facial features at this size sure are difficult to pull off accurately. I constantly found myself getting the proportions wrong and painting them too large.\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-ponda-baba-painting.md",
    "content": "---\ntitle: \"He Doesn't Like You\"\nexcerpt: \"Tiny portrait of Ponda Baba painted with watercolor on hot press paper.\"\nlast_modified_at: 2015-11-16T11:22:26-05:00\nimage: \n  path: &image /assets/images/painting-ponda-baba.jpg\n  width: 1862\n  height: 1114\n  feature: *image\n  thumbnail: /assets/images/painting-ponda-baba-250.jpg\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Star Wars]\n---\n\nTiny portrait of Ponda Baba from **Star Wars**. Painted with watercolor on hot press paper.\n\nFinal painting measures 1.5\\\" x 1.5\\\". Really happy with the colors on this one, even if I lost some of the furry details in the face.\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2015-10-16-stormtrooper-painting.md",
    "content": "---\ntitle: \"Close the Blast Doors\"\nexcerpt: \"Tiny portrait of a Star Wars Stormtrooper painted with watercolor on hot press paper.\"\nlast_modified_at: 2016-10-10T11:01:54-04:00\nimage: \n  path: &image /assets/images/painting-stormtrooper.jpg\n  width: 1600\n  height: 1067\n  feature: *image\n  thumbnail: /assets/images/painting-stormtrooper-250.jpg\ngallery:\n  - url: /assets/images/painting-stormtrooper-process-1-lg.jpg\n    image_path: /assets/images/painting-stormtrooper-process-1-600.jpg\n    alt: \"pencil sketch\"\n  - url: /assets/images/painting-stormtrooper-process-2-lg.jpg\n    image_path: /assets/images/painting-stormtrooper-process-2-600.jpg\n    alt: \"finished watercolor painting\"\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Star Wars]\n---\n\nTiny portrait of a Stormtrooper from **Star Wars**. Painted with watercolor on hot press paper.\n\nFinal painting measures 1.5\\\" x 1.5\\\" and was completed in just under one hour. Underestimated how bad things can go when using white watercolor painting incorrectly. I won't make that mistake again...\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/tiny-paintings/2016-06-10-adam-vitry-painting.md",
    "content": "---\ntitle: \"In Your Face\"\nexcerpt: \"Tiny portrait of Adam Vitry, painted with watercolor on hot press paper.\"\nlast_modified_at: 2016-06-10T11:38:48-04:00\nimage: \n  path: &image /assets/images/painting-adam-vitry.jpg\n  width: 1600\n  height: 1048\n  feature: *image\n  thumbnail: /assets/images/painting-adam-vitry-250.jpg\ncategories: [tiny-paintings]\ntags: [watercolor, portrait, illustration, Sktchy]\n---\n\nTiny portrait of Adam Vitry inspired by a [photograph on Sktchy](https://sktchy.com/PAjPOC). Painted with watercolor on hot press paper. \n\nFinal painting measures 1.5\\\" x 1.5\\\".\n\n{% figure caption:\"Initial sketch completed with a 2H pencil to keep things light. #WAXquicktip\" %}\n![pencil sketch](/assets/images/painting-adam-vitry-process.jpg)\n{% endfigure %}\n\n{% figure caption:\"2 hours of painting condensed into 30 seconds.\" %}\n{% youtube QDpXp5v2syk %}\n{% endfigure %}\n\n{% include_cached boilerplate/watercolor.md %}\n"
  },
  {
    "path": "src/_posts/work/2013-06-26-so-simple-jekyll-theme.md",
    "content": "---\ntitle: \"So Simple, a Jekyll theme\"\nexcerpt: \"A simple Jekyll theme for words and pictures by designer Michael Rose.\"\nlast_modified_at: 2018-02-06T11:16:06-05:00\nimage: \n  path: &image /assets/images/jekyll-theme-so-simple-feature-2018.jpg\n  width: 1600\n  height: 800\n  feature: *image\ngallery:\n  - url: /assets/images/so-simple-post.png\n    image_path: /assets/images/so-simple-post-th.jpg\n    alt: \"post layout example\"\n    class: \"browser-frame\"\n  - url: /assets/images/so-simple-posts.png\n    image_path: /assets/images/so-simple-posts-th.jpg\n    alt: \"list of posts layout example\"\n    class: \"browser-frame\"\n  - url: /assets/images/so-simple-search.png\n    image_path: /assets/images/so-simple-search-th.jpg\n    alt: \"search layout example\"\n    class: \"browser-frame\"\ncategories: [work]\ntags: [Jekyll, web development, open source, GitHub]\nwork: \"Design & Development\"\nbreadcrumbs:\n  - label: \"Work\"\n    url: /work/\n  - label: \"Jekyll themes\"\n    url: /work/jekyll-themes/\ncomments: true\ncomments_locked: true\ntoc: true\nsupport: true\norder: 10\n---\n\nAfter having so much fun creating and releasing [my first open source Jekyll theme](https://mmistakes.github.io/minimal-mistakes), I figured I'd go at it again. So here be the fruit of that effort --- I call it [**So Simple**](https://mmistakes.github.io/so-simple-theme), a simple Jekyll theme for words and pictures. \n\n- A variety of layouts with clean and readable typography.\n- [Microformats](http://microformats.org/wiki/microformats2) markup to make post content machine-readable and discoverable.\n- Disqus Comments and Google Analytics support.\n- SEO best practices via [Jekyll SEO Tag](https://github.com/jekyll/jekyll-seo-tag).\n- Options to customize the theme and make it your own.\n\n<p markdown=\"0\">\n  <a href=\"https://mmistakes.github.io/so-simple-theme/\" onclick=\"ga('send', 'event', 'link', 'click', 'Preview So Simple');\" class=\"btn\">Live preview</a>\n</p>\n\n## Usage\n\nTo learn more about how to install, configure, customize the look and feel, and some other junk, [read up here](https://github.com/mmistakes/so-simple-theme).\n\n## Questions?\n\nHaving a problem getting something to work or want to know why I setup something in a certain way? [File a GitHub issue](https://github.com/mmistakes/so-simple-theme/issues).\n\n## License\n\nThis theme is free and open source software, distributed under the [MIT License](https://github.com/mmistakes/so-simple-theme/blob/master/LICENSE).\n"
  },
  {
    "path": "src/_posts/work/2013-08-26-hpstr-jekyll-theme.md",
    "content": "---\ntitle: \"HPSTR, a Jekyll theme\"\nexcerpt: \"A responsive Jekyll blog theme designed to give your site a modern and somewhat cliché look.\"\nimage: \n  path: &image /assets/images/hpstr-preview-feature-2015.jpg\n  width: 1600\n  height: 600\n  feature: *image\ncategories: [work]\ntags: [Jekyll, web development, open source, GitHub]\nwork: \"Design & Development\"\nlast_modified_at: 2018-02-06T11:15:46-05:00\nbreadcrumbs:\n  - label: \"Work\"\n    url: /work/\n  - label: \"Jekyll themes\"\n    url: /work/jekyll-themes/\ncomments: true\ncomments_locked: true\ntoc: true\nsupport: true\norder: 9\n---\n\nThey say three times the charm, so here is another free Jekyll blog theme for you. I've learned a ton since open sourcing my first two themes [on Github](http://github.com/mmistakes), and wanted to try a few new things this time around. If you've used my previous themes most of this should be familiar territory...\n\n## Features\n\n* Responsive layouts. Looks good on mobile, tablets, and desktop devices.\n* Full compatibility with [GitHub Pages](http://pages.github.com/).\n* Modern and minimal design with a focus on clean typography.\n* Support for large images to call out your favorite posts.\n* Optional [Disqus](http://disqus.com) comments.\n* Support for [Open Graph](https://developers.facebook.com/docs/opengraph/) and [Twitter Cards](https://dev.twitter.com/docs/cards).\n* Simple custom 404 page to get you started.\n* Support for Pygments and Coderay syntax highlighting to make your code examples look snazzy.\n* Grunt and Rake tasks for easier site development.\n\n[![Screenshot of HPSTR Theme](/assets/images/hpstr-jekyll-theme-preview.jpg)](https://mmistakes.github.io/jekyll-theme-hpstr/ \"Preview HPSTR\")\n{: .browser-frame}\n\n<p markdown=\"0\">\n  <a href=\"https://mmistakes.github.io/jekyll-theme-hpstr/theme-setup/\" class=\"btn\">Setup guide</a>\n  <a href=\"https://mmistakes.github.io/jekyll-theme-hpstr/\" class=\"btn\">Live preview</a>\n</p>\n\n## What's different with this Jekyll theme?\n\nThis time around I wanted to see how much of the \"branding\"[^2] I could remove and deemphasize to make the content sing in contrast. The primary way I went about doing this was by down playing anything that wasn't part of a post or page's content. Collapsing the blog's navigation behind a drop down was one way I slimmed the header, to get at the content quicker.\n\nOn desktops and tablets (horizontal orientation) the menu is placed in the top left corner with `position: fixed`[^3] to remain in view as the page is scrolled. Mild CSS3 animations and transforms were utilized to progressively enhance the [drop down menu](http://tympanus.net/codrops/2013/04/19/responsive-multi-level-menu/) for browsers that support these properties, and gracefully degrades on those that do not. *The menu is also completely usable when JavaScript is disabled.*\n\nEverything that isn't `#main` I view as support content--- living one step down from a post or page in the overall hierarchy. In the case of author bylines, post dates, and social sharing links, I used a light gray color to push these elements back, and pull the main content forward. Related posts and comments are sectioned off just enough from the main to keep them connected but visually separated.\n\n### Grunt build script for development\n\nUp until this point I've mostly used tools like [CodeKit](http://incident57.com/codekit/) and [Prepros](https://prepros.io/) to compile my LESS stylesheets and concatenate scripts. Flirting with Grunt on a few personal projects, I wanted to integrate it into this theme as a build tool for messing with the theme's stylesheets.\n\nFor those who are unfamiliar with Grunt I encourage you to check out the [getting started guide](http://gruntjs.com/getting-started). Basically how this works is, you [install Node.js](http://nodejs.org/), [install Grunt](http://gruntjs.com/getting-started) and dependencies by running `npm install`, and then run various Grunt tasks defined in the project's [`Gruntfile.js`](https://github.com/mmistakes/jekyll-theme-hpstr/blob/master/Gruntfile.js) file.\n\nCurrently there are two Grunt tasks: one to build and optimize and the other to watch for changes to any LESS and JavaScript files. For now you need to run `grunt` to rebuild the CSS, concatenate JavaScript files, and optimize .jpg, .png, and .svg files in the `images/` folder. And then run `jekyll build` to pull these changes in when developing locally. \n\nThere are some [Jekyll Grunt plugins](https://github.com/dannygarcia/grunt-jekyll) to help make things work more seamless, but I avoided them to keep the theme compatible with GitHub Pages. While not a perfect solution you can run `grunt watch` in combination with `jekyll build --watch` to watch for LESS and JS file updates to be processed by Grunt and auto-generated by Jekyll.\n\n{% notice %}\n#### Update\n\nGrunt is no longer needed to build `main.css`. I've ported all of the Less stylesheets over to Sass to utilize Jekyll's built-in support for preprocessing .scss files. Updating most colors and fonts is as easy as changing a few values in `_sass/_variables.scss` and running `jekyll build` (or deploying to GitHub if you host there).\n{% endnotice %}\n\n### Social sharing links\n\nInstead of using bulky JavaScript widgets provided by Facebook, Twitter, and Google I went with lightweight share links. Social sharing links are enabled by default on all posts and pages. To disable add `share: false` to the post's YAML Front Matter.\n\n{% figure caption:\"How social sharing buttons look in HPSTR\" %}\n![social share button screenshot](/assets/images/hpstr-social-share-example.jpg)\n{% endfigure %}\n\n[^2]: To me a blog's masthead, logo, title, headline, and navigation are branding elements that can reinforce or distract from a central theme or feeling. I suppose downplaying or removing these elements could be see as a way of branding too… but that's a discussion for another day.\n[^3]: On mobile I choose to remove the fixed positioning to keep the menu from interfering with the main content.\n\n## Questions?\n\nHaving a problem getting something to work or want to know why I setup something in a certain way? [File a GitHub issue](https://github.com/mmistakes/jekyll-theme-hpstr/issues/new).\n\n## License\n\nThis theme is free and open source software, distributed under the [MIT License](https://github.com/mmistakes/jekyll-theme-hpstr/blob/master/LICENSE). So feel free to modify it however you'd like without linking back to me or including a disclaimer.\n"
  },
  {
    "path": "src/_posts/work/2014-09-02-skinny-bones-jekyll.md",
    "content": "---\ntitle: \"Skinny Bones, a Jekyll starter\"\nexcerpt: \"A responsive, fully realized, and lightweight website starter for Jekyll.\"\nimage: \n  path: &image /assets/images/skinny-bones-preview-feature.jpg\n  width: 1600\n  height: 600\n  feature: *image\ncategories: [work]\ntags: [Jekyll, web development, open source, GitHub]\nwork: \"Design & Development\"\nlast_modified_at: 2015-05-22T15:11:31-04:00\nbreadcrumbs:\n  - label: \"Work\"\n    url: /work/\n  - label: \"Jekyll themes\"\n    url: /work/jekyll-themes/\ncomments: true\ncomments_locked: true\nsupport: true\ntoc: true\norder: 11\n---\n\nWhat originally started as a site refresh quickly turned into something else when Jekyll baked in native support for Sass with a [2.0 release](http://jekyllrb.com/docs/history/#v2-0-0).\n\nThis was a good excuse to learn Sass and figured starting a new repository to experiment with would be better than breaking my existing site and Jekyll themes. I ended up with what I'm calling **Skinny Bones** by completely rewriting all of [Made Mistakes's](https://github.com/mmistakes/made-mistakes) stylesheets, `_layouts`, and `_includes` to be more modular.\n\nI like to think of Skinny Bones as a starter for building your own Jekyll powered site --- versus a theme you use as is. I've purposely kept the styling minimal and light to make adding your own flare and markup easier. If that's not your thing you can still use it without modification, but where is the fun in that?\n\n<p markdown=\"0\">\n  <a href=\"https://mmistakes.github.io/jekyll-theme-skinny-bones/getting-started/\" class=\"btn\">Setup guide</a>\n  <a href=\"https://mmistakes.github.io/jekyll-theme-skinny-bones/\" class=\"btn\">Live preview</a>\n</p>\n\n## Notable features\n\n* GitHub Pages compatible.\n* Stylesheets built using Sass to help theme your site with ease. *Requires Jekyll 2.x*\n* Data files for easier customization of the site navigation/footer and for supporting multiple authors.\n* Optional Disqus comments, table of contents, social sharing links, and Google AdSense ads.\n* And more.\n\n## Contributing\n\nFound a bug or aren't quite sure how something works? By all means [submit an issue](https://github.com/mmistakes/jekyll-theme-skinny-bones/issues) on GitHub. For straight forward bug fixes (spelling mistakes, typos, broken links, etc.) feel free to submit pull requests. \n\n**Skinny Bones** was built predominately as a framework for myself. My intention was never to make it all things for all people. So please keep that in mind before submitting new features or enhancements. If you've used any of my [Jekyll themes](https://mademistakes.com/work/jekyll-themes/) I think it's pretty clear what I like and what I try to avoid. When in doubt ask before wasting your time on a feature that won't get merged in.\n\n## License\n\nThis theme is free and open source software, distributed under the MIT License. So feel free to use this Jekyll theme on your site without linking back to me or including a disclaimer. \n"
  },
  {
    "path": "src/_posts/work/2016-04-15-minimal-mistakes-jekyll-theme.md",
    "content": "---\ntitle: \"Minimal Mistakes, a Jekyll theme\"\nexcerpt: \"A flexible two-column Jekyll theme. Perfect for hosting your personal site, blog, or portfolio on GitHub or your own server.\"\nlast_modified_at: 2018-02-06T11:15:51-05:00\nimage: \n  path: &image /assets/images/minimal-mistakes-3-feature.jpg\n  width: 1600\n  height: 710\n  feature: *image\ngallery:\n  - url: /assets/images/mm-layout-splash.png\n    image_path: /assets/images/mm-layout-splash-th.jpg\n    alt: \"splash layout example\"\n    class: \"browser-frame\"\n  - url: /assets/images/mm-layout-single-meta.png\n    image_path: /assets/images/mm-layout-single-meta-th.jpg\n    alt: \"single layout with comments and related posts\"\n    class: \"browser-frame\"\n  - url: /assets/images/mm-layout-archive.png\n    image_path: /assets/images/mm-layout-archive-th.jpg\n    alt: \"archive layout example\"\n    class: \"browser-frame\"\ncategories: [work]\ntags: [Jekyll, web development, open source, GitHub]\nwork: \"Design & Development\"\nbreadcrumbs:\n  - label: \"Work\"\n    url: /work/\n  - label: \"Jekyll themes\"\n    url: /work/jekyll-themes/\ncomments: true\ncomments_locked: true\ntoc: true\nsupport: true\norder: 8\n---\n\nMinimal Mistakes is a flexible two-column Jekyll theme. Perfect for hosting your personal site, blog, or portfolio on GitHub or your own server. \n\nIncludes responsive layouts (`single`, `archive`, and `splash` pages) that look great on mobile and desktop browsers. As the name implies --- styling is purposely minimalistic to be enhanced and customized by you :smile:.\n\n<p markdown=\"0\">\n  <a href=\"https://mmistakes.github.io/minimal-mistakes/\" onclick=\"ga('send', 'event', 'link', 'click', 'Preview Minimal Mistakes');\" class=\"btn\">Live preview</a>\n</p>\n\n## Theme features\n\n- Compatible with GitHub Pages\n- Several layout options (single, archive, splash pages)\n- SEO optimized with support for [Twitter Cards](https://dev.twitter.com/cards/overview) and [Open Graph](http://ogp.me/) data\n- Optional header images, sidebars, table of contents, galleries, related posts, breadcrumb links, and more.\n- Optional comments ([Disqus](https://disqus.com/), [Facebook](https://developers.facebook.com/docs/plugins/comments), Google+, [Staticman](https://staticman.net/), and custom)\n- Optional analytics ([Google Analytics](https://www.google.com/analytics/) and custom)\n\n## Usage\n\nTo learn more about how to customize this theme, include feature images in posts, modify the look and feel, create new posts, and some other junk, [read up here](https://mmistakes.github.io/minimal-mistakes/docs/quick-start-guide/).\n\n## License\n\nThis theme is free and open source software, distributed under the [MIT License](https://github.com/mmistakes/minimal-mistakes/blob/master/LICENSE).\n"
  },
  {
    "path": "src/_posts/work/2017-03-30-basically-basic-jekyll-theme.md",
    "content": "---\ntitle: \"Basically Basic, a Jekyll theme\"\nexcerpt: \"Your new Jekyll default theme.\"\nlast_modified_at: 2019-02-19T10:05:55-05:00\nimage: \n  path: &image /assets/images/jekyll-theme-basically-basic-feature.jpg\n  width: 1600\n  height: 694\n  feature: *image\ngallery:\n  - url: /assets/images/basically-basic-theme-menu.png\n    image_path: /assets/images/basically-basic-theme-menu-th.png\n    alt: \"off-canvas menu example\"\n    class: \"browser-frame\"\n  - url: /assets/images/basically-basic-theme-cv.png\n    image_path: /assets/images/basically-basic-theme-cv-th.png\n    alt: \"CV example\"\n    class: \"browser-frame\"\n  - url: /assets/images/basically-basic-theme-alternate-skin.jpg\n    image_path: /assets/images/basically-basic-theme-alternate-skin-th.jpg\n    alt: \"alternate skin example\"\n    class: \"browser-frame\"\ncategories: [work]\ntags: [Jekyll, web development, open source, GitHub]\nwork: \"Design & Development\"\nbreadcrumbs:\n  - label: \"Work\"\n    url: /work/\n  - label: \"Jekyll themes\"\n    url: /work/jekyll-themes/\nsupport: true\ntoc: true\norder: 7\n---\n\nBasically Basic is a [Jekyll theme](https://jekyllrb.com/docs/themes/) meant as a substitute for the default --- [Minima](https://github.com/jekyll/minima). Conventions and features found there are fully supported by **Basically Basic**, with a few enhancements thrown in for good measure:\n\n- Clean responsive design with six customizable skins\n- Curriculum Vitæ/Resume layout powered by [JSON Resume](https://jsonresume.org/)\n- About page layout\n- Disqus Comments and Google Analytics support\n- SEO best practices via [Jekyll SEO Tag](https://github.com/jekyll/jekyll-seo-tag/)\n\n<p markdown=\"0\">\n  <a href=\"https://mmistakes.github.io/jekyll-theme-basically-basic/\" onclick=\"ga('send', 'event', 'link', 'click', 'Preview Basically Basic');\" class=\"btn\">Live preview</a>\n</p>\n\n## Usage\n\nTo learn more about how to install, configure, customize the look and feel, create a curriculum vitæ/resume page, and some other junk, [read up here](https://github.com/mmistakes/jekyll-theme-basically-basic).\n\n## Questions?\n\nHaving a problem getting something to work or want to know why I setup something in a certain way? [File a GitHub issue](https://github.com/mmistakes/jekyll-theme-basically-basic/issues).\n\n## License\n\nThis theme is free and open source software, distributed under the [MIT License](https://github.com/mmistakes/jekyll-theme-basically-basic/blob/master/LICENSE).\n"
  },
  {
    "path": "src/_redirects",
    "content": "# Redirect default Netlify subdomain to primary domain\nhttps://mademistakes.netlify.com/* https://mademistakes.com/:splat 301!\nhttp://mademistakes.netlify.com/* https://mademistakes.com/:splat 301!\n\n# ----------------------------------------------------------------------\n# Page redirects\n# ----------------------------------------------------------------------\n\n/about-made-mistakes /about/ 301\n/articles/autumn-refresh/ /notes/autumn-refresh/ 301\n/articles/inktober-2016-failure/ /notes/inktober-2016-failure/ 301\n/articles/paperfaces-giveaway/ /notes/paperfaces-giveaway/ 301\n/articles/inspiring-faces/ /notes/inspiring-faces/ 301\n/articles/starting-young/ /notes/starting-young/ 301\n/articles/365-days-of-drawing/ /notes/365-days-of-drawing/ 301\n/articles/paperfaces-ipad-portrait-project/ /notes/paperfaces-ipad-portrait-project/ 301\n/articles/romance-egg-engagement/ /notes/romance-egg-engagement/ 301\n/articles/record-art-review-corn-on-macabre-7-inch/ /notes/record-art-review-corn-on-macabre-7-inch/ 301\n/articles/free-aboutme-business-cards/ /notes/free-aboutme-business-cards/ 301\n/articles/urban-outfitters-typography-goof/ /notes/urban-outfitters-typography-goof/ 301\n/articles/record-art-review-agna-moraines-autobiography-7-inch/ /notes/record-art-review-agna-moraines-autobiography-7-inch/ 301\n/articles/collecting-records-artwork/ /notes/collecting-records-artwork/ 301\n/articles/typography-urban-outfitters/ /notes/typography-urban-outfitters/ 301\n/articles/knowing-grids-means-breaking-grids/ /notes/knowing-grids-means-breaking-grids/ 301\n/articles/makings-mistake/ /notes/makings-mistake/ 301\n/articles/iphone4-impressions/ /notes/iphone4-impressions/ 301\n/articles/soldout-iphone-4/ /notes/soldout-iphone-4/ 301\n/articles/doppleganger-credit-card-scammer/ /notes/doppleganger-credit-card-scammer/ 301\n/articles/eviltron-prank-review/ /notes/eviltron-prank-review/ 301\n/articles/palm-pre-impressions/ /notes/palm-pre-impressions/ 301\n/articles/birds-bird-cage-tattoos/ /notes/birds-bird-cage-tattoos/ 301\n/articles/blurb-book-quality-printing/ /notes/blurb-book-quality-printing/ 301\n/articles/using-rasterbator/ /notes/using-rasterbator/ 301\n/articles/diving-bell-butterfly-impressions/ /notes/diving-bell-butterfly-impressions/ 301\n/articles/rriiccee-show-last-night-soundlab/ /notes/rriiccee-show-last-night-soundlab/ 301\n/articles/upgrade-imac-g5-osx-leopard/ /notes/upgrade-imac-g5-osx-leopard/ 301\n/articles/one-week-new-ipod-classic/ /notes/one-week-new-ipod-classic/ 301\n/articles/sunshine-movie-impressions/ /notes/sunshine-movie-impressions/ 301\n/articles/tale-two-sisters-impressions/ /notes/tale-two-sisters-impressions/ 301\n/articles/la-moustache-impressions/ /notes/la-moustache-impressions/ 301\n/articles/ipod-battery-settlement/ /notes/ipod-battery-settlement/ 301\n/articles/feeling-kinda-stuck-half-nelson/ /notes/feeling-kinda-stuck-half-nelson/ 301\n/articles/blend-first-look /mastering-paper/pencil-first-look/ 301\n/articles/contour-drawing /mastering-paper/contour-drawing/ 301\n/articles/drawing-faces-paper-53 /mastering-paper/drawing-blank-faces/ 301\n/articles/face /articles/paperfaces-ipad-portrait-project/ 301\n/articles/faces-made-with-paper-ipad /articles/paperfaces-ipad-portrait-project/ 301\n/articles/how-to-draw-hair-paper-53 /mastering-paper/drawing-hair/ 301\n/articles/hpstr-jekyll-theme /work/hpstr-jekyll-theme/ 301\n/articles/madewithpaper-drawing-guide /mastering-paper/short-guide/ 301\n/articles/mastering-paper-53-guide /mastering-paper/ 301\n/articles/minimal-mistakes-jekyll-theme /work/minimal-mistakes-jekyll-theme/ 301\n/articles/paper-53-basics /mastering-paper/basics/ 301\n/articles/paper-53-book-review /mastering-paper/moleskine-book/ 301\n/articles/paper-53-drawing-sky-clouds /mastering-paper/drawing-clouds/ 301\n/articles/paper-53-drawing-textures /mastering-paper/drawing-textures/ 301\n/articles/paper-53-drawing-trees /mastering-paper/drawing-trees/ 301\n/articles/paper-53-drawing-water-waves /mastering-paper/drawing-water/ 301\n/articles/paper-53-introduction /mastering-paper/introduction-tool-guide/ 301\n/articles/paperfaces-portrait-gallery /paperfaces/ 301\n/articles/pencil-53-review /mastering-paper/pencil-53-review/ 301\n/articles/pogo-connect-sensitivity /mastering-paper/pogo-connect-sensitivity/ 301\n/articles/pogo-connect-smart-pen /mastering-paper/pogo-connect-smart-pen/ 301\n/articles/remix-me /mastering-paper/mix/ 301\n/articles/skinny-bones-jekyll /work/skinny-bones-jekyll/ 301\n/articles/so-simple-jekyll-theme /work/so-simple-jekyll-theme/ 301\n/blog /articles/ 301\n/blog/those-city-folk-in-animal-crossing-still-love-the-gossip /articles/animal-crossing-city-folk-impressions/ 301\n/code-highlighting-post/ /work/jekyll-themes/ 301\n/drawing-textures /mastering-paper/drawing-textures/ 301\n/hpstr /work/hpstr-jekyll-theme/ 301\n/mastering-paper/basic /mastering-paper/basics/ 301\n/minimal-mistakes /work/minimal-mistakes-jekyll-theme/ 301\n/paperfaces/lorenzo-raffio-portrait /paperfaces/lorenzo-portrait/ 301\n/paperfaces/slave-leia-jabba-the-hutt /paperfaces/slave-leia-jabba-the-hutt-portrait/ 301\n/portraits /paperfaces/ 301\n/procreate-paintings/jenyy-x-portrait /procreate-paintings/jenny-x-portrait/ 301\n/so-simple /work/so-simple-jekyll-theme/ 301\n/subscribe /support/ 301\n/tag/fiftythree /tag/paper-for-ios/ 301\n/tag/paper-by-53 /tag/paper-for-ios/ 301\n/tags /tag/ 301\n/works /work/ 301\n/til/ /tag/til/ 301\n/til/* /notes/:splat 301\n/lifestream/* /notes/ 301\n\n# ----------------------------------------------------------------------\n# Sitemap redirects\n# ----------------------------------------------------------------------\n\n/sitemap.xml.gz /sitemap.xml 301\n/post-sitemap.xml /sitemap.xml 301\n/category-sitemap.xml /sitemap.xml 301\n\n# ----------------------------------------------------------------------\n# Feed redirects\n# ----------------------------------------------------------------------\n\n/atom /atom.xml 301\n/rss /atom.xml 301\n/feed.xml /atom.xml 301\n/everything.xml /atom.xml 301\n/articles-feed.xml /articles.xml 301\n/mastering-paper-feed.xml /mastering-paper.xml 301\n/paperfaces-feed.xml /paperfaces.xml 301\n/til.xml /notes.xml 301\n"
  },
  {
    "path": "src/_work/eko-wave.md",
    "content": "---\npublished: false\nlayout: page\ntitle: \"Eko Wave\"\nexcerpt: \"Site design and creative for Eko Wave — a team of three specializing in niche applications.\"\nimage: \n  path: &image /assets/images/eko-wave-feature.jpg\n  width: 1200\n  height: 450\n  feature: *image\ntags: [design, logo, website]\nwork: \"Design & Development\"\nads: false\norder: 6\nlast_modified_at: 2018-03-05T13:54:54-05:00\n---\n\n[Eko Wave LLC](http://ekowave.com) is a company started by [two](http://twitter.com/endonend) [pals](http://twitter.com/bjpmba) and myself to provide value to niche consumers through well-thought-out applications.\n\nWhen designing the logo I wanted something that played off of the word *wave* found in our name, while keeping with a color palette we established in Eko's previous life.\n\n<figure>\n\t<img src=\"/assets/images/eko-wave-logo-guide.jpg\" alt=\"Eko Wave logo guide\">\n\t<figcaption>Eko Wave logo guide</figcaption>\n</figure>\n\nTaking things a step further I created a basic style tile[^style-tile] document that helped me brainstorm how color, typography, and imagery fit and sell the concept to my partners. It would also serve as blueprint for me to design the site in browser --- making for a more enjoyable and loose experience instead of being tied to a .PSD mockup I needed to CSSify[^cssify] exactly.\n\n[^style-tile]: Style Tiles are a design deliverable consisting of fonts, colors and interface elements that communicate the essence of a visual brand for the web. ([Learn more](http://styletil.es/))\n\n[^cssify]: Is CSSify even a word?\n\n<figure>\n\t<img src=\"/assets/images/eko-wave-style-tile.jpg\" alt=\"Eko Wave style tile\">\n\t<figcaption>Eko Wave style tile</figcaption>\n</figure>\n\nThe end result was a simple one page site that will ultimately grow as we build out our application and service portfolio.\n"
  },
  {
    "path": "src/_work/jekyll-themes.md",
    "content": "---\nlayout: archive\ntitle: \"Jekyll themes\"\nexcerpt: \"Open source Jekyll themes by yours truly, to help build a site or blog on GitHub Pages, Netlify, GitLab, and more.\"\nlast_modified_at: 2018-11-27T09:44:26-05:00\nimage: \n  path: &image /assets/images/jekyll-themes-feature.jpg\n  width: 1920\n  height: 793\n  feature: *image\ntags: [Jekyll, web development, open source, GitHub]\nwork: \"Design & Development\"\norder: 2\ncomments: false\ncomments_locked: true\nsupport: true\n---\n\nBelow are all of the Jekyll starters I've developed and open sourced. Each theme contains all of the `_layouts`, `_includes`, Sass/CSS, JavaScript, and other sample files needed to build and host a site or blog. \n\nThe basic setup for each of my theme's is roughly the same:\n\n  1. Install [gem-based theme](https://jekyllrb.com/docs/themes/#understanding-gem-based-themes), [remote theme](https://github.com/benbalter/jekyll-remote-theme), or fork the theme repository you'd like to use.\n  2. [Install Bundler](http://bundler.io) `gem install bundler` and run `bundle install` to install all dependencies (Jekyll, plugins, and so on).\n  3. Update `_config.yml`, data files (found in `_data`), and replace sample posts and pages with your own.\n\nFor more specifics, review each theme's documentation by clicking on the **setup guide** buttons below.\n\n## [So Simple theme]({% post_url /work/2013-06-26-so-simple-jekyll-theme %})\n\n{% figure caption:\"Large images and site logo if that's your thing\" %}\n ![So Simple Jekyll theme screenshot](/assets/images/jekyll-theme-so-simple-feature-2018.jpg)\n{% endfigure %}\n\nSo Simple is a simple Jekyll theme for your words and pictures. Features include:\n\n- Available as a [gem-based theme](https://rubygems.org/gems/jekyll-theme-so-simple) and remote theme.\n- Compatible with GitHub Pages.\n- A variety of layouts with clean and readable typography.\n- [Microformats](http://microformats.org/wiki/microformats2) markup to make post content machine-readable and discoverable.\n- Disqus Comments and Google Analytics support.\n- SEO best practices via [Jekyll SEO Tag](https://github.com/jekyll/jekyll-seo-tag).\n- Options to customize the theme and make it your own.\n\n<p markdown=\"0\">\n  <a href=\"https://github.com/mmistakes/so-simple-theme\" class=\"btn\">Setup guide</a>\n  <a href=\"https://mmistakes.github.io/so-simple-theme\" class=\"btn\">Live preview</a>\n</p>\n\n## [Basically Basic theme]({% post_url /work/2017-03-30-basically-basic-jekyll-theme %})\n\n{% figure caption:\"Your new Jekyll default theme.\" %}\n![Basically Basic Jekyll theme screenshot](/assets/images/jekyll-theme-basically-basic-feature.jpg)\n{% endfigure %}\n\nBasically Basic is a [Jekyll theme](https://jekyllrb.com/docs/themes/) meant as a substitute for the default --- [Minima](https://github.com/jekyll/minima). Conventions and features found there are fully supported by **Basically Basic**, with a few enhancements thrown in for good measure:\n\n- Available as a [gem-based theme](https://rubygems.org/gems/jekyll-theme-basically-basic) and remote theme.\n- Compatible with GitHub Pages.\n- Clean responsive design with six customizable skins.\n- Curriculum Vitæ/Resume layout powered by [JSON data](http://registry.jsonresume.org/).\n- About page layout.\n- Disqus Comments and Google Analytics support.\n- SEO best practices via [Jekyll SEO Tag](https://github.com/jekyll/jekyll-seo-tag/).\n\n<p markdown=\"0\">\n  <a href=\"https://github.com/mmistakes/jekyll-theme-basically-basic\" class=\"btn\">Setup guide</a>\n  <a href=\"https://mmistakes.github.io/jekyll-theme-basically-basic/\" class=\"btn\">Live preview</a>\n</p>\n\n## [Minimal Mistakes theme]({% post_url /work/2016-04-15-minimal-mistakes-jekyll-theme %})\n\n{% figure caption:\"A minimal design to let your content shine.\" %}\n![Minimal Mistakes Jekyll theme screenshot](/assets/images/minimal-mistakes-3-feature.jpg)\n{% endfigure %}\n\nA flexible two-column Jekyll theme with a minimalist aesthetic.\n\n  - Available as a [gem-based theme](https://rubygems.org/gems/minimal-mistakes-jekyll) and remote theme.\n  - Compatible with GitHub Pages.\n  - Several layout options (single, archive, splash pages).\n  - SEO optimized with support for [Twitter Cards](https://dev.twitter.com/cards/overview) and [Open Graph](http://ogp.me/) data.\n  - Optional header images, sidebars, table of contents, galleries, related posts, breadcrumb links, and more.\n  - Optional comments ([Disqus](https://disqus.com/), [Facebook](https://developers.facebook.com/docs/plugins/comments), Google+, [Staticman](https://staticman.net/), and more).\n  - Optional analytics ([Google Analytics](https://www.google.com/analytics/) and custom).\n\n<p markdown=\"0\">\n  <a href=\"https://mmistakes.github.io/minimal-mistakes/docs/quick-start-guide/\" class=\"btn\">Setup guide</a>\n  <a href=\"https://mmistakes.github.io/minimal-mistakes\" class=\"btn\">Live preview</a>\n</p>\n\n## [HPSTR theme]({% post_url /work/2013-08-26-hpstr-jekyll-theme %})\n\n{% figure caption:\"A traditional blog approach with a modern style\" %}\n![HPSTR Jekyll theme screenshot](/assets/images/hpstr-preview-feature-2015.jpg)\n{% endfigure %}\n\nA responsive Jekyll blog theme designed to give your site a modern and somewhat cliché feel.\n\n  - Compatible with GitHub Pages.\n  - Modern design with rounded rectangles and subtle gradients.\n  - Animated main menu.\n  - Built-in support for Sass and data files (requires Jekyll 2.x).\n\n<p markdown=\"0\">\n  <a href=\"https://mmistakes.github.io/jekyll-theme-hpstr/theme-setup/\" class=\"btn\">Setup guide</a>\n  <a href=\"https://mmistakes.github.io/jekyll-theme-hpstr/\" class=\"btn\">Live preview</a>\n</p>\n\n## [Skinny Bones theme]({% post_url /work/2014-09-02-skinny-bones-jekyll %})\n\n{% figure caption:\"Includes a fun off canvas menu\" %}\n![Skinny Bones Jekyll theme screenshot](/assets/images/skinny-bones-preview-feature.jpg)\n{% endfigure %}\n\nA Jekyll starter based off of an older incarnation of Made Mistakes.\n\n  - Compatible with GitHub Pages.\n  - Built-in support for Sass and data files (requires Jekyll 2.x).\n  - Off canvas menu.\n  - Tile based archives.\n  - Optional table of contents, share links, Disqus comments modules, and more.\n\n<p markdown=\"0\">\n\t<a href=\"https://mmistakes.github.io/jekyll-theme-skinny-bones/getting-started/\" class=\"btn\">Setup guide</a>\n  <a href=\"https://mmistakes.github.io/jekyll-theme-skinny-bones/\" class=\"btn\">Live preview</a>\n</p>\n\n---\n\n### License\n\nThese themes are free and open source software, distributed under the MIT License. Feel free to modify them to suit your needs.\n"
  },
  {
    "path": "src/_work/paperfaces.md",
    "content": "---\nlayout: archive\npermalink: /paperfaces/\ncategory: paperfaces\ntitle: \"PaperFaces iPad project\"\nexcerpt: \"PaperFaces portraits painted digitally with Paper for iOS on an iPad. Find time lapse videos, in-process screenshots, and more.\"\nlast_modified_at: 2018-11-06T12:08:16-05:00\nimage: \n  path: &image /assets/images/paperfaces-project-feature.jpg\n  width: 1280\n  height: 640\n  feature: *image\ntags: [Paper for iOS, portrait, drawing, painting, iPad, illustration, 365 project]\nads: false\nwork: \"Illustration\"\norder: 3\n---\n\nPaperFaces was an [illustration project](/articles/paperfaces-ipad-portrait-project/) by designer Michael Rose --- hey that's me! For two years I drew the faces of strangers everyday using an iPad, a stylus, and **Paper for iOS**. I occasionally post new portraits here, but certainly not as frequently as I used to.\n\nIf you scroll down far enough you can see how my technique evolved from faceless gestures into realistic portraits[^procreate].\n\n<ul class=\"gallery-thumbnails\">\n{% for post in site.categories.paperfaces %}\n  <li>\n    <a href=\"{{ post.url }}\" title=\"{{ post.title }}\">\n      <noscript>\n        <img src=\"{{ post.image.thumbnail }}\">\n      </noscript>\n      <img class=\"lazyload fade-in\" src=\"/assets/images/preload-150.png\" data-src=\"{{ post.image.thumbnail }}\" alt=\"\">\n    </a>\n  </li>\n{% endfor %}\n</ul>\n\n[^procreate]: If you like these be sure to check out what I'm [painting with another iPad app](/procreate-paintings/), **Procreate**.\n"
  },
  {
    "path": "src/_work/procreate-paintings.md",
    "content": "---\nlayout: archive\npermalink: /procreate-paintings/\ncategory: procreate-paintings\ntitle: \"Procreate iPad paintings\"\nexcerpt: &excerpt \"Gallery of digital paintings created with [Procreate](http://procreate.si/) on an iPad. Find time lapse videos, in-process screenshots, and more.\"\nsubtitle: *excerpt\ndate: 2017-05-01\nlast_modified_at: 2017-05-07T17:26:15-04:00\nimage: \n  path: &image /assets/images/procreate-paintings-feature.jpg\n  width: 1600\n  height: 748\n  feature: *image\ntags: [Procreate, painting, drawing, portrait, illustration]\nads: false\nwork: \"Illustration\"\norder: 1\n---\n\nDigital paintings created on an iPad using the iOS app [**Procreate** by Savage Interactive](http://procreate.si/).\n\n<ul class=\"gallery-thumbnails\">\n{% for post in site.categories.procreate-paintings %}\n  <li>\n    <a href=\"{{ post.url }}\" title=\"{{ post.title }}\">\n      <noscript>\n        <img src=\"{{ post.image.thumbnail }}\">\n      </noscript>\n      <img class=\"lazyload fade-in\" src=\"/assets/images/preload-150.png\" data-src=\"{{ post.image.thumbnail }}\" alt=\"\">\n    </a>\n  </li>\n{% endfor %}\n</ul>\n"
  },
  {
    "path": "src/_work/relic-scout.md",
    "content": "---\npublished: false\nlayout: page\ntitle: \"Relic Scout\"\nexcerpt: \"Site design and creative for Relic Scout -- an app to make collecting simpler, while saving you money.\"\nimage: \n  path: &image /assets/images/relic-scout-home-feature.png\n  width: 1068\n  height: 487\n  feature: *image\nlast_modified_at: 2017-04-19T14:34:04-04:00\ntags: [design, logo, 8-bit, website, collectibles]\nwork: \"Design & Development\"\nads: false\norder: 5\nlast_modified_at: 2018-03-05T13:55:06-05:00\n---\n\nEko Wave, a company started by [two](http://twitter.com/endonend) [pals](http://twitter.com/bjpmba) and myself, just took the wraps off our first app --- **Relic Scout**. Last week we launched a teaser site and couldn't be prouder of the work that we've done so far.\n\nI had a lot of fun creating the 8bit pixel art and applying a parallax effect to it using the [jQuery plugin Plax](https://github.com/cameronmcefee/plax). If you collect sports cards, magic cards, coins, or comics, you really should check it out.\n\n<figure>\n\t<img src=\"/assets/images/relic-scout-browser-750.jpg\" alt=\"Relic Scout homepage screenshot\">\n\t<figcaption>Relic Scout teaser homepage</figcaption>\n</figure>\n"
  },
  {
    "path": "src/_work/tiny-paintings.md",
    "content": "---\nlayout: archive\npermalink: /tiny-paintings/\ncategory: tiny-paintings\ntitle: \"Tiny paintings\"\nexcerpt: &excerpt \"Gallery of mini watercolor portraits painted at really small sizes.\"\nimage: \n  path: &image /assets/images/tiny-paintings.jpg\n  width: 1600\n  height: 824\n  feature: *image\ntags: [watercolor, painting, drawing, portrait, illustration]\nads: false\nwork: \"Illustration\"\norder: 4\nlast_modified_at: 2017-04-08T22:46:16-04:00\n---\n\nTrying to emulate the look and feel of [watercolor on the iPad](/paperfaces/) has inspired me to revisit painting traditionally. I've gone mini in an effort to fit some painting in amongst family and work obligations. \n\nMy plan was to complete a miniature 1.5\\\" painting a day, but the challenge of painting so small is eating up way too much time. Instead I'm going to keep things casual and let images happen as they happen.\n\n<ul class=\"gallery-thumbnails\">\n{% for post in site.categories.tiny-paintings %}\n  <li>\n    <a href=\"{{ post.url }}\" title=\"{{ post.title }}\">\n      <noscript>\n        <img src=\"{{ post.image.thumbnail }}\">\n      </noscript>\n      <img class=\"lazyload fade-in\" src=\"/assets/images/preload-150.png\" data-src=\"{{ post.image.thumbnail }}\" alt=\"\">\n    </a>\n  </li>\n{% endfor %}\n</ul>\n"
  },
  {
    "path": "src/admin/config.yml",
    "content": "backend:\n  name: git-gateway\n  branch: master\n\nmedia_folder: \"src/assets/images\"\npublic_folder: \"/assets/images\"\n\ncollections:\n  - name: \"articles\"\n    label: \"Articles\"\n    folder: \"src/_posts/articles\"\n    create: true\n    slug: \"{{year}}-{{month}}-{{day}}-{{slug}}\"\n    fields:\n      - {label: \"Layout\", name: \"layout\", widget: \"hidden\", default: \"post\"}\n      - {label: \"Title\", name: \"title\", widget: \"string\"}\n      - {label: \"Excerpt\", name: \"excerpt\", widget: \"string\"}\n      - label: \"Image\"\n        name: \"image\"\n        widget: \"object\"\n        fields:\n          - {label: \"Path\", name: \"path\", widget: \"image\"}\n          - {label: \"Feature image path\", name: \"feature\", widget: \"image\"}\n          - {label: \"Image width\", name: \"width\", widget: \"number\", valueType: \"int\"}\n          - {label: \"Image height\", name: \"height\", widget: \"number\", valueType: \"int\"}\n          - {label: \"Image caption\", name: \"caption\", widget: \"string\"}\n      - {label: \"Last modified date\", name: \"last_modified_date\", widget: \"datetime\"}\n      - {label: \"Reading time\", name: \"read_time\", widget: \"boolean\", default: true}\n      - {label: \"Categories\", name: \"categories\", widget: \"list\", default: [\"articles\"]}\n      - {label: \"Tags\", name: \"tags\", widget: \"list\"}\n      - {label: \"Table of contents\", name: \"toc\", widget: \"boolean\", default: false}\n      - {label: \"Comments\", name: \"comments\", widget: \"boolean\", default: false}\n      - {label: \"Support block\", name: \"support\", widget: \"boolean\", default: false}\n      - {label: \"Body\", name: \"body\", widget: \"markdown\"}\n"
  },
  {
    "path": "src/admin/index.html",
    "content": "<!DOCTYPE html>\n<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n    <title>Content Manager</title>\n    <script src=\"https://identity.netlify.com/v1/netlify-identity-widget.js\"></script>\n  </head>\n  <body>\n    <!-- Include the script that builds the page and powers Netlify CMS -->\n    <script src=\"https://unpkg.com/netlify-cms@^2.0.0/dist/netlify-cms.js\"></script>\n  </body>\n</html>\n"
  },
  {
    "path": "src/articles.xml",
    "content": "---\nlayout: atom_feed\ncategory_limit: articles\nlimit: 25\ntitle: \"Articles Feed\"\nsitemap: false\n---\n"
  },
  {
    "path": "src/assets/javascripts/main.js",
    "content": "// asynchronously load fonts\nWebFontConfig = {\n  google: {\n    families: [\"Alegreya:700\", \"Spectral:400,400i,700,700i\"]\n  }\n};\n\n// if( cookie( fullCSSKey ) ){\n//   (function(d) {\n//     var wf = d.createElement('script'), s = d.scripts[0];\n//     wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.28/webfont.js';\n//     s.parentNode.insertBefore(wf, s);\n//   })(document);\n// };\n\n$(document).ready(function() {\n  // SVG for Everybody init\n  svg4everybody();\n\n  // smooth scroll init\n  var scroll = new SmoothScroll('a[href*=\"#\"]', {\n    offset: 20,\n    speed: 200\n  });\n\n  // add lightbox class to all image links\n  $(\"a[href$='.jpg'], a[href$='.png'], a[href$='.gif']\").attr(\"data-lity\", \"\");\n\n  // Bigfoot footnotes\n  var bigfoot = $.bigfoot({\n    actionOriginalFN: \"delete\",\n    buttonMarkup:\n      '<div class=\"bigfoot-footnote__container\">' +\n      ' <button href=\"#\" class=\"bigfoot-footnote__button\" rel=\"footnote\"' +\n      ' id=\"{{SUP:data-footnote-backlink-ref}}\"' +\n      ' data-footnote-number=\"{{FOOTNOTENUM}}\"' +\n      ' data-footnote-identifier=\"{{FOOTNOTEID}}\"' +\n      ' title=\"See footnote {{FOOTNOTENUM}}\"' +\n      ' data-bigfoot-footnote=\"{{FOOTNOTECONTENT}}\">' +\n      ' <span class=\"visually-hidden\">{{FOOTNOTENUM}}</span>' +\n      \" </button>\" +\n      \"</div>\"\n  });\n\n  // Page cover object-fit fix\n  var userAgent, ieReg, ie;\n  userAgent = window.navigator.userAgent;\n  ieReg = /msie|Trident.*rv[ :]*11\\./gi;\n  ie = ieReg.test(userAgent);\n\n  if (ie) {\n    $(\".page__cover\").each(function() {\n      var $container = $(this),\n        imgUrl = $container.find(\"img\").prop(\"src\");\n      if (imgUrl) {\n        $container\n          .css(\"backgroundImage\", \"url(\" + imgUrl + \")\")\n          .addClass(\"custom-object-fit\");\n      }\n    });\n  }\n});\n\n// Animate sidebar menu items\nvar menuItems = document.querySelectorAll(\"#menu-main-navigation li\");\n\n// Get vendor transition property\nvar docElemStyle = document.documentElement.style;\nvar transitionProp =\n  typeof docElemStyle.transition == \"string\"\n    ? \"transition\"\n    : \"WebkitTransition\";\n\nfunction animateMenuItems() {\n  for (var i = 0; i < menuItems.length; i++) {\n    var item = menuItems[i];\n    // Stagger transition with transitionDelay\n    item.style[transitionProp + \"Delay\"] = i * 75 + \"ms\";\n    item.classList.toggle(\"is--moved\");\n  }\n}\n\nvar myHeader = document.querySelector(\".site__header\");\nvar myMenu = document.querySelector(\".menu__overlay\");\nvar myToggle = document.querySelector(\".menu__toggle\");\n\n// Toggle overlay visibility\nfunction toggleClassMenu() {\n  myMenu.classList.add(\"is--animatable\");\n  if (!myMenu.classList.contains(\"is--visible\")) {\n    myHeader.classList.add(\"is--inverted\");\n    myMenu.classList.add(\"is--visible\");\n    myToggle.classList.add(\"open\");\n  } else {\n    myHeader.classList.remove(\"is--inverted\");\n    myMenu.classList.remove(\"is--visible\");\n    myToggle.classList.remove(\"open\");\n  }\n}\n\nfunction MenuOnTransitionEnd() {\n  myMenu.classList.remove(\"is--animatable\");\n}\n\nmyMenu.addEventListener(\"transitionend\", MenuOnTransitionEnd, false);\nmyToggle.addEventListener(\n  \"click\",\n  function() {\n    toggleClassMenu();\n    animateMenuItems();\n  },\n  false\n);\n\n// Static comments\n(function($) {\n  $(\"#comment-form\").submit(function() {\n    var form = this;\n\n    $(form).addClass(\"disabled\");\n    $(\"#comment-form-submit\").html(\n      '<svg class=\"icon spin\"><use xlink:href=\"/assets/icons/icons.svg#icon-loading\"></use></svg> Loading...'\n    );\n\n    $.ajax({\n      type: $(this).attr(\"method\"),\n      url: $(this).attr(\"action\"),\n      data: $(this).serialize(),\n      contentType: \"application/x-www-form-urlencoded\",\n      success: function(data) {\n        $(\"#comment-form-submit\")\n          .html(\"Submitted\")\n          .addClass(\"btn--disabled\");\n        $(\"#comment-form .js-notice\")\n          .removeClass(\"danger\")\n          .addClass(\"success\");\n        showAlert(\n          '<strong>Thanks for your comment!</strong> It is <a href=\"https://github.com/mmistakes/made-mistakes-jekyll/pulls\">currently pending</a> and will show on the site once approved.'\n        );\n      },\n      error: function(err) {\n        console.log(err);\n        $(\"#comment-form-submit\").html(\"Submit Comment\");\n        $(\"#comment-form .js-notice\")\n          .removeClass(\"success\")\n          .addClass(\"danger\");\n        showAlert(\n          \"<strong>Sorry, there was an error with your submission.</strong> Please make sure all required fields have been completed and try again.\"\n        );\n        $(form).removeClass(\"disabled\");\n      }\n    });\n\n    return false;\n  });\n\n  function showAlert(message) {\n    $(\"#comment-form .js-notice\").removeClass(\"hidden\");\n    $(\"#comment-form .js-notice-text\").html(message);\n  }\n})(jQuery);\n\n// Staticman comment replies\n// modified from Wordpress https://core.svn.wordpress.org/trunk/wp-includes/js/comment-reply.js\n// Released under the GNU General Public License - https://wordpress.org/about/gpl/\nvar addComment = {\n  moveForm: function(commId, parentId, respondId, postId) {\n    var div,\n      element,\n      style,\n      cssHidden,\n      t = this,\n      comm = t.I(commId),\n      respond = t.I(respondId),\n      cancel = t.I(\"cancel-comment-reply-link\"),\n      parent = t.I(\"comment-replying-to\"),\n      post = t.I(\"comment-post-slug\"),\n      commentForm = respond.getElementsByTagName(\"form\")[0];\n\n    if (!comm || !respond || !cancel || !parent || !commentForm) {\n      return;\n    }\n\n    t.respondId = respondId;\n    postId = postId || false;\n\n    if (!t.I(\"sm-temp-form-div\")) {\n      div = document.createElement(\"div\");\n      div.id = \"sm-temp-form-div\";\n      div.style.display = \"none\";\n      respond.parentNode.insertBefore(div, respond);\n    }\n\n    comm.parentNode.insertBefore(respond, comm.nextSibling);\n    if (post && postId) {\n      post.value = postId;\n    }\n    parent.value = parentId;\n    cancel.style.display = \"\";\n\n    cancel.onclick = function() {\n      var t = addComment,\n        temp = t.I(\"sm-temp-form-div\"),\n        respond = t.I(t.respondId);\n\n      if (!temp || !respond) {\n        return;\n      }\n\n      t.I(\"comment-replying-to\").value = null;\n      temp.parentNode.insertBefore(respond, temp);\n      temp.parentNode.removeChild(temp);\n      this.style.display = \"none\";\n      this.onclick = null;\n      return false;\n    };\n\n    /*\n     * Set initial focus to the first form focusable element.\n     * Try/catch used just to avoid errors in IE 7- which return visibility\n     * 'inherit' when the visibility value is inherited from an ancestor.\n     */\n    try {\n      for (var i = 0; i < commentForm.elements.length; i++) {\n        element = commentForm.elements[i];\n        cssHidden = false;\n\n        // Modern browsers.\n        if (\"getComputedStyle\" in window) {\n          style = window.getComputedStyle(element);\n          // IE 8.\n        } else if (document.documentElement.currentStyle) {\n          style = element.currentStyle;\n        }\n\n        /*\n         * For display none, do the same thing jQuery does. For visibility,\n         * check the element computed style since browsers are already doing\n         * the job for us. In fact, the visibility computed style is the actual\n         * computed value and already takes into account the element ancestors.\n         */\n        if (\n          (element.offsetWidth <= 0 && element.offsetHeight <= 0) ||\n          style.visibility === \"hidden\"\n        ) {\n          cssHidden = true;\n        }\n\n        // Skip form elements that are hidden or disabled.\n        if (\"hidden\" === element.type || element.disabled || cssHidden) {\n          continue;\n        }\n\n        element.focus();\n        // Stop after the first focusable element.\n        break;\n      }\n    } catch (er) {}\n\n    return false;\n  },\n\n  I: function(id) {\n    return document.getElementById(id);\n  }\n};\n"
  },
  {
    "path": "src/assets/javascripts/plugins/bigfoot.js",
    "content": "(function() {\n  (function($) {\n    return $.bigfoot = function(options) {\n      var addBreakpoint, baseFontSize, bigfoot, buttonHover, calculatePixelDimension, cleanFootnoteLinks, clickButton, createPopover, defaults, deleteEmptyOrHR, escapeKeypress, footnoteInit, getSetting, makeDefaultCallbacks, popoverStates, positionTooltip, removeBackLinks, removeBreakpoint, removePopovers, replaceWithReferenceAttributes, repositionFeet, roomCalc, settings, touchClick, unhoverFeet, updateSetting, viewportDetails;\n      bigfoot = void 0;\n      defaults = {\n        actionOriginalFN: \"hide\",\n        activateCallback: function() {},\n        activateOnHover: false,\n        allowMultipleFN: false,\n        anchorPattern: /(fn|footnote|note)[:\\-_\\d]/gi,\n        anchorParentTagname: 'sup',\n        breakpoints: {},\n        deleteOnUnhover: false,\n        footnoteParentClass: 'footnote',\n        footnoteTagname: 'li',\n        hoverDelay: 250,\n        numberResetSelector: void 0,\n        popoverDeleteDelay: 300,\n        popoverCreateDelay: 100,\n        positionContent: true,\n        preventPageScroll: true,\n        scope: false,\n        useFootnoteOnlyOnce: true,\n        contentMarkup: \"<aside class='bigfoot-footnote is-positioned-bottom' data-footnote-number='{{FOOTNOTENUM}}' data-footnote-identifier='{{FOOTNOTEID}}' alt='Footnote {{FOOTNOTENUM}}'> <div class='bigfoot-footnote__wrapper'> <div class='bigfoot-footnote__content'> {{FOOTNOTECONTENT}} </div></div> <div class='bigfoot-footnote__tooltip'></div> </aside>\",\n        buttonMarkup: \"<div class='bigfoot-footnote__container'> <button class='bigfoot-footnote__button' id='{{SUP:data-footnote-backlink-ref}}' data-footnote-number='{{FOOTNOTENUM}}' data-footnote-identifier='{{FOOTNOTEID}}' alt='See Footnote {{FOOTNOTENUM}}' rel='footnote' data-bigfoot-footnote='{{FOOTNOTECONTENT}}'> <svg class='bigfoot-footnote__button__circle' viewbox='0 0 6 6' preserveAspectRatio='xMinYMin'><circle r='3' cx='3' cy='3' fill='white'></circle></svg> <svg class='bigfoot-footnote__button__circle' viewbox='0 0 6 6' preserveAspectRatio='xMinYMin'><circle r='3' cx='3' cy='3' fill='white'></circle></svg> <svg class='bigfoot-footnote__button__circle' viewbox='0 0 6 6' preserveAspectRatio='xMinYMin'><circle r='3' cx='3' cy='3' fill='white'></circle></svg> </button></div>\"\n      };\n      settings = $.extend(defaults, options);\n      popoverStates = {};\n      footnoteInit = function() {\n        var $curResetElement, $currentLastFootnoteLink, $footnoteAnchors, $footnoteButton, $lastResetElement, $parent, $relevantFNLink, $relevantFootnote, finalFNLinks, footnoteButton, footnoteButtonSearchQuery, footnoteContent, footnoteIDNum, footnoteLinks, footnoteNum, footnotes, i, _i, _ref, _results;\n        footnoteButtonSearchQuery = settings.scope ? \"\" + settings.scope + \" a[href*='#']\" : \"a[href*='#']\";\n        $footnoteAnchors = $(footnoteButtonSearchQuery).filter(function() {\n          var $this, relAttr;\n          $this = $(this);\n          relAttr = $this.attr(\"rel\");\n          if (relAttr === \"null\" || (relAttr == null)) {\n            relAttr = \"\";\n          }\n          return (\"\" + ($this.attr(\"href\")) + relAttr).match(settings.anchorPattern) && $this.closest(\"[class*=\" + settings.footnoteParentClass + \"]:not(a):not(\" + settings.anchorParentTagname + \")\").length < 1;\n        });\n        footnotes = [];\n        footnoteLinks = [];\n        finalFNLinks = [];\n        cleanFootnoteLinks($footnoteAnchors, footnoteLinks);\n        $(footnoteLinks).each(function() {\n          var $closestFootnoteEl, relatedFN;\n          relatedFN = $(this).data(\"footnote-ref\").replace(/[:.+~*\\]\\[]/g, \"\\\\$&\");\n          if (settings.useFootnoteOnlyOnce) {\n            relatedFN = \"\" + relatedFN + \":not(.footnote-processed)\";\n          }\n          $closestFootnoteEl = $(relatedFN).closest(settings.footnoteTagname);\n          if ($closestFootnoteEl.length > 0) {\n            footnotes.push($closestFootnoteEl.first().addClass(\"footnote-processed\"));\n            return finalFNLinks.push(this);\n          }\n        });\n        $currentLastFootnoteLink = $(\"[data-footnote-identifier]:last\");\n        footnoteIDNum = $currentLastFootnoteLink.length < 1 ? 0 : +$currentLastFootnoteLink.data(\"footnote-identifier\");\n        _results = [];\n        for (i = _i = 0, _ref = footnotes.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {\n          footnoteContent = removeBackLinks($(footnotes[i]).html().trim(), $(finalFNLinks[i]).data(\"footnote-backlink-ref\"));\n          footnoteContent = footnoteContent.replace(/\"/g, \"&quot;\").replace(/&lt;/g, \"&ltsym;\").replace(/&gt;/g, \"&gtsym;\").replace(/'/g, \"&apos;\");\n          footnoteIDNum += 1;\n          footnoteButton = \"\";\n          $relevantFNLink = $(finalFNLinks[i]);\n          $relevantFootnote = $(footnotes[i]);\n          if (settings.numberResetSelector != null) {\n            $curResetElement = $relevantFNLink.closest(settings.numberResetSelector);\n            if ($curResetElement.is($lastResetElement)) {\n              footnoteNum += 1;\n            } else {\n              footnoteNum = 1;\n            }\n            $lastResetElement = $curResetElement;\n          } else {\n            footnoteNum = footnoteIDNum;\n          }\n          if (footnoteContent.indexOf(\"<\") !== 0) {\n            footnoteContent = \"<p>\" + footnoteContent + \"</p>\";\n          }\n          footnoteButton = settings.buttonMarkup.replace(/\\{\\{FOOTNOTENUM\\}\\}/g, footnoteNum).replace(/\\{\\{FOOTNOTEID\\}\\}/g, footnoteIDNum).replace(/\\{\\{FOOTNOTECONTENT\\}\\}/g, footnoteContent);\n          footnoteButton = replaceWithReferenceAttributes(footnoteButton, \"SUP\", $relevantFNLink);\n          footnoteButton = replaceWithReferenceAttributes(footnoteButton, \"FN\", $relevantFootnote);\n          $footnoteButton = $(footnoteButton).insertBefore($relevantFNLink);\n          $parent = $relevantFootnote.parent();\n          switch (settings.actionOriginalFN.toLowerCase()) {\n            case \"hide\":\n              $relevantFNLink.addClass(\"footnote-print-only\");\n              $relevantFootnote.addClass(\"footnote-print-only\");\n              _results.push(deleteEmptyOrHR($parent));\n              break;\n            case \"delete\":\n              $relevantFNLink.remove();\n              $relevantFootnote.remove();\n              _results.push(deleteEmptyOrHR($parent));\n              break;\n            default:\n              _results.push($relevantFNLink.addClass(\"footnote-print-only\"));\n          }\n        }\n        return _results;\n      };\n      cleanFootnoteLinks = function($footnoteAnchors, footnoteLinks) {\n        var $parent, $supChild, linkHREF, linkID;\n        if (footnoteLinks == null) {\n          footnoteLinks = [];\n        }\n        $parent = void 0;\n        $supChild = void 0;\n        linkHREF = void 0;\n        linkID = void 0;\n        $footnoteAnchors.each(function() {\n          var $child, $this;\n          $this = $(this);\n          linkHREF = \"#\" + ($this.attr(\"href\")).split(\"#\")[1];\n          $parent = $this.closest(settings.anchorParentTagname);\n          $child = $this.find(settings.anchorParentTagname);\n          if ($parent.length > 0) {\n            linkID = ($parent.attr(\"id\") || \"\") + ($this.attr(\"id\") || \"\");\n            return footnoteLinks.push($parent.attr({\n              \"data-footnote-backlink-ref\": linkID,\n              \"data-footnote-ref\": linkHREF\n            }));\n          } else if ($child.length > 0) {\n            linkID = ($child.attr(\"id\") || \"\") + ($this.attr(\"id\") || \"\");\n            return footnoteLinks.push($this.attr({\n              \"data-footnote-backlink-ref\": linkID,\n              \"data-footnote-ref\": linkHREF\n            }));\n          } else {\n            linkID = $this.attr(\"id\") || \"\";\n            return footnoteLinks.push($this.attr({\n              \"data-footnote-backlink-ref\": linkID,\n              \"data-footnote-ref\": linkHREF\n            }));\n          }\n        });\n      };\n      deleteEmptyOrHR = function($el) {\n        var $parent;\n        $parent = void 0;\n        if ($el.is(\":empty\") || $el.children(\":not(.footnote-print-only)\").length === 0) {\n          $parent = $el.parent();\n          if (settings.actionOriginalFN.toLowerCase() === \"delete\") {\n            $el.remove();\n          } else {\n            $el.addClass(\"footnote-print-only\");\n          }\n          return deleteEmptyOrHR($parent);\n        } else if ($el.children(\":not(.footnote-print-only)\").length === $el.children(\"hr:not(.footnote-print-only)\").length) {\n          $parent = $el.parent();\n          if (settings.actionOriginalFN.toLowerCase() === \"delete\") {\n            $el.remove();\n          } else {\n            $el.children(\"hr\").addClass(\"footnote-print-only\");\n            $el.addClass(\"footnote-print-only\");\n          }\n          return deleteEmptyOrHR($parent);\n        }\n      };\n      removeBackLinks = function(footnoteHTML, backlinkID) {\n        var regex;\n        if (backlinkID.indexOf(' ') >= 0) {\n          backlinkID = backlinkID.trim().replace(/\\s+/g, \"|\").replace(/(.*)/g, \"($1)\");\n        }\n        regex = new RegExp(\"(\\\\s|&nbsp;)*<\\\\s*a[^#<]*#\" + backlinkID + \"[^>]*>(.*?)<\\\\s*/\\\\s*a>\", \"g\");\n        return footnoteHTML.replace(regex, \"\").replace(\"[]\", \"\");\n      };\n      replaceWithReferenceAttributes = function(string, referenceKeyword, $referenceElement) {\n        var refMatches, refRegex, refReplaceRegex, refReplaceText;\n        refRegex = new RegExp(\"\\\\{\\\\{\" + referenceKeyword + \":([^\\\\}]*)\\\\}\\\\}\", \"g\");\n        refMatches = void 0;\n        refReplaceText = void 0;\n        refReplaceRegex = void 0;\n        refMatches = refRegex.exec(string);\n        while (refMatches) {\n          if (refMatches[1]) {\n            refReplaceText = $referenceElement.attr(refMatches[1]) || \"\";\n            string = string.replace(\"{{\" + referenceKeyword + \":\" + refMatches[1] + \"}}\", refReplaceText);\n          }\n          refMatches = refRegex.exec(string);\n        }\n        return string;\n      };\n      buttonHover = function(event) {\n        var $buttonHovered, dataIdentifier, otherPopoverSelector;\n        if (settings.activateOnHover) {\n          $buttonHovered = $(event.target).closest(\".bigfoot-footnote__button\");\n          dataIdentifier = \"[data-footnote-identifier='\" + ($buttonHovered.attr(\"data-footnote-identifier\")) + \"']\";\n          if ($buttonHovered.hasClass(\"is-active\")) {\n            return;\n          }\n          $buttonHovered.addClass(\"is-hover-instantiated\");\n          if (!settings.allowMultipleFN) {\n            otherPopoverSelector = \".bigfoot-footnote:not(\" + dataIdentifier + \")\";\n            removePopovers(otherPopoverSelector);\n          }\n          createPopover(\".bigfoot-footnote__button\" + dataIdentifier).addClass(\"is-hover-instantiated\");\n        }\n      };\n      touchClick = function(event) {\n        var $nearButton, $nearFootnote, $target;\n        $target = $(event.target);\n        $nearButton = $target.closest(\".bigfoot-footnote__button\");\n        $nearFootnote = $target.closest(\".bigfoot-footnote\");\n        if ($nearButton.length > 0) {\n          event.preventDefault();\n          clickButton($nearButton);\n        } else if ($nearFootnote.length < 1) {\n          if ($(\".bigfoot-footnote\").length > 0) {\n            removePopovers();\n          }\n        }\n      };\n      clickButton = function($button) {\n        var dataIdentifier;\n        $button.blur();\n        dataIdentifier = \"data-footnote-identifier='\" + ($button.attr(\"data-footnote-identifier\")) + \"'\";\n        if ($button.hasClass(\"changing\")) {\n          return;\n        } else if (!$button.hasClass(\"is-active\")) {\n          $button.addClass(\"changing\");\n          setTimeout((function() {\n            return $button.removeClass(\"changing\");\n          }), settings.popoverCreateDelay);\n          createPopover(\".bigfoot-footnote__button[\" + dataIdentifier + \"]\");\n          $button.addClass(\"is-click-instantiated\");\n          if (!settings.allowMultipleFN) {\n            removePopovers(\".bigfoot-footnote:not([\" + dataIdentifier + \"])\");\n          }\n        } else {\n          if (!settings.allowMultipleFN) {\n            removePopovers();\n          } else {\n            removePopovers(\".bigfoot-footnote[\" + dataIdentifier + \"]\");\n          }\n        }\n      };\n      createPopover = function(selector) {\n        var $buttons, $popoversCreated;\n        $buttons = void 0;\n        if (typeof selector !== \"string\" && settings.allowMultipleFN) {\n          $buttons = selector;\n        } else if (typeof selector !== \"string\") {\n          $buttons = selector.first();\n        } else if (settings.allowMultipleFN) {\n          $buttons = $(selector).closest(\".bigfoot-footnote__button\");\n        } else {\n          $buttons = $(selector + \":first\").closest(\".bigfoot-footnote__button\");\n        }\n        $popoversCreated = $();\n        $buttons.each(function() {\n          var $content, $contentContainer, $this, content;\n          $this = $(this);\n          content = void 0;\n          try {\n            content = settings.contentMarkup.replace(/\\{\\{FOOTNOTENUM\\}\\}/g, $this.attr(\"data-footnote-number\")).replace(/\\{\\{FOOTNOTEID\\}\\}/g, $this.attr(\"data-footnote-identifier\")).replace(/\\{\\{FOOTNOTECONTENT\\}\\}/g, $this.attr(\"data-bigfoot-footnote\")).replace(/\\&gtsym\\;/g, \"&gt;\").replace(/\\&ltsym\\;/g, \"&lt;\");\n            return content = replaceWithReferenceAttributes(content, \"BUTTON\", $this);\n          } finally {\n            $content = $(content);\n            try {\n              settings.activateCallback($content, $this);\n            } catch (_error) {}\n            $content.insertAfter($buttons);\n            popoverStates[$this.attr(\"data-footnote-identifier\")] = \"init\";\n            $content.attr(\"bigfoot-max-width\", calculatePixelDimension($content.css(\"max-width\"), $content));\n            $content.css(\"max-width\", 10000);\n            $contentContainer = $content.find(\".bigfoot-footnote__content\");\n            $content.attr(\"data-bigfoot-max-height\", calculatePixelDimension($contentContainer.css(\"max-height\"), $contentContainer));\n            repositionFeet();\n            $this.addClass(\"is-active\");\n            $content.find(\".bigfoot-footnote__content\").bindScrollHandler();\n            $popoversCreated = $popoversCreated.add($content);\n          }\n        });\n        setTimeout((function() {\n          return $popoversCreated.addClass(\"is-active\");\n        }), settings.popoverCreateDelay);\n        return $popoversCreated;\n      };\n      baseFontSize = function() {\n        var el, size;\n        el = document.createElement(\"div\");\n        el.style.cssText = \"display:inline-block;padding:0;line-height:1;position:absolute;visibility:hidden;font-size:1em;\";\n        el.appendChild(document.createElement(\"M\"));\n        document.body.appendChild(el);\n        size = el.offsetHeight;\n        document.body.removeChild(el);\n        return size;\n      };\n      calculatePixelDimension = function(dim, $el) {\n        if (dim === \"none\") {\n          dim = 10000;\n        } else if (dim.indexOf(\"rem\") >= 0) {\n          dim = parseFloat(dim) * baseFontSize();\n        } else if (dim.indexOf(\"em\") >= 0) {\n          dim = parseFloat(dim) * parseFloat($el.css(\"font-size\"));\n        } else if (dim.indexOf(\"px\") >= 0) {\n          dim = parseFloat(dim);\n          if (dim <= 60) {\n            dim = dim / parseFloat($el.parent().css(\"width\"));\n          }\n        } else if (dim.indexOf(\"%\") >= 0) {\n          dim = parseFloat(dim) / 100;\n        }\n        return dim;\n      };\n      $.fn.bindScrollHandler = function() {\n        if (!settings.preventPageScroll) {\n          return $(this);\n        }\n        $(this).on(\"DOMMouseScroll mousewheel\", function(event) {\n          var $popover, $this, delta, height, prevent, scrollHeight, scrollTop, up;\n          $this = $(this);\n          scrollTop = $this.scrollTop();\n          scrollHeight = $this[0].scrollHeight;\n          height = parseInt($this.css(\"height\"));\n          $popover = $this.closest(\".bigfoot-footnote\");\n          if ($this.scrollTop() > 0 && $this.scrollTop() < 10) {\n            $popover.addClass(\"is-scrollable\");\n          }\n          if (!$popover.hasClass(\"is-scrollable\")) {\n            return;\n          }\n          delta = event.type === \"DOMMouseScroll\" ? event.originalEvent.detail * -40 : event.originalEvent.wheelDelta;\n          up = delta > 0;\n          prevent = function() {\n            event.stopPropagation();\n            event.preventDefault();\n            event.returnValue = false;\n            return false;\n          };\n          if (!up && -delta > scrollHeight - height - scrollTop) {\n            $this.scrollTop(scrollHeight);\n            $popover.addClass(\"is-fully-scrolled\");\n            return prevent();\n          } else if (up && delta > scrollTop) {\n            $this.scrollTop(0);\n            $popover.removeClass(\"is-fully-scrolled\");\n            return prevent();\n          } else {\n            return $popover.removeClass(\"is-fully-scrolled\");\n          }\n        });\n        return $(this);\n      };\n      unhoverFeet = function(e) {\n        if (settings.deleteOnUnhover && settings.activateOnHover) {\n          return setTimeout((function() {\n            var $target;\n            $target = $(e.target).closest(\".bigfoot-footnote, .bigfoot-footnote__button\");\n            if ($(\".bigfoot-footnote__button:hover, .bigfoot-footnote:hover\").length < 1) {\n              return removePopovers();\n            }\n          }), settings.hoverDelay);\n        }\n      };\n      escapeKeypress = function(event) {\n        if (event.keyCode === 27) {\n          return removePopovers();\n        }\n      };\n      removePopovers = function(footnotes, timeout) {\n        var $buttonsClosed, $linkedButton, $this, footnoteID;\n        if (footnotes == null) {\n          footnotes = \".bigfoot-footnote\";\n        }\n        if (timeout == null) {\n          timeout = settings.popoverDeleteDelay;\n        }\n        $buttonsClosed = $();\n        footnoteID = void 0;\n        $linkedButton = void 0;\n        $this = void 0;\n        $(footnotes).each(function() {\n          $this = $(this);\n          footnoteID = $this.attr(\"data-footnote-identifier\");\n          $linkedButton = $(\".bigfoot-footnote__button[data-footnote-identifier='\" + footnoteID + \"']\");\n          if (!$linkedButton.hasClass(\"changing\")) {\n            $buttonsClosed = $buttonsClosed.add($linkedButton);\n            $linkedButton.removeClass(\"is-active is-hover-instantiated is-click-instantiated\").addClass(\"changing\");\n            $this.removeClass(\"is-active\").addClass(\"disapearing\");\n            return setTimeout((function() {\n              $this.remove();\n              delete popoverStates[footnoteID];\n              return $linkedButton.removeClass(\"changing\");\n            }), timeout);\n          }\n        });\n        return $buttonsClosed;\n      };\n      repositionFeet = function(e) {\n        var type;\n        if (settings.positionContent) {\n          type = e ? e.type : \"resize\";\n          $(\".bigfoot-footnote\").each(function() {\n            var $button, $contentWrapper, $mainWrap, $this, dataIdentifier, identifier, lastState, marginSize, maxHeightInCSS, maxHeightOnScreen, maxWidth, maxWidthInCSS, positionOnTop, relativeToWidth, roomLeft, totalHeight;\n            $this = $(this);\n            identifier = $this.attr(\"data-footnote-identifier\");\n            dataIdentifier = \"data-footnote-identifier='\" + identifier + \"'\";\n            $contentWrapper = $this.find(\".bigfoot-footnote__content\");\n            $button = $this.siblings(\".bigfoot-footnote__button\");\n            roomLeft = roomCalc($button);\n            marginSize = parseFloat($this.css(\"margin-top\"));\n            maxHeightInCSS = +($this.attr(\"data-bigfoot-max-height\"));\n            totalHeight = 2 * marginSize + $this.outerHeight();\n            maxHeightOnScreen = 10000;\n            positionOnTop = roomLeft.bottomRoom < totalHeight && roomLeft.topRoom > roomLeft.bottomRoom;\n            lastState = popoverStates[identifier];\n            if (positionOnTop) {\n              if (lastState !== \"top\") {\n                popoverStates[identifier] = \"top\";\n                $this.addClass(\"is-positioned-top\").removeClass(\"is-positioned-bottom\");\n                $this.css(\"transform-origin\", (roomLeft.leftRelative * 100) + \"% 100%\");\n              }\n              maxHeightOnScreen = roomLeft.topRoom - marginSize - 15;\n            } else {\n              if (lastState !== \"bottom\" || lastState === \"init\") {\n                popoverStates[identifier] = \"bottom\";\n                $this.removeClass(\"is-positioned-top\").addClass(\"is-positioned-bottom\");\n                $this.css(\"transform-origin\", (roomLeft.leftRelative * 100) + \"% 0%\");\n              }\n              maxHeightOnScreen = roomLeft.bottomRoom - marginSize - 15;\n            }\n            $this.find(\".bigfoot-footnote__content\").css({\n              \"max-height\": Math.min(maxHeightOnScreen, maxHeightInCSS) + \"px\"\n            });\n            if (type === \"resize\") {\n              maxWidthInCSS = parseFloat($this.attr(\"bigfoot-max-width\"));\n              $mainWrap = $this.find(\".bigfoot-footnote__wrapper\");\n              maxWidth = maxWidthInCSS;\n              if (maxWidthInCSS <= 1) {\n                relativeToWidth = (function() {\n                  var jq, userSpecifiedRelativeElWidth;\n                  userSpecifiedRelativeElWidth = 10000;\n                  if (settings.maxWidthRelativeTo) {\n                    jq = $(settings.maxWidthRelativeTo);\n                    if (jq.length > 0) {\n                      userSpecifiedRelativeElWidth = jq.outerWidth();\n                    }\n                  }\n                  return Math.min(window.innerWidth, userSpecifiedRelativeElWidth);\n                })();\n                maxWidth = relativeToWidth * maxWidthInCSS;\n              }\n              maxWidth = Math.min(maxWidth, $this.find(\".bigfoot-footnote__content\").outerWidth() + 1);\n              $mainWrap.css(\"max-width\", maxWidth + \"px\");\n              $this.css({\n                left: (-roomLeft.leftRelative * maxWidth + parseFloat($button.css(\"margin-left\")) + $button.outerWidth() / 2) + \"px\"\n              });\n              positionTooltip($this, roomLeft.leftRelative);\n            }\n            if (parseInt($this.outerHeight()) < $this.find(\".bigfoot-footnote__content\")[0].scrollHeight) {\n              return $this.addClass(\"is-scrollable\");\n            }\n          });\n        }\n      };\n      positionTooltip = function($popover, leftRelative) {\n        var $tooltip;\n        if (leftRelative == null) {\n          leftRelative = 0.5;\n        }\n        $tooltip = $popover.find(\".bigfoot-footnote__tooltip\");\n        if ($tooltip.length > 0) {\n          $tooltip.css(\"left\", \"\" + (leftRelative * 100) + \"%\");\n        }\n      };\n      roomCalc = function($el) {\n        var elHeight, elLeftMargin, elWidth, leftRoom, topRoom, w;\n        elLeftMargin = parseFloat($el.css(\"margin-left\"));\n        elWidth = parseFloat($el.outerWidth()) - elLeftMargin;\n        elHeight = parseFloat($el.outerHeight());\n        w = viewportDetails();\n        topRoom = $el.offset().top - w.scrollY + elHeight / 2;\n        leftRoom = $el.offset().left - w.scrollX + elWidth / 2;\n        return {\n          topRoom: topRoom,\n          bottomRoom: w.height - topRoom,\n          leftRoom: leftRoom,\n          rightRoom: w.width - leftRoom,\n          leftRelative: leftRoom / w.width,\n          topRelative: topRoom / w.height\n        };\n      };\n      viewportDetails = function() {\n        var $window;\n        $window = $(window);\n        return {\n          width: window.innerWidth,\n          height: window.innerHeight,\n          scrollX: $window.scrollLeft(),\n          scrollY: $window.scrollTop()\n        };\n      };\n      addBreakpoint = function(size, trueCallback, falseCallback, deleteDelay, removeOpen) {\n        var falseDefaultPositionSetting, minMax, mqListener, mql, query, s, trueDefaultPositionSetting;\n        if (deleteDelay == null) {\n          deleteDelay = settings.popoverDeleteDelay;\n        }\n        if (removeOpen == null) {\n          removeOpen = true;\n        }\n        mql = void 0;\n        minMax = void 0;\n        s = void 0;\n        if (typeof size === \"string\") {\n          s = size.toLowerCase() === \"iphone\" ? \"<320px\" : size.toLowerCase() === \"ipad\" ? \"<768px\" : size;\n          minMax = s.charAt(0) === \">\" ? \"min\" : s.charAt(0) === \"<\" ? \"max\" : null;\n          query = minMax ? \"(\" + minMax + \"-width: \" + (s.substring(1)) + \")\" : s;\n          mql = window.matchMedia(query);\n        } else {\n          mql = size;\n        }\n        if (mql.media && mql.media === \"invalid\") {\n          return {\n            added: false,\n            mq: mql,\n            listener: null\n          };\n        }\n        trueDefaultPositionSetting = minMax === \"min\";\n        falseDefaultPositionSetting = minMax === \"max\";\n        trueCallback = trueCallback || makeDefaultCallbacks(removeOpen, deleteDelay, trueDefaultPositionSetting, function($popover) {\n          return $popover.addClass(\"is-bottom-fixed\");\n        });\n        falseCallback = falseCallback || makeDefaultCallbacks(removeOpen, deleteDelay, falseDefaultPositionSetting, function() {});\n        mqListener = function(mq) {\n          if (mq.matches) {\n            trueCallback(removeOpen, bigfoot);\n          } else {\n            falseCallback(removeOpen, bigfoot);\n          }\n        };\n        mql.addListener(mqListener);\n        mqListener(mql);\n        settings.breakpoints[size] = {\n          added: true,\n          mq: mql,\n          listener: mqListener\n        };\n        return settings.breakpoints[size];\n      };\n      makeDefaultCallbacks = function(removeOpen, deleteDelay, position, callback) {\n        return function(removeOpen, bigfoot) {\n          var $closedPopovers;\n          $closedPopovers = void 0;\n          if (removeOpen) {\n            $closedPopovers = bigfoot.close();\n            bigfoot.updateSetting(\"activateCallback\", callback);\n          }\n          return setTimeout((function() {\n            bigfoot.updateSetting(\"positionContent\", position);\n            if (removeOpen) {\n              return bigfoot.activate($closedPopovers);\n            }\n          }), deleteDelay);\n        };\n      };\n      removeBreakpoint = function(target, callback) {\n        var b, breakpoint, mq, mqFound;\n        mq = null;\n        b = void 0;\n        mqFound = false;\n        if (typeof target === \"string\") {\n          mqFound = settings.breakpoints[target] !== undefined;\n        } else {\n          for (b in settings.breakpoints) {\n            if (settings.breakpoints.hasOwnProperty(b) && settings.breakpoints[b].mq === target) {\n              mqFound = true;\n            }\n          }\n        }\n        if (mqFound) {\n          breakpoint = settings.breakpoints[b || target];\n          if (callback) {\n            callback({\n              matches: false\n            });\n          } else {\n            breakpoint.listener({\n              matches: false\n            });\n          }\n          breakpoint.mq.removeListener(breakpoint.listener);\n          delete settings.breakpoints[b || target];\n        }\n        return mqFound;\n      };\n      updateSetting = function(newSettings, value) {\n        var oldValue, prop;\n        oldValue = void 0;\n        if (typeof newSettings === \"string\") {\n          oldValue = settings[newSettings];\n          settings[newSettings] = value;\n        } else {\n          oldValue = {};\n          for (prop in newSettings) {\n            if (newSettings.hasOwnProperty(prop)) {\n              oldValue[prop] = settings[prop];\n              settings[prop] = newSettings[prop];\n            }\n          }\n        }\n        return oldValue;\n      };\n      getSetting = function(setting) {\n        return settings[setting];\n      };\n      $(document).ready(function() {\n        footnoteInit();\n        $(document).on(\"mouseenter\", \".bigfoot-footnote__button\", buttonHover);\n        $(document).on(\"touchend click\", touchClick);\n        $(document).on(\"mouseout\", \".is-hover-instantiated\", unhoverFeet);\n        $(document).on(\"keyup\", escapeKeypress);\n        $(window).on(\"scroll resize\", repositionFeet);\n        return $(document).on(\"gestureend\", function() {\n          return repositionFeet();\n        });\n      });\n      bigfoot = {\n        removePopovers: removePopovers,\n        close: removePopovers,\n        createPopover: createPopover,\n        activate: createPopover,\n        repositionFeet: repositionFeet,\n        reposition: repositionFeet,\n        addBreakpoint: addBreakpoint,\n        removeBreakpoint: removeBreakpoint,\n        getSetting: getSetting,\n        updateSetting: updateSetting\n      };\n      return bigfoot;\n    };\n  })(jQuery);\n\n}).call(this);\n"
  },
  {
    "path": "src/assets/javascripts/plugins/lity.js",
    "content": "/*! Lity - v3.0.0-dev - 2018-07-09\n* http://sorgalla.com/lity/\n* Copyright (c) 2015-2018 Jan Sorgalla; Licensed MIT */\n(function(window, factory) {\n  if (typeof define === 'function' && define.amd) {\n      define(['jquery'], function($) {\n          return factory(window, $);\n      });\n  } else if (typeof module === 'object' && typeof module.exports === 'object') {\n      module.exports = factory(window, require('jquery'));\n  } else {\n      window.lity = factory(window, window.jQuery || window.Zepto);\n  }\n}(typeof window !== \"undefined\" ? window : this, function(window, $) {\n  'use strict';\n\n  var document = window.document;\n\n  var _win = $(window);\n  var _deferred = $.Deferred;\n  var _html = $('html');\n  var _instances = [];\n\n  var _attrAriaHidden = 'aria-hidden';\n  var _dataAriaHidden = 'lity-' + _attrAriaHidden;\n\n  var _focusableElementsSelector = 'a[href],area[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),button:not([disabled]),iframe,object,embed,[contenteditable],[tabindex]:not([tabindex^=\"-\"])';\n\n  var _defaultOptions = {\n      esc: true,\n      handler: null,\n      handlers: {\n          image: imageHandler,\n          inline: inlineHandler,\n          iframe: iframeHandler\n      },\n      template: '<div class=\"lity\" role=\"dialog\" aria-label=\"Dialog Window (Press escape to close)\" tabindex=\"-1\"><div class=\"lity-wrap\" data-lity-close role=\"document\"><div class=\"lity-loader\" aria-hidden=\"true\">Loading...</div><div class=\"lity-container\"><div class=\"lity-content\"></div><button class=\"lity-close\" type=\"button\" aria-label=\"Close (Press escape to close)\" data-lity-close>&times;</button></div></div></div>'\n  };\n\n  var _imageRegexp = /(^data:image\\/)|(\\.(png|jpe?g|gif|svg|webp|bmp|ico|tiff?)(\\?\\S*)?$)/i;\n\n  var _transitionEndEvent = (function() {\n      var el = document.createElement('div');\n\n      var transEndEventNames = {\n          WebkitTransition: 'webkitTransitionEnd',\n          MozTransition: 'transitionend',\n          OTransition: 'oTransitionEnd otransitionend',\n          transition: 'transitionend'\n      };\n\n      for (var name in transEndEventNames) {\n          if (el.style[name] !== undefined) {\n              return transEndEventNames[name];\n          }\n      }\n\n      return false;\n  })();\n\n  function transitionEnd(element) {\n      var deferred = _deferred();\n\n      if (!_transitionEndEvent || !element.length) {\n          deferred.resolve();\n      } else {\n          element.one(_transitionEndEvent, deferred.resolve);\n          setTimeout(deferred.resolve, 500);\n      }\n\n      return deferred.promise();\n  }\n\n  function settings(currSettings, key, value) {\n      if (arguments.length === 1) {\n          return $.extend({}, currSettings);\n      }\n\n      if (typeof key === 'string') {\n          if (typeof value === 'undefined') {\n              return typeof currSettings[key] === 'undefined'\n                  ? null\n                  : currSettings[key];\n          }\n\n          currSettings[key] = value;\n      } else {\n          $.extend(currSettings, key);\n      }\n\n      return this;\n  }\n\n  function parseQueryParams(params) {\n      var pos = params.indexOf('?');\n\n      if (pos > -1) {\n          params = params.substr(pos + 1);\n      }\n\n      var pairs = decodeURI(params.split('#')[0]).split('&');\n      var obj = {}, p;\n\n      for (var i = 0, n = pairs.length; i < n; i++) {\n          if (!pairs[i]) {\n              continue;\n          }\n\n          p = pairs[i].split('=');\n          obj[p[0]] = p[1];\n      }\n\n      return obj;\n  }\n\n  function appendQueryParams(url, params) {\n      if (!params) {\n          return url;\n      }\n\n      if ('string' === $.type(params)) {\n          params = parseQueryParams(params);\n      }\n\n      if (url.indexOf('?') > -1) {\n          var split = url.split('?');\n          url = split.shift();\n\n          params = $.extend(\n              {},\n              parseQueryParams(split[0]),\n              params\n          )\n      }\n\n      return url + '?' + $.param(params);\n  }\n\n  function transferHash(originalUrl, newUrl) {\n      var pos = originalUrl.indexOf('#');\n\n      if (-1 === pos) {\n          return newUrl;\n      }\n\n      if (pos > 0) {\n          originalUrl = originalUrl.substr(pos);\n      }\n\n      return newUrl + originalUrl;\n  }\n\n  function iframe(iframeUrl, instance, queryParams, hashUrl) {\n      instance && instance.element().addClass('lity-iframe');\n\n      if (queryParams) {\n          iframeUrl = appendQueryParams(iframeUrl, queryParams);\n      }\n\n      if (hashUrl) {\n          iframeUrl = transferHash(hashUrl, iframeUrl);\n      }\n\n      return '<div class=\"lity-iframe-container\"><iframe frameborder=\"0\" allowfullscreen src=\"' + iframeUrl + '\"/></div>';\n  }\n\n  function error(msg) {\n      return $('<span class=\"lity-error\"/>').append(msg);\n  }\n\n  function imageHandler(target, instance) {\n      var desc = (instance.opener() && instance.opener().data('lity-desc')) || 'Image with no description';\n      var img = $('<img src=\"' + target + '\" alt=\"' + desc + '\"/>');\n      var deferred = _deferred();\n      var failed = function() {\n          deferred.reject(error('Failed loading image'));\n      };\n\n      img\n          .on('load', function() {\n              if (this.naturalWidth === 0) {\n                  return failed();\n              }\n\n              deferred.resolve(img);\n          })\n          .on('error', failed)\n      ;\n\n      return deferred.promise();\n  }\n\n  imageHandler.test = function(target) {\n      return _imageRegexp.test(target);\n  };\n\n  function inlineHandler(target, instance) {\n      var el, placeholder, hasHideClass;\n\n      try {\n          el = $(target);\n      } catch (e) {\n          return false;\n      }\n\n      if (!el.length) {\n          return false;\n      }\n\n      placeholder = $('<i style=\"display:none !important\"/>');\n      hasHideClass = el.hasClass('lity-hide');\n\n      instance\n          .element()\n          .one('lity:remove', function() {\n              placeholder\n                  .before(el)\n                  .remove()\n              ;\n\n              if (hasHideClass && !el.closest('.lity-content').length) {\n                  el.addClass('lity-hide');\n              }\n          })\n      ;\n\n      return el\n          .removeClass('lity-hide')\n          .after(placeholder)\n      ;\n  }\n\n  function iframeHandler(target, instance) {\n      return iframe(target, instance);\n  }\n\n  function winHeight() {\n      return document.documentElement.clientHeight\n          ? document.documentElement.clientHeight\n          : Math.round(_win.height());\n  }\n\n  function keydown(e) {\n      var current = currentInstance();\n\n      if (!current) {\n          return;\n      }\n\n      // ESC key\n      if (e.keyCode === 27 && !!current.options('esc')) {\n          current.close();\n      }\n\n      // TAB key\n      if (e.keyCode === 9) {\n          handleTabKey(e, current);\n      }\n  }\n\n  function handleTabKey(e, instance) {\n      var focusableElements = instance.element().find(_focusableElementsSelector);\n      var focusedIndex = focusableElements.index(document.activeElement);\n\n      if (e.shiftKey && focusedIndex <= 0) {\n          focusableElements.get(focusableElements.length - 1).focus();\n          e.preventDefault();\n      } else if (!e.shiftKey && focusedIndex === focusableElements.length - 1) {\n          focusableElements.get(0).focus();\n          e.preventDefault();\n      }\n  }\n\n  function resize() {\n      $.each(_instances, function(i, instance) {\n          instance.resize();\n      });\n  }\n\n  function registerInstance(instanceToRegister) {\n      if (1 === _instances.unshift(instanceToRegister)) {\n          _html.addClass('lity-active');\n\n          _win\n              .on({\n                  resize: resize,\n                  keydown: keydown\n              })\n          ;\n      }\n\n      $('body > *').not(instanceToRegister.element())\n          .addClass('lity-hidden')\n          .each(function() {\n              var el = $(this);\n\n              if (undefined !== el.data(_dataAriaHidden)) {\n                  return;\n              }\n\n              el.data(_dataAriaHidden, el.attr(_attrAriaHidden) || null);\n          })\n          .attr(_attrAriaHidden, 'true')\n      ;\n  }\n\n  function removeInstance(instanceToRemove) {\n      var show;\n\n      instanceToRemove\n          .element()\n          .attr(_attrAriaHidden, 'true')\n      ;\n\n      if (1 === _instances.length) {\n          _html.removeClass('lity-active');\n\n          _win\n              .off({\n                  resize: resize,\n                  keydown: keydown\n              })\n          ;\n      }\n\n      _instances = $.grep(_instances, function(instance) {\n          return instanceToRemove !== instance;\n      });\n\n      if (!!_instances.length) {\n          show = _instances[0].element();\n      } else {\n          show = $('.lity-hidden');\n      }\n\n      show\n          .removeClass('lity-hidden')\n          .each(function() {\n              var el = $(this), oldAttr = el.data(_dataAriaHidden);\n\n              if (!oldAttr) {\n                  el.removeAttr(_attrAriaHidden);\n              } else {\n                  el.attr(_attrAriaHidden, oldAttr);\n              }\n\n              el.removeData(_dataAriaHidden);\n          })\n      ;\n  }\n\n  function currentInstance() {\n      if (0 === _instances.length) {\n          return null;\n      }\n\n      return _instances[0];\n  }\n\n  function factory(target, instance, handlers, preferredHandler) {\n      var handler = 'inline', content;\n\n      var currentHandlers = $.extend({}, handlers);\n\n      if (preferredHandler && currentHandlers[preferredHandler]) {\n          content = currentHandlers[preferredHandler](target, instance);\n          handler = preferredHandler;\n      } else {\n          // Run inline and iframe handlers after all other handlers\n          $.each(['inline', 'iframe'], function(i, name) {\n              delete currentHandlers[name];\n\n              currentHandlers[name] = handlers[name];\n          });\n\n          $.each(currentHandlers, function(name, currentHandler) {\n              // Handler might be \"removed\" by setting callback to null\n              if (!currentHandler) {\n                  return true;\n              }\n\n              if (\n                  currentHandler.test &&\n                  !currentHandler.test(target, instance)\n              ) {\n                  return true;\n              }\n\n              content = currentHandler(target, instance);\n\n              if (false !== content) {\n                  handler = name;\n                  return false;\n              }\n          });\n      }\n\n      return {handler: handler, content: content || ''};\n  }\n\n  function Lity(target, options, opener, activeElement) {\n      var self = this;\n      var result;\n      var isReady = false;\n      var isClosed = false;\n      var element;\n      var content;\n\n      options = $.extend(\n          {},\n          _defaultOptions,\n          options\n      );\n\n      element = $(options.template);\n\n      // -- API --\n\n      self.element = function() {\n          return element;\n      };\n\n      self.opener = function() {\n          return opener;\n      };\n\n      self.content = function() {\n          return content;\n      };\n\n      self.options  = $.proxy(settings, self, options);\n      self.handlers = $.proxy(settings, self, options.handlers);\n\n      self.resize = function() {\n          if (!isReady || isClosed) {\n              return;\n          }\n\n          content\n              .css('max-height', winHeight() + 'px')\n              .trigger('lity:resize', [self])\n          ;\n      };\n\n      self.close = function() {\n          if (!isReady || isClosed) {\n              return;\n          }\n\n          isClosed = true;\n\n          removeInstance(self);\n\n          var deferred = _deferred();\n\n          // We return focus only if the current focus is inside this instance\n          if (\n              activeElement &&\n              (\n                  document.activeElement === element[0] ||\n                  $.contains(element[0], document.activeElement)\n              )\n          ) {\n              try {\n                  activeElement.focus();\n              } catch (e) {\n                  // Ignore exceptions, eg. for SVG elements which can't be\n                  // focused in IE11\n              }\n          }\n\n          content.trigger('lity:close', [self]);\n\n          element\n              .removeClass('lity-opened')\n              .addClass('lity-closed')\n          ;\n\n          transitionEnd(content.add(element))\n              .always(function() {\n                  content.trigger('lity:remove', [self]);\n                  element.remove();\n                  element = undefined;\n                  deferred.resolve();\n              })\n          ;\n\n          return deferred.promise();\n      };\n\n      // -- Initialization --\n\n      result = factory(target, self, options.handlers, options.handler);\n\n      element\n          .attr(_attrAriaHidden, 'false')\n          .addClass('lity-loading lity-opened lity-' + result.handler)\n          .appendTo('body')\n          .focus()\n          .on('click', '[data-lity-close]', function(e) {\n              if ($(e.target).is('[data-lity-close]')) {\n                  self.close();\n              }\n          })\n          .trigger('lity:open', [self])\n      ;\n\n      registerInstance(self);\n\n      $.when(result.content)\n          .always(ready)\n      ;\n\n      function ready(result) {\n          content = $(result)\n              .css('max-height', winHeight() + 'px')\n          ;\n\n          element\n              .find('.lity-loader')\n              .each(function() {\n                  var loader = $(this);\n\n                  transitionEnd(loader)\n                      .always(function() {\n                          loader.remove();\n                      })\n                  ;\n              })\n          ;\n\n          element\n              .removeClass('lity-loading')\n              .find('.lity-content')\n              .empty()\n              .append(content)\n          ;\n\n          isReady = true;\n\n          content\n              .trigger('lity:ready', [self])\n          ;\n      }\n  }\n\n  function lity(target, options, opener) {\n      if (!target.preventDefault) {\n          opener = $(opener);\n      } else {\n          target.preventDefault();\n          opener = $(this);\n          target = opener.data('lity-target') || opener.attr('href') || opener.attr('src');\n      }\n\n      var instance = new Lity(\n          target,\n          $.extend(\n              {},\n              opener.data('lity-options') || opener.data('lity'),\n              options\n          ),\n          opener,\n          document.activeElement\n      );\n\n      if (!target.preventDefault) {\n          return instance;\n      }\n  }\n\n  lity.version  = '3.0.0-dev';\n  lity.options  = $.proxy(settings, lity, _defaultOptions);\n  lity.handlers = $.proxy(settings, lity, _defaultOptions.handlers);\n  lity.current  = currentInstance;\n  lity.iframe   = iframe;\n\n  $(document).on('click.lity', '[data-lity]', lity);\n\n  return lity;\n}));\n"
  },
  {
    "path": "src/assets/javascripts/plugins/ls.bgset.js",
    "content": "(function(){\n\t'use strict';\n\tif(!window.addEventListener){return;}\n\n\tvar regWhite = /\\s+/g;\n\tvar regSplitSet = /\\s*\\|\\s+|\\s+\\|\\s*/g;\n\tvar regSource = /^(.+?)(?:\\s+\\[\\s*(.+?)\\s*\\])?$/;\n\tvar regBgUrlEscape = /\\(|\\)|'/;\n\tvar allowedBackgroundSize = {contain: 1, cover: 1};\n\tvar proxyWidth = function(elem){\n\t\tvar width = lazySizes.gW(elem, elem.parentNode);\n\n\t\tif(!elem._lazysizesWidth || width > elem._lazysizesWidth){\n\t\t\telem._lazysizesWidth = width;\n\t\t}\n\t\treturn elem._lazysizesWidth;\n\t};\n\tvar getBgSize = function(elem){\n\t\tvar bgSize;\n\n\t\tbgSize = (getComputedStyle(elem) || {getPropertyValue: function(){}}).getPropertyValue('background-size');\n\n\t\tif(!allowedBackgroundSize[bgSize] && allowedBackgroundSize[elem.style.backgroundSize]){\n\t\t\tbgSize = elem.style.backgroundSize;\n\t\t}\n\n\t\treturn bgSize;\n\t};\n\tvar createPicture = function(sets, elem, img){\n\t\tvar picture = document.createElement('picture');\n\t\tvar sizes = elem.getAttribute(lazySizesConfig.sizesAttr);\n\t\tvar ratio = elem.getAttribute('data-ratio');\n\t\tvar optimumx = elem.getAttribute('data-optimumx');\n\n\t\tif(elem._lazybgset && elem._lazybgset.parentNode == elem){\n\t\t\telem.removeChild(elem._lazybgset);\n\t\t}\n\n\t\tObject.defineProperty(img, '_lazybgset', {\n\t\t\tvalue: elem,\n\t\t\twritable: true\n\t\t});\n\t\tObject.defineProperty(elem, '_lazybgset', {\n\t\t\tvalue: picture,\n\t\t\twritable: true\n\t\t});\n\n\t\tsets = sets.replace(regWhite, ' ').split(regSplitSet);\n\n\t\tpicture.style.display = 'none';\n\t\timg.className = lazySizesConfig.lazyClass;\n\n\t\tif(sets.length == 1 && !sizes){\n\t\t\tsizes = 'auto';\n\t\t}\n\n\t\tsets.forEach(function(set){\n\t\t\tvar source = document.createElement('source');\n\n\t\t\tif(sizes && sizes != 'auto'){\n\t\t\t\tsource.setAttribute('sizes', sizes);\n\t\t\t}\n\n\t\t\tif(set.match(regSource)){\n\t\t\t\tsource.setAttribute(lazySizesConfig.srcsetAttr, RegExp.$1);\n\t\t\t\tif(RegExp.$2){\n\t\t\t\t\tsource.setAttribute('media', lazySizesConfig.customMedia[RegExp.$2] || RegExp.$2);\n\t\t\t\t}\n\t\t\t}\n\t\t\tpicture.appendChild(source);\n\t\t});\n\n\t\tif(sizes){\n\t\t\timg.setAttribute(lazySizesConfig.sizesAttr, sizes);\n\t\t\telem.removeAttribute(lazySizesConfig.sizesAttr);\n\t\t\telem.removeAttribute('sizes');\n\t\t}\n\t\tif(optimumx){\n\t\t\timg.setAttribute('data-optimumx', optimumx);\n\t\t}\n\t\tif(ratio) {\n\t\t\timg.setAttribute('data-ratio', ratio);\n\t\t}\n\n\t\tpicture.appendChild(img);\n\n\t\telem.appendChild(picture);\n\t};\n\n\tvar proxyLoad = function(e){\n\t\tif(!e.target._lazybgset){return;}\n\n\t\tvar image = e.target;\n\t\tvar elem = image._lazybgset;\n\t\tvar bg = image.currentSrc || image.src;\n\n\t\tif(bg){\n\t\t\telem.style.backgroundImage = 'url(' + (regBgUrlEscape.test(bg) ? JSON.stringify(bg) : bg ) + ')';\n\t\t}\n\n\t\tif(image._lazybgsetLoading){\n\t\t\tlazySizes.fire(elem, '_lazyloaded', {}, false, true);\n\t\t\tdelete image._lazybgsetLoading;\n\t\t}\n\t};\n\n\taddEventListener('lazybeforeunveil', function(e){\n\t\tvar set, image, elem;\n\n\t\tif(e.defaultPrevented || !(set = e.target.getAttribute('data-bgset'))){return;}\n\n\t\telem = e.target;\n\t\timage = document.createElement('img');\n\n\t\timage.alt = '';\n\n\t\timage._lazybgsetLoading = true;\n\t\te.detail.firesLoad = true;\n\n\t\tcreatePicture(set, elem, image);\n\n\t\tsetTimeout(function(){\n\t\t\tlazySizes.loader.unveil(image);\n\n\t\t\tlazySizes.rAF(function(){\n\t\t\t\tlazySizes.fire(image, '_lazyloaded', {}, true, true);\n\t\t\t\tif(image.complete) {\n\t\t\t\t\tproxyLoad({target: image});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t});\n\n\tdocument.addEventListener('load', proxyLoad, true);\n\n\twindow.addEventListener('lazybeforesizes', function(e){\n\t\tif(e.target._lazybgset && e.detail.dataAttr){\n\t\t\tvar elem = e.target._lazybgset;\n\t\t\tvar bgSize = getBgSize(elem);\n\n\t\t\tif(allowedBackgroundSize[bgSize]){\n\t\t\t\te.target._lazysizesParentFit = bgSize;\n\n\t\t\t\tlazySizes.rAF(function(){\n\t\t\t\t\te.target.setAttribute('data-parent-fit', bgSize);\n\t\t\t\t\tif(e.target._lazysizesParentFit){\n\t\t\t\t\t\tdelete e.target._lazysizesParentFit;\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t}, true);\n\n\tdocument.documentElement.addEventListener('lazybeforesizes', function(e){\n\t\tif(e.defaultPrevented || !e.target._lazybgset){return;}\n\t\te.detail.width = proxyWidth(e.target._lazybgset);\n\t});\n})();\n"
  },
  {
    "path": "src/assets/javascripts/plugins/ls.object-fit.js",
    "content": "(function(window, factory) {\n\tvar globalInstall = function(initialEvent){\n\t\tfactory(window.lazySizes, initialEvent);\n\t\twindow.removeEventListener('lazyunveilread', globalInstall, true);\n\t};\n\n\tfactory = factory.bind(null, window, window.document);\n\n\tif(typeof module == 'object' && module.exports){\n\t\tfactory(require('lazysizes'));\n\t} else if(window.lazySizes) {\n\t\tglobalInstall();\n\t} else {\n\t\twindow.addEventListener('lazyunveilread', globalInstall, true);\n\t}\n}(window, function(window, document, lazySizes, initialEvent) {\n\t'use strict';\n\tvar style = document.createElement('a').style;\n\tvar fitSupport = 'objectFit' in style;\n\tvar positionSupport = fitSupport && 'objectPosition' in style;\n\tvar regCssFit = /object-fit[\"']*\\s*:\\s*[\"']*(contain|cover)/;\n\tvar regCssPosition = /object-position[\"']*\\s*:\\s*[\"']*(.+?)(?=($|,|'|\"|;))/;\n\tvar blankSrc = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==';\n\tvar regBgUrlEscape = /\\(|\\)|'/;\n\tvar positionDefaults = {\n\t\tcenter: 'center',\n\t\t'50% 50%': 'center',\n\t};\n\n\tfunction getObject(element){\n\t\tvar css = (getComputedStyle(element, null) || {});\n\t\tvar content = css.fontFamily || '';\n\t\tvar objectFit = content.match(regCssFit) || '';\n\t\tvar objectPosition = objectFit && content.match(regCssPosition) || '';\n\n\t\tif(objectPosition){\n\t\t\tobjectPosition = objectPosition[1];\n\t\t}\n\n\t\treturn {\n\t\t\tfit: objectFit && objectFit[1] || '',\n\t\t\tposition: positionDefaults[objectPosition] || objectPosition || 'center',\n\t\t};\n\t}\n\n\tfunction initFix(element, config){\n\t\tvar switchClassesAdded, addedSrc;\n\t\tvar lazysizesCfg = lazySizes.cfg;\n\t\tvar styleElement = element.cloneNode(false);\n\t\tvar styleElementStyle = styleElement.style;\n\n\t\tvar onChange = function(){\n\t\t\tvar src = element.currentSrc || element.src;\n\n\t\t\tif(src && addedSrc !== src){\n\t\t\t\taddedSrc = src;\n\t\t\t\tstyleElementStyle.backgroundImage = 'url(' + (regBgUrlEscape.test(src) ? JSON.stringify(src) : src ) + ')';\n\n\t\t\t\tif(!switchClassesAdded){\n\t\t\t\t\tswitchClassesAdded = true;\n\t\t\t\t\tlazySizes.rC(styleElement, lazysizesCfg.loadingClass);\n\t\t\t\t\tlazySizes.aC(styleElement, lazysizesCfg.loadedClass);\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tvar rafedOnChange = function(){\n\t\t\tlazySizes.rAF(onChange);\n\t\t};\n\n\t\telement._lazysizesParentFit = config.fit;\n\n\t\telement.addEventListener('lazyloaded', rafedOnChange, true);\n\t\telement.addEventListener('load', rafedOnChange, true);\n\n\t\tstyleElement.addEventListener('load', function(){\n\t\t\tvar curSrc = styleElement.currentSrc || styleElement.src;\n\n\t\t\tif(curSrc && curSrc != blankSrc){\n\t\t\t\tstyleElement.src = blankSrc;\n\t\t\t\tstyleElement.srcset = '';\n\t\t\t}\n\t\t});\n\n\t\tlazySizes.rAF(function(){\n\n\t\t\tvar hideElement = element;\n\t\t\tvar container = element.parentNode;\n\n\t\t\tif(container.nodeName.toUpperCase() == 'PICTURE'){\n\t\t\t\thideElement = container;\n\t\t\t\tcontainer = container.parentNode;\n\t\t\t}\n\n\t\t\tlazySizes.rC(styleElement, lazysizesCfg.loadedClass);\n\t\t\tlazySizes.rC(styleElement, lazysizesCfg.lazyClass);\n\t\t\tlazySizes.aC(styleElement, lazysizesCfg.loadingClass);\n\t\t\tlazySizes.aC(styleElement, lazysizesCfg.objectFitClass || 'lazysizes-display-clone');\n\n\t\t\tif(styleElement.getAttribute(lazysizesCfg.srcsetAttr)){\n\t\t\t\tstyleElement.setAttribute(lazysizesCfg.srcsetAttr, '');\n\t\t\t}\n\n\t\t\tif(styleElement.getAttribute(lazysizesCfg.srcAttr)){\n\t\t\t\tstyleElement.setAttribute(lazysizesCfg.srcAttr, '');\n\t\t\t}\n\n\t\t\tstyleElement.src = blankSrc;\n\t\t\tstyleElement.srcset = '';\n\n\t\t\tstyleElementStyle.backgroundRepeat = 'no-repeat';\n\t\t\tstyleElementStyle.backgroundPosition = config.position;\n\t\t\tstyleElementStyle.backgroundSize = config.fit;\n\n\t\t\thideElement.style.display = 'none';\n\n\t\t\telement.setAttribute('data-parent-fit', config.fit);\n\t\t\telement.setAttribute('data-parent-container', 'prev');\n\n\t\t\tcontainer.insertBefore(styleElement, hideElement);\n\n\t\t\tif(element._lazysizesParentFit){\n\t\t\t\tdelete element._lazysizesParentFit;\n\t\t\t}\n\n\t\t\tif(element.complete){\n\t\t\t\tonChange();\n\t\t\t}\n\t\t});\n\t}\n\n\tif(!fitSupport || !positionSupport){\n\t\tvar onRead = function(e){\n\t\t\tif(e.detail.instance != lazySizes){return;}\n\n\t\t\tvar element = e.target;\n\t\t\tvar obj = getObject(element);\n\n\t\t\tif(obj.fit && (!fitSupport || (obj.position != 'center'))){\n\t\t\t\tinitFix(element, obj);\n\t\t\t}\n\t\t};\n\n\t\twindow.addEventListener('lazyunveilread', onRead, true);\n\n\t\tif(initialEvent && initialEvent.detail){\n\t\t\tonRead(initialEvent);\n\t\t}\n\t}\n}));\n"
  },
  {
    "path": "src/assets/javascripts/plugins/ls.parent-fit.js",
    "content": "(function(window, document){\n\t'use strict';\n\n\tif(!window.addEventListener){return;}\n\n\tvar regDescriptors = /\\s+(\\d+)(w|h)\\s+(\\d+)(w|h)/;\n\tvar regCssFit = /parent-fit[\"']*\\s*:\\s*[\"']*(contain|cover|width)/;\n\tvar regCssObject = /parent-container[\"']*\\s*:\\s*[\"']*(.+?)(?=(\\s|$|,|'|\"|;))/;\n\tvar regPicture = /^picture$/i;\n\n\tvar getCSS = function (elem){\n\t\treturn (getComputedStyle(elem, null) || {});\n\t};\n\n\tvar parentFit = {\n\n\t\tgetParent: function(element, parentSel){\n\t\t\tvar parent = element;\n\t\t\tvar parentNode = element.parentNode;\n\n\t\t\tif((!parentSel || parentSel == 'prev') && parentNode && regPicture.test(parentNode.nodeName || '')){\n\t\t\t\tparentNode = parentNode.parentNode;\n\t\t\t}\n\n\t\t\tif(parentSel != 'self'){\n\t\t\t\tif(parentSel == 'prev'){\n\t\t\t\t\tparent = element.previousElementSibling;\n\t\t\t\t} else if(parentSel && (parentNode.closest || window.jQuery)){\n\t\t\t\t\tparent = (parentNode.closest ?\n\t\t\t\t\t\t\tparentNode.closest(parentSel) :\n\t\t\t\t\t\t\tjQuery(parentNode).closest(parentSel)[0]) ||\n\t\t\t\t\t\tparentNode\n\t\t\t\t\t;\n\t\t\t\t} else {\n\t\t\t\t\tparent = parentNode;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn parent;\n\t\t},\n\n\t\tgetFit: function(element){\n\t\t\tvar tmpMatch, parentObj;\n\t\t\tvar css = getCSS(element);\n\t\t\tvar content = css.content || css.fontFamily;\n\t\t\tvar obj = {\n\t\t\t\tfit: element._lazysizesParentFit || element.getAttribute('data-parent-fit')\n\t\t\t};\n\n\t\t\tif(!obj.fit && content && (tmpMatch = content.match(regCssFit))){\n\t\t\t\tobj.fit = tmpMatch[1];\n\t\t\t}\n\n\t\t\tif(obj.fit){\n\t\t\t\tparentObj = element._lazysizesParentContainer || element.getAttribute('data-parent-container');\n\n\t\t\t\tif(!parentObj && content && (tmpMatch = content.match(regCssObject))){\n\t\t\t\t\tparentObj = tmpMatch[1];\n\t\t\t\t}\n\n\t\t\t\tobj.parent = parentFit.getParent(element, parentObj);\n\n\n\t\t\t} else {\n\t\t\t\tobj.fit = css.objectFit;\n\t\t\t}\n\n\t\t\treturn obj;\n\t\t},\n\n\t\tgetImageRatio: function(element){\n\t\t\tvar i, srcset, media, ratio;\n\t\t\tvar parent = element.parentNode;\n\t\t\tvar elements = parent && regPicture.test(parent.nodeName || '') ?\n\t\t\t\t\tparent.querySelectorAll('source, img') :\n\t\t\t\t\t[element]\n\t\t\t\t;\n\n\t\t\tfor(i = 0; i < elements.length; i++){\n\t\t\t\telement = elements[i];\n\t\t\t\tsrcset = element.getAttribute(lazySizesConfig.srcsetAttr) || element.getAttribute('srcset') || element.getAttribute('data-pfsrcset') || element.getAttribute('data-risrcset') || '';\n\t\t\t\tmedia = element.getAttribute('media');\n\t\t\t\tmedia = lazySizesConfig.customMedia[element.getAttribute('data-media') || media] || media;\n\n\t\t\t\tif(srcset && (!media || (window.matchMedia && matchMedia(media) || {}).matches )){\n\t\t\t\t\tratio = parseFloat(element.getAttribute('data-aspectratio'));\n\n\t\t\t\t\tif(!ratio && srcset.match(regDescriptors)){\n\t\t\t\t\t\tif(RegExp.$2 == 'w'){\n\t\t\t\t\t\t\tratio = RegExp.$1 / RegExp.$3;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tratio = RegExp.$3 / RegExp.$1;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn ratio;\n\t\t},\n\n\t\tcalculateSize: function(element, width){\n\t\t\tvar displayRatio, height, imageRatio, retWidth;\n\t\t\tvar fitObj = this.getFit(element);\n\t\t\tvar fit = fitObj.fit;\n\t\t\tvar fitElem = fitObj.parent;\n\n\t\t\tif(fit != 'width' && ((fit != 'contain' && fit != 'cover') || !(imageRatio = this.getImageRatio(element)))){\n\t\t\t\treturn width;\n\t\t\t}\n\n\t\t\tif(fitElem){\n\t\t\t\twidth = fitElem.clientWidth;\n\t\t\t} else {\n\t\t\t\tfitElem = element;\n\t\t\t}\n\n\t\t\tretWidth = width;\n\n\t\t\tif(fit == 'width'){\n\t\t\t\tretWidth = width;\n\t\t\t} else {\n\t\t\t\theight = fitElem.clientHeight;\n\n\t\t\t\tif(height > 40 && (displayRatio =  width / height) && ((fit == 'cover' && displayRatio < imageRatio) || (fit == 'contain' && displayRatio > imageRatio))){\n\t\t\t\t\tretWidth = width * (imageRatio / displayRatio);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn retWidth;\n\t\t}\n\t};\n\n\tvar extend = function(){\n\t\tif(window.lazySizes){\n\t\t\tif(!lazySizes.parentFit){\n\t\t\t\tlazySizes.parentFit = parentFit;\n\t\t\t}\n\t\t\twindow.removeEventListener('lazyunveilread', extend, true);\n\t\t}\n\t};\n\n\twindow.addEventListener('lazyunveilread', extend, true);\n\n\tdocument.addEventListener('lazybeforesizes', function(e){\n\t\tif(e.defaultPrevented){return;}\n\t\tvar element = e.target;\n\t\te.detail.width = parentFit.calculateSize(element, e.detail.width);\n\t});\n\n\tsetTimeout(extend);\n\n})(window, document);\n"
  },
  {
    "path": "src/assets/javascripts/plugins/ls.respimg.js",
    "content": "(function(window, document, undefined){\n\t/*jshint eqnull:true */\n\t'use strict';\n\tvar polyfill;\n\tvar config = (window.lazySizes && lazySizes.cfg) || window.lazySizesConfig;\n\tvar img = document.createElement('img');\n\tvar supportSrcset = ('sizes' in img) && ('srcset' in img);\n\tvar regHDesc = /\\s+\\d+h/g;\n\tvar fixEdgeHDescriptor = (function(){\n\t\tvar regDescriptors = /\\s+(\\d+)(w|h)\\s+(\\d+)(w|h)/;\n\t\tvar forEach = Array.prototype.forEach;\n\n\t\treturn function(edgeMatch){\n\t\t\tvar img = document.createElement('img');\n\t\t\tvar removeHDescriptors = function(source){\n\t\t\t\tvar ratio;\n\t\t\t\tvar srcset = source.getAttribute(lazySizesConfig.srcsetAttr);\n\t\t\t\tif(srcset){\n\t\t\t\t\tif(srcset.match(regDescriptors)){\n\t\t\t\t\t\tif(RegExp.$2 == 'w'){\n\t\t\t\t\t\t\tratio = RegExp.$1 / RegExp.$3;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tratio = RegExp.$3 / RegExp.$1;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif(ratio){\n\t\t\t\t\t\t\tsource.setAttribute('data-aspectratio', ratio);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tsource.setAttribute(lazySizesConfig.srcsetAttr, srcset.replace(regHDesc, ''));\n\t\t\t\t}\n\t\t\t};\n\t\t\tvar handler = function(e){\n\t\t\t\tvar picture = e.target.parentNode;\n\n\t\t\t\tif(picture && picture.nodeName == 'PICTURE'){\n\t\t\t\t\tforEach.call(picture.getElementsByTagName('source'), removeHDescriptors);\n\t\t\t\t}\n\t\t\t\tremoveHDescriptors(e.target);\n\t\t\t};\n\n\t\t\tvar test = function(){\n\t\t\t\tif(!!img.currentSrc){\n\t\t\t\t\tdocument.removeEventListener('lazybeforeunveil', handler);\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tif(edgeMatch[1]){\n\t\t\t\tdocument.addEventListener('lazybeforeunveil', handler);\n\n\t\t\t\tif(true || edgeMatch[1] > 14){\n\t\t\t\t\timg.onload = test;\n\t\t\t\t\timg.onerror = test;\n\n\t\t\t\t\timg.srcset = 'data:,a 1w 1h';\n\n\t\t\t\t\tif(img.complete){\n\t\t\t\t\t\ttest();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t})();\n\n\n\tif(!config){\n\t\tconfig = {};\n\t\twindow.lazySizesConfig = config;\n\t}\n\n\tif(!config.supportsType){\n\t\tconfig.supportsType = function(type/*, elem*/){\n\t\t\treturn !type;\n\t\t};\n\t}\n\n\tif(window.picturefill || config.pf){return;}\n\n\tif(window.HTMLPictureElement && supportSrcset){\n\n\t\tif(document.msElementsFromPoint){\n\t\t\tfixEdgeHDescriptor(navigator.userAgent.match(/Edge\\/(\\d+)/));\n\t\t}\n\n\t\tconfig.pf = function(){};\n\t\treturn;\n\t}\n\n\tconfig.pf = function(options){\n\t\tvar i, len;\n\t\tif(window.picturefill){return;}\n\t\tfor(i = 0, len = options.elements.length; i < len; i++){\n\t\t\tpolyfill(options.elements[i]);\n\t\t}\n\t};\n\n\t// partial polyfill\n\tpolyfill = (function(){\n\t\tvar ascendingSort = function( a, b ) {\n\t\t\treturn a.w - b.w;\n\t\t};\n\t\tvar regPxLength = /^\\s*\\d+\\.*\\d*px\\s*$/;\n\t\tvar reduceCandidate = function (srces) {\n\t\t\tvar lowerCandidate, bonusFactor;\n\t\t\tvar len = srces.length;\n\t\t\tvar candidate = srces[len -1];\n\t\t\tvar i = 0;\n\n\t\t\tfor(i; i < len;i++){\n\t\t\t\tcandidate = srces[i];\n\t\t\t\tcandidate.d = candidate.w / srces.w;\n\n\t\t\t\tif(candidate.d >= srces.d){\n\t\t\t\t\tif(!candidate.cached && (lowerCandidate = srces[i - 1]) &&\n\t\t\t\t\t\tlowerCandidate.d > srces.d - (0.13 * Math.pow(srces.d, 2.2))){\n\n\t\t\t\t\t\tbonusFactor = Math.pow(lowerCandidate.d - 0.6, 1.6);\n\n\t\t\t\t\t\tif(lowerCandidate.cached) {\n\t\t\t\t\t\t\tlowerCandidate.d += 0.15 * bonusFactor;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif(lowerCandidate.d + ((candidate.d - srces.d) * bonusFactor) > srces.d){\n\t\t\t\t\t\t\tcandidate = lowerCandidate;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn candidate;\n\t\t};\n\n\t\tvar parseWsrcset = (function(){\n\t\t\tvar candidates;\n\t\t\tvar regWCandidates = /(([^,\\s].[^\\s]+)\\s+(\\d+)w)/g;\n\t\t\tvar regMultiple = /\\s/;\n\t\t\tvar addCandidate = function(match, candidate, url, wDescriptor){\n\t\t\t\tcandidates.push({\n\t\t\t\t\tc: candidate,\n\t\t\t\t\tu: url,\n\t\t\t\t\tw: wDescriptor * 1\n\t\t\t\t});\n\t\t\t};\n\n\t\t\treturn function(input){\n\t\t\t\tcandidates = [];\n\t\t\t\tinput = input.trim();\n\t\t\t\tinput\n\t\t\t\t\t.replace(regHDesc, '')\n\t\t\t\t\t.replace(regWCandidates, addCandidate)\n\t\t\t\t;\n\n\t\t\t\tif(!candidates.length && input && !regMultiple.test(input)){\n\t\t\t\t\tcandidates.push({\n\t\t\t\t\t\tc: input,\n\t\t\t\t\t\tu: input,\n\t\t\t\t\t\tw: 99\n\t\t\t\t\t});\n\t\t\t\t}\n\n\t\t\t\treturn candidates;\n\t\t\t};\n\t\t})();\n\n\t\tvar runMatchMedia = function(){\n\t\t\tif(runMatchMedia.init){return;}\n\n\t\t\trunMatchMedia.init = true;\n\t\t\taddEventListener('resize', (function(){\n\t\t\t\tvar timer;\n\t\t\t\tvar matchMediaElems = document.getElementsByClassName('lazymatchmedia');\n\t\t\t\tvar run = function(){\n\t\t\t\t\tvar i, len;\n\t\t\t\t\tfor(i = 0, len = matchMediaElems.length; i < len; i++){\n\t\t\t\t\t\tpolyfill(matchMediaElems[i]);\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\treturn function(){\n\t\t\t\t\tclearTimeout(timer);\n\t\t\t\t\ttimer = setTimeout(run, 66);\n\t\t\t\t};\n\t\t\t})());\n\t\t};\n\n\t\tvar createSrcset = function(elem, isImage){\n\t\t\tvar parsedSet;\n\t\t\tvar srcSet = elem.getAttribute('srcset') || elem.getAttribute(config.srcsetAttr);\n\n\t\t\tif(!srcSet && isImage){\n\t\t\t\tsrcSet = !elem._lazypolyfill ?\n\t\t\t\t\t(elem.getAttribute(config.srcAttr) || elem.getAttribute('src')) :\n\t\t\t\t\telem._lazypolyfill._set\n\t\t\t\t;\n\t\t\t}\n\n\t\t\tif(!elem._lazypolyfill || elem._lazypolyfill._set != srcSet){\n\n\t\t\t\tparsedSet = parseWsrcset( srcSet || '' );\n\t\t\t\tif(isImage && elem.parentNode){\n\t\t\t\t\tparsedSet.isPicture = elem.parentNode.nodeName.toUpperCase() == 'PICTURE';\n\n\t\t\t\t\tif(parsedSet.isPicture){\n\t\t\t\t\t\tif(window.matchMedia){\n\t\t\t\t\t\t\tlazySizes.aC(elem, 'lazymatchmedia');\n\t\t\t\t\t\t\trunMatchMedia();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tparsedSet._set = srcSet;\n\t\t\t\tObject.defineProperty(elem, '_lazypolyfill', {\n\t\t\t\t\tvalue: parsedSet,\n\t\t\t\t\twritable: true\n\t\t\t\t});\n\t\t\t}\n\t\t};\n\n\t\tvar getX = function(elem){\n\t\t\tvar dpr = window.devicePixelRatio || 1;\n\t\t\tvar optimum = lazySizes.getX && lazySizes.getX(elem);\n\t\t\treturn Math.min(optimum || dpr, 2.5, dpr);\n\t\t};\n\n\t\tvar matchesMedia = function(media){\n\t\t\tif(window.matchMedia){\n\t\t\t\tmatchesMedia = function(media){\n\t\t\t\t\treturn !media || (matchMedia(media) || {}).matches;\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\treturn !media;\n\t\t\t}\n\n\t\t\treturn matchesMedia(media);\n\t\t};\n\n\t\tvar getCandidate = function(elem){\n\t\t\tvar sources, i, len, media, source, srces, src, width;\n\n\t\t\tsource = elem;\n\t\t\tcreateSrcset(source, true);\n\t\t\tsrces = source._lazypolyfill;\n\n\t\t\tif(srces.isPicture){\n\t\t\t\tfor(i = 0, sources = elem.parentNode.getElementsByTagName('source'), len = sources.length; i < len; i++){\n\t\t\t\t\tif( config.supportsType(sources[i].getAttribute('type'), elem) && matchesMedia( sources[i].getAttribute('media')) ){\n\t\t\t\t\t\tsource = sources[i];\n\t\t\t\t\t\tcreateSrcset(source);\n\t\t\t\t\t\tsrces = source._lazypolyfill;\n\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif(srces.length > 1){\n\t\t\t\twidth = source.getAttribute('sizes') || '';\n\t\t\t\twidth = regPxLength.test(width) && parseInt(width, 10) || lazySizes.gW(elem, elem.parentNode);\n\t\t\t\tsrces.d = getX(elem);\n\t\t\t\tif(!srces.src || !srces.w || srces.w < width){\n\t\t\t\t\tsrces.w = width;\n\t\t\t\t\tsrc = reduceCandidate(srces.sort(ascendingSort));\n\t\t\t\t\tsrces.src = src;\n\t\t\t\t} else {\n\t\t\t\t\tsrc = srces.src;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tsrc = srces[0];\n\t\t\t}\n\n\t\t\treturn src;\n\t\t};\n\n\t\tvar p = function(elem){\n\t\t\tif(supportSrcset && elem.parentNode && elem.parentNode.nodeName.toUpperCase() != 'PICTURE'){return;}\n\t\t\tvar candidate = getCandidate(elem);\n\n\t\t\tif(candidate && candidate.u && elem._lazypolyfill.cur != candidate.u){\n\t\t\t\telem._lazypolyfill.cur = candidate.u;\n\t\t\t\tcandidate.cached = true;\n\t\t\t\telem.setAttribute(config.srcAttr, candidate.u);\n\t\t\t\telem.setAttribute('src', candidate.u);\n\t\t\t}\n\t\t};\n\n\t\tp.parse = parseWsrcset;\n\n\t\treturn p;\n\t})();\n\n\tif(config.loadedClass && config.loadingClass){\n\t\t(function(){\n\t\t\tvar sels = [];\n\t\t\t['img[sizes$=\"px\"][srcset].', 'picture > img:not([srcset]).'].forEach(function(sel){\n\t\t\t\tsels.push(sel + config.loadedClass);\n\t\t\t\tsels.push(sel + config.loadingClass);\n\t\t\t});\n\t\t\tconfig.pf({\n\t\t\t\telements: document.querySelectorAll(sels.join(', '))\n\t\t\t});\n\t\t})();\n\n\t}\n})(window, document);\n\n/**\n * Some versions of iOS (8.1-) do load the first candidate of a srcset candidate list, if width descriptors with the sizes attribute is used.\n * This tiny extension prevents this wasted download by creating a picture structure around the image.\n * Note: This extension is already included in the ls.respimg.js file.\n *\n * Usage:\n *\n * <img\n * \tclass=\"lazyload\"\n * \tdata-sizes=\"auto\"\n * \tdata-srcset=\"small.jpg 640px,\n * \t\tmedium.jpg 980w,\n * \t\tlarge.jpg 1280w\"\n * \t/>\n */\n\n(function(document){\n\t'use strict';\n\tvar regPicture;\n\tvar img = document.createElement('img');\n\n\tif(('srcset' in img) && !('sizes' in img) && !window.HTMLPictureElement){\n\t\tregPicture = /^picture$/i;\n\t\tdocument.addEventListener('lazybeforeunveil', function(e){\n\t\t\tvar elem, parent, srcset, sizes, isPicture;\n\t\t\tvar picture, source;\n\t\t\tif(e.defaultPrevented ||\n\t\t\t\tlazySizesConfig.noIOSFix ||\n\t\t\t\t!(elem = e.target) ||\n\t\t\t\t!(srcset = elem.getAttribute(lazySizesConfig.srcsetAttr)) ||\n\t\t\t\t!(parent = elem.parentNode) ||\n\t\t\t\t(\n\t\t\t\t\t!(isPicture = regPicture.test(parent.nodeName || '')) &&\n\t\t\t\t\t!(sizes = elem.getAttribute('sizes') || elem.getAttribute(lazySizesConfig.sizesAttr))\n\t\t\t\t)\n\t\t\t){return;}\n\n\t\t\tpicture = isPicture ? parent : document.createElement('picture');\n\n\t\t\tif(!elem._lazyImgSrc){\n\t\t\t\tObject.defineProperty(elem, '_lazyImgSrc', {\n\t\t\t\t\tvalue: document.createElement('source'),\n\t\t\t\t\twritable: true\n\t\t\t\t});\n\t\t\t}\n\t\t\tsource = elem._lazyImgSrc;\n\n\t\t\tif(sizes){\n\t\t\t\tsource.setAttribute('sizes', sizes);\n\t\t\t}\n\n\t\t\tsource.setAttribute(lazySizesConfig.srcsetAttr, srcset);\n\t\t\telem.setAttribute('data-pfsrcset', srcset);\n\t\t\telem.removeAttribute(lazySizesConfig.srcsetAttr);\n\n\t\t\tif(!isPicture){\n\t\t\t\tparent.insertBefore(picture, elem);\n\t\t\t\tpicture.appendChild(elem);\n\t\t\t}\n\t\t\tpicture.insertBefore(source, elem);\n\t\t});\n\t}\n})(document);\n"
  },
  {
    "path": "src/assets/javascripts/plugins/smooth-scroll.js",
    "content": "/*!\n * smooth-scroll v16.0.3\n * Animate scrolling to anchor links\n * (c) 2019 Chris Ferdinandi\n * MIT License\n * http://github.com/cferdinandi/smooth-scroll\n */\n\n(function (root, factory) {\n\tif (typeof define === 'function' && define.amd) {\n\t\tdefine([], (function () {\n\t\t\treturn factory(root);\n\t\t}));\n\t} else if (typeof exports === 'object') {\n\t\tmodule.exports = factory(root);\n\t} else {\n\t\troot.SmoothScroll = factory(root);\n\t}\n})(typeof global !== 'undefined' ? global : typeof window !== 'undefined' ? window : this, (function (window) {\n\n\t'use strict';\n\n\t//\n\t// Default settings\n\t//\n\n\tvar defaults = {\n\n\t\t// Selectors\n\t\tignore: '[data-scroll-ignore]',\n\t\theader: null,\n\t\ttopOnEmptyHash: true,\n\n\t\t// Speed & Duration\n\t\tspeed: 500,\n\t\tspeedAsDuration: false,\n\t\tdurationMax: null,\n\t\tdurationMin: null,\n\t\tclip: true,\n\t\toffset: 0,\n\n\t\t// Easing\n\t\teasing: 'easeInOutCubic',\n\t\tcustomEasing: null,\n\n\t\t// History\n\t\tupdateURL: true,\n\t\tpopstate: true,\n\n\t\t// Custom Events\n\t\temitEvents: true\n\n\t};\n\n\n\t//\n\t// Utility Methods\n\t//\n\n\t/**\n\t * Check if browser supports required methods\n\t * @return {Boolean} Returns true if all required methods are supported\n\t */\n\tvar supports = function () {\n\t\treturn (\n\t\t\t'querySelector' in document &&\n\t\t\t'addEventListener' in window &&\n\t\t\t'requestAnimationFrame' in window &&\n\t\t\t'closest' in window.Element.prototype\n\t\t);\n\t};\n\n\t/**\n\t * Merge two or more objects together.\n\t * @param   {Object}   objects  The objects to merge together\n\t * @returns {Object}            Merged values of defaults and options\n\t */\n\tvar extend = function () {\n\t\tvar merged = {};\n\t\tArray.prototype.forEach.call(arguments, (function (obj) {\n\t\t\tfor (var key in obj) {\n\t\t\t\tif (!obj.hasOwnProperty(key)) return;\n\t\t\t\tmerged[key] = obj[key];\n\t\t\t}\n\t\t}));\n\t\treturn merged;\n\t};\n\n\t/**\n\t * Check to see if user prefers reduced motion\n\t * @param  {Object} settings Script settings\n\t */\n\tvar reduceMotion = function (settings) {\n\t\tif ('matchMedia' in window && window.matchMedia('(prefers-reduced-motion)').matches) {\n\t\t\treturn true;\n\t\t}\n\t\treturn false;\n\t};\n\n\t/**\n\t * Get the height of an element.\n\t * @param  {Node} elem The element to get the height of\n\t * @return {Number}    The element's height in pixels\n\t */\n\tvar getHeight = function (elem) {\n\t\treturn parseInt(window.getComputedStyle(elem).height, 10);\n\t};\n\n\t/**\n\t * Escape special characters for use with querySelector\n\t * @author Mathias Bynens\n\t * @link https://github.com/mathiasbynens/CSS.escape\n\t * @param {String} id The anchor ID to escape\n\t */\n\tvar escapeCharacters = function (id) {\n\n\t\t// Remove leading hash\n\t\tif (id.charAt(0) === '#') {\n\t\t\tid = id.substr(1);\n\t\t}\n\n\t\tvar string = String(id);\n\t\tvar length = string.length;\n\t\tvar index = -1;\n\t\tvar codeUnit;\n\t\tvar result = '';\n\t\tvar firstCodeUnit = string.charCodeAt(0);\n\t\twhile (++index < length) {\n\t\t\tcodeUnit = string.charCodeAt(index);\n\t\t\t// Note: there’s no need to special-case astral symbols, surrogate\n\t\t\t// pairs, or lone surrogates.\n\n\t\t\t// If the character is NULL (U+0000), then throw an\n\t\t\t// `InvalidCharacterError` exception and terminate these steps.\n\t\t\tif (codeUnit === 0x0000) {\n\t\t\t\tthrow new InvalidCharacterError(\n\t\t\t\t\t'Invalid character: the input contains U+0000.'\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif (\n\t\t\t\t// If the character is in the range [\\1-\\1F] (U+0001 to U+001F) or is\n\t\t\t\t// U+007F, […]\n\t\t\t\t(codeUnit >= 0x0001 && codeUnit <= 0x001F) || codeUnit == 0x007F ||\n\t\t\t\t// If the character is the first character and is in the range [0-9]\n\t\t\t\t// (U+0030 to U+0039), […]\n\t\t\t\t(index === 0 && codeUnit >= 0x0030 && codeUnit <= 0x0039) ||\n\t\t\t\t// If the character is the second character and is in the range [0-9]\n\t\t\t\t// (U+0030 to U+0039) and the first character is a `-` (U+002D), […]\n\t\t\t\t(\n\t\t\t\t\tindex === 1 &&\n\t\t\t\t\tcodeUnit >= 0x0030 && codeUnit <= 0x0039 &&\n\t\t\t\t\tfirstCodeUnit === 0x002D\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\t// http://dev.w3.org/csswg/cssom/#escape-a-character-as-code-point\n\t\t\t\tresult += '\\\\' + codeUnit.toString(16) + ' ';\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\t// If the character is not handled by one of the above rules and is\n\t\t\t// greater than or equal to U+0080, is `-` (U+002D) or `_` (U+005F), or\n\t\t\t// is in one of the ranges [0-9] (U+0030 to U+0039), [A-Z] (U+0041 to\n\t\t\t// U+005A), or [a-z] (U+0061 to U+007A), […]\n\t\t\tif (\n\t\t\t\tcodeUnit >= 0x0080 ||\n\t\t\t\tcodeUnit === 0x002D ||\n\t\t\t\tcodeUnit === 0x005F ||\n\t\t\t\tcodeUnit >= 0x0030 && codeUnit <= 0x0039 ||\n\t\t\t\tcodeUnit >= 0x0041 && codeUnit <= 0x005A ||\n\t\t\t\tcodeUnit >= 0x0061 && codeUnit <= 0x007A\n\t\t\t) {\n\t\t\t\t// the character itself\n\t\t\t\tresult += string.charAt(index);\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\t// Otherwise, the escaped character.\n\t\t\t// http://dev.w3.org/csswg/cssom/#escape-a-character\n\t\t\tresult += '\\\\' + string.charAt(index);\n\n\t\t}\n\n\t\t// Return sanitized hash\n\t\treturn '#' + result;\n\n\t};\n\n\t/**\n\t * Calculate the easing pattern\n\t * @link https://gist.github.com/gre/1650294\n\t * @param {String} type Easing pattern\n\t * @param {Number} time Time animation should take to complete\n\t * @returns {Number}\n\t */\n\tvar easingPattern = function (settings, time) {\n\t\tvar pattern;\n\n\t\t// Default Easing Patterns\n\t\tif (settings.easing === 'easeInQuad') pattern = time * time; // accelerating from zero velocity\n\t\tif (settings.easing === 'easeOutQuad') pattern = time * (2 - time); // decelerating to zero velocity\n\t\tif (settings.easing === 'easeInOutQuad') pattern = time < 0.5 ? 2 * time * time : -1 + (4 - 2 * time) * time; // acceleration until halfway, then deceleration\n\t\tif (settings.easing === 'easeInCubic') pattern = time * time * time; // accelerating from zero velocity\n\t\tif (settings.easing === 'easeOutCubic') pattern = (--time) * time * time + 1; // decelerating to zero velocity\n\t\tif (settings.easing === 'easeInOutCubic') pattern = time < 0.5 ? 4 * time * time * time : (time - 1) * (2 * time - 2) * (2 * time - 2) + 1; // acceleration until halfway, then deceleration\n\t\tif (settings.easing === 'easeInQuart') pattern = time * time * time * time; // accelerating from zero velocity\n\t\tif (settings.easing === 'easeOutQuart') pattern = 1 - (--time) * time * time * time; // decelerating to zero velocity\n\t\tif (settings.easing === 'easeInOutQuart') pattern = time < 0.5 ? 8 * time * time * time * time : 1 - 8 * (--time) * time * time * time; // acceleration until halfway, then deceleration\n\t\tif (settings.easing === 'easeInQuint') pattern = time * time * time * time * time; // accelerating from zero velocity\n\t\tif (settings.easing === 'easeOutQuint') pattern = 1 + (--time) * time * time * time * time; // decelerating to zero velocity\n\t\tif (settings.easing === 'easeInOutQuint') pattern = time < 0.5 ? 16 * time * time * time * time * time : 1 + 16 * (--time) * time * time * time * time; // acceleration until halfway, then deceleration\n\n\t\t// Custom Easing Patterns\n\t\tif (!!settings.customEasing) pattern = settings.customEasing(time);\n\n\t\treturn pattern || time; // no easing, no acceleration\n\t};\n\n\t/**\n\t * Determine the document's height\n\t * @returns {Number}\n\t */\n\tvar getDocumentHeight = function () {\n\t\treturn Math.max(\n\t\t\tdocument.body.scrollHeight, document.documentElement.scrollHeight,\n\t\t\tdocument.body.offsetHeight, document.documentElement.offsetHeight,\n\t\t\tdocument.body.clientHeight, document.documentElement.clientHeight\n\t\t);\n\t};\n\n\t/**\n\t * Calculate how far to scroll\n\t * Clip support added by robjtede - https://github.com/cferdinandi/smooth-scroll/issues/405\n\t * @param {Element} anchor       The anchor element to scroll to\n\t * @param {Number}  headerHeight Height of a fixed header, if any\n\t * @param {Number}  offset       Number of pixels by which to offset scroll\n\t * @param {Boolean} clip         If true, adjust scroll distance to prevent abrupt stops near the bottom of the page\n\t * @returns {Number}\n\t */\n\tvar getEndLocation = function (anchor, headerHeight, offset, clip) {\n\t\tvar location = 0;\n\t\tif (anchor.offsetParent) {\n\t\t\tdo {\n\t\t\t\tlocation += anchor.offsetTop;\n\t\t\t\tanchor = anchor.offsetParent;\n\t\t\t} while (anchor);\n\t\t}\n\t\tlocation = Math.max(location - headerHeight - offset, 0);\n\t\tif (clip) {\n\t\t\tlocation = Math.min(location, getDocumentHeight() - window.innerHeight);\n\t\t}\n \t\treturn location;\n\t};\n\n\t/**\n\t * Get the height of the fixed header\n\t * @param  {Node}   header The header\n\t * @return {Number}        The height of the header\n\t */\n\tvar getHeaderHeight = function (header) {\n\t\treturn !header ? 0 : (getHeight(header) + header.offsetTop);\n\t};\n\n\t/**\n\t * Calculate the speed to use for the animation\n\t * @param  {Number} distance The distance to travel\n\t * @param  {Object} settings The plugin settings\n\t * @return {Number}          How fast to animate\n\t */\n\tvar getSpeed = function (distance, settings) {\n\t\tvar speed = settings.speedAsDuration ? settings.speed : Math.abs(distance / 1000 * settings.speed);\n\t\tif (settings.durationMax && speed > settings.durationMax) return settings.durationMax;\n\t\tif (settings.durationMin && speed < settings.durationMin) return settings.durationMin;\n\t\treturn parseInt(speed, 10);\n\t};\n\n\tvar setHistory = function (options) {\n\n\t\t// Make sure this should run\n\t\tif (!history.replaceState || !options.updateURL || history.state) return;\n\n\t\t// Get the hash to use\n\t\tvar hash = window.location.hash;\n\t\thash = hash ? hash : '';\n\n\t\t// Set a default history\n\t\thistory.replaceState(\n\t\t\t{\n\t\t\t\tsmoothScroll: JSON.stringify(options),\n\t\t\t\tanchor: hash ? hash : window.pageYOffset\n\t\t\t},\n\t\t\tdocument.title,\n\t\t\thash ? hash : window.location.href\n\t\t);\n\n\t};\n\n\t/**\n\t * Update the URL\n\t * @param  {Node}    anchor  The anchor that was scrolled to\n\t * @param  {Boolean} isNum   If true, anchor is a number\n\t * @param  {Object}  options Settings for Smooth Scroll\n\t */\n\tvar updateURL = function (anchor, isNum, options) {\n\n\t\t// Bail if the anchor is a number\n\t\tif (isNum) return;\n\n\t\t// Verify that pushState is supported and the updateURL option is enabled\n\t\tif (!history.pushState || !options.updateURL) return;\n\n\t\t// Update URL\n\t\thistory.pushState(\n\t\t\t{\n\t\t\t\tsmoothScroll: JSON.stringify(options),\n\t\t\t\tanchor: anchor.id\n\t\t\t},\n\t\t\tdocument.title,\n\t\t\tanchor === document.documentElement ? '#top' : '#' + anchor.id\n\t\t);\n\n\t};\n\n\t/**\n\t * Bring the anchored element into focus\n\t * @param {Node}     anchor      The anchor element\n\t * @param {Number}   endLocation The end location to scroll to\n\t * @param {Boolean}  isNum       If true, scroll is to a position rather than an element\n\t */\n\tvar adjustFocus = function (anchor, endLocation, isNum) {\n\n\t\t// Is scrolling to top of page, blur\n\t\tif (anchor === 0) {\n\t\t\tdocument.body.focus();\n\t\t}\n\n\t\t// Don't run if scrolling to a number on the page\n\t\tif (isNum) return;\n\n\t\t// Otherwise, bring anchor element into focus\n\t\tanchor.focus();\n\t\tif (document.activeElement !== anchor) {\n\t\t\tanchor.setAttribute('tabindex', '-1');\n\t\t\tanchor.focus();\n\t\t\tanchor.style.outline = 'none';\n\t\t}\n\t\twindow.scrollTo(0 , endLocation);\n\n\t};\n\n\t/**\n\t * Emit a custom event\n\t * @param  {String} type    The event type\n\t * @param  {Object} options The settings object\n\t * @param  {Node}   anchor  The anchor element\n\t * @param  {Node}   toggle  The toggle element\n\t */\n\tvar emitEvent = function (type, options, anchor, toggle) {\n\t\tif (!options.emitEvents || typeof window.CustomEvent !== 'function') return;\n\t\tvar event = new CustomEvent(type, {\n\t\t\tbubbles: true,\n\t\t\tdetail: {\n\t\t\t\tanchor: anchor,\n\t\t\t\ttoggle: toggle\n\t\t\t}\n\t\t});\n\t\tdocument.dispatchEvent(event);\n\t};\n\n\n\t//\n\t// SmoothScroll Constructor\n\t//\n\n\tvar SmoothScroll = function (selector, options) {\n\n\t\t//\n\t\t// Variables\n\t\t//\n\n\t\tvar smoothScroll = {}; // Object for public APIs\n\t\tvar settings, anchor, toggle, fixedHeader, eventTimeout, animationInterval;\n\n\n\t\t//\n\t\t// Methods\n\t\t//\n\n\t\t/**\n\t\t * Cancel a scroll-in-progress\n\t\t */\n\t\tsmoothScroll.cancelScroll = function (noEvent) {\n\t\t\tcancelAnimationFrame(animationInterval);\n\t\t\tanimationInterval = null;\n\t\t\tif (noEvent) return;\n\t\t\temitEvent('scrollCancel', settings);\n\t\t};\n\n\t\t/**\n\t\t * Start/stop the scrolling animation\n\t\t * @param {Node|Number} anchor  The element or position to scroll to\n\t\t * @param {Element}     toggle  The element that toggled the scroll event\n\t\t * @param {Object}      options\n\t\t */\n\t\tsmoothScroll.animateScroll = function (anchor, toggle, options) {\n\n\t\t\t// Cancel any in progress scrolls\n\t\t\tsmoothScroll.cancelScroll();\n\n\t\t\t// Local settings\n\t\t\tvar _settings = extend(settings || defaults, options || {}); // Merge user options with defaults\n\n\t\t\t// Selectors and variables\n\t\t\tvar isNum = Object.prototype.toString.call(anchor) === '[object Number]' ? true : false;\n\t\t\tvar anchorElem = isNum || !anchor.tagName ? null : anchor;\n\t\t\tif (!isNum && !anchorElem) return;\n\t\t\tvar startLocation = window.pageYOffset; // Current location on the page\n\t\t\tif (_settings.header && !fixedHeader) {\n\t\t\t\t// Get the fixed header if not already set\n\t\t\t\tfixedHeader = document.querySelector(_settings.header);\n\t\t\t}\n\t\t\tvar headerHeight = getHeaderHeight(fixedHeader);\n\t\t\tvar endLocation = isNum ? anchor : getEndLocation(anchorElem, headerHeight, parseInt((typeof _settings.offset === 'function' ? _settings.offset(anchor, toggle) : _settings.offset), 10), _settings.clip); // Location to scroll to\n\t\t\tvar distance = endLocation - startLocation; // distance to travel\n\t\t\tvar documentHeight = getDocumentHeight();\n\t\t\tvar timeLapsed = 0;\n\t\t\tvar speed = getSpeed(distance, _settings);\n\t\t\tvar start, percentage, position;\n\n\t\t\t/**\n\t\t\t * Stop the scroll animation when it reaches its target (or the bottom/top of page)\n\t\t\t * @param {Number} position Current position on the page\n\t\t\t * @param {Number} endLocation Scroll to location\n\t\t\t * @param {Number} animationInterval How much to scroll on this loop\n\t\t\t */\n\t\t\tvar stopAnimateScroll = function (position, endLocation) {\n\n\t\t\t\t// Get the current location\n\t\t\t\tvar currentLocation = window.pageYOffset;\n\n\t\t\t\t// Check if the end location has been reached yet (or we've hit the end of the document)\n\t\t\t\tif (position == endLocation || currentLocation == endLocation || ((startLocation < endLocation && window.innerHeight + currentLocation) >= documentHeight)) {\n\n\t\t\t\t\t// Clear the animation timer\n\t\t\t\t\tsmoothScroll.cancelScroll(true);\n\n\t\t\t\t\t// Bring the anchored element into focus\n\t\t\t\t\tadjustFocus(anchor, endLocation, isNum);\n\n\t\t\t\t\t// Emit a custom event\n\t\t\t\t\temitEvent('scrollStop', _settings, anchor, toggle);\n\n\t\t\t\t\t// Reset start\n\t\t\t\t\tstart = null;\n\t\t\t\t\tanimationInterval = null;\n\n\t\t\t\t\treturn true;\n\n\t\t\t\t}\n\t\t\t};\n\n\t\t\t/**\n\t\t\t * Loop scrolling animation\n\t\t\t */\n\t\t\tvar loopAnimateScroll = function (timestamp) {\n\t\t\t\tif (!start) { start = timestamp; }\n\t\t\t\ttimeLapsed += timestamp - start;\n\t\t\t\tpercentage = speed === 0 ? 0 : (timeLapsed / speed);\n\t\t\t\tpercentage = (percentage > 1) ? 1 : percentage;\n\t\t\t\tposition = startLocation + (distance * easingPattern(_settings, percentage));\n\t\t\t\twindow.scrollTo(0, Math.floor(position));\n\t\t\t\tif (!stopAnimateScroll(position, endLocation)) {\n\t\t\t\t\tanimationInterval = window.requestAnimationFrame(loopAnimateScroll);\n\t\t\t\t\tstart = timestamp;\n\t\t\t\t}\n\t\t\t};\n\n\t\t\t/**\n\t\t\t * Reset position to fix weird iOS bug\n\t\t\t * @link https://github.com/cferdinandi/smooth-scroll/issues/45\n\t\t\t */\n\t\t\tif (window.pageYOffset === 0) {\n\t\t\t\twindow.scrollTo(0, 0);\n\t\t\t}\n\n\t\t\t// Update the URL\n\t\t\tupdateURL(anchor, isNum, _settings);\n\n\t\t\t// Emit a custom event\n\t\t\temitEvent('scrollStart', _settings, anchor, toggle);\n\n\t\t\t// Start scrolling animation\n\t\t\tsmoothScroll.cancelScroll(true);\n\t\t\twindow.requestAnimationFrame(loopAnimateScroll);\n\n\t\t};\n\n\t\t/**\n\t\t * If smooth scroll element clicked, animate scroll\n\t\t */\n\t\tvar clickHandler = function (event) {\n\n\t\t\t// Don't run if the user prefers reduced motion\n\t\t\tif (reduceMotion(settings)) return;\n\n\t\t\t// Don't run if event was canceled but still bubbled up\n\t\t\t// By @mgreter - https://github.com/cferdinandi/smooth-scroll/pull/462/\n\t\t\tif (event.defaultPrevented) return;\n\n\t\t\t// Don't run if right-click or command/control + click or shift + click\n\t\t\tif (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey) return;\n\n\t\t\t// Check if event.target has closest() method\n\t\t\t// By @totegi - https://github.com/cferdinandi/smooth-scroll/pull/401/\n\t\t\tif(!('closest' in event.target))return;\n\n\t\t\t// Check if a smooth scroll link was clicked\n\t\t\ttoggle = event.target.closest(selector);\n\t\t\tif (!toggle || toggle.tagName.toLowerCase() !== 'a' || event.target.closest(settings.ignore)) return;\n\n\t\t\t// Only run if link is an anchor and points to the current page\n\t\t\tif (toggle.hostname !== window.location.hostname || toggle.pathname !== window.location.pathname || !/#/.test(toggle.href)) return;\n\n\t\t\t// Get an escaped version of the hash\n\t\t\tvar hash = escapeCharacters(toggle.hash);\n\n\t\t\t// Get the anchored element\n\t\t\tvar anchor;\n\t\t\tif (hash === '#') {\n\t\t\t\tif (!settings.topOnEmptyHash) return;\n\t\t\t\tanchor = document.documentElement;\n\t\t\t} else {\n\t\t\t\tanchor = document.querySelector(hash);\n\t\t\t}\n\t\t\tanchor = !anchor && hash === '#top' ? document.documentElement : anchor;\n\n\t\t\t// If anchored element exists, scroll to it\n\t\t\tif (!anchor) return;\n\t\t\tevent.preventDefault();\n\t\t\tsetHistory(settings);\n\t\t\tsmoothScroll.animateScroll(anchor, toggle);\n\n\t\t};\n\n\t\t/**\n\t\t * Animate scroll on popstate events\n\t\t */\n\t\tvar popstateHandler = function (event) {\n\n\t\t\t// Stop if history.state doesn't exist (ex. if clicking on a broken anchor link).\n\t\t\t// fixes `Cannot read property 'smoothScroll' of null` error getting thrown.\n\t\t\tif (history.state === null) return;\n\n\t\t\t// Only run if state is a popstate record for this instantiation\n\t\t\tif (!history.state.smoothScroll || history.state.smoothScroll !== JSON.stringify(settings)) return;\n\n\t\t\t// Only run if state includes an anchor\n\n\t\t\t// if (!history.state.anchor && history.state.anchor !== 0) return;\n\n\t\t\t// Get the anchor\n\t\t\tvar anchor = history.state.anchor;\n\t\t\tif (typeof anchor === 'string' && anchor) {\n\t\t\t\tanchor = document.querySelector(escapeCharacters(history.state.anchor));\n\t\t\t\tif (!anchor) return;\n\t\t\t}\n\n\t\t\t// Animate scroll to anchor link\n\t\t\tsmoothScroll.animateScroll(anchor, null, {updateURL: false});\n\n\t\t};\n\n\t\t/**\n\t\t * Destroy the current initialization.\n\t\t */\n\t\tsmoothScroll.destroy = function () {\n\n\t\t\t// If plugin isn't already initialized, stop\n\t\t\tif (!settings) return;\n\n\t\t\t// Remove event listeners\n\t\t\tdocument.removeEventListener('click', clickHandler, false);\n\t\t\twindow.removeEventListener('popstate', popstateHandler, false);\n\n\t\t\t// Cancel any scrolls-in-progress\n\t\t\tsmoothScroll.cancelScroll();\n\n\t\t\t// Reset variables\n\t\t\tsettings = null;\n\t\t\tanchor = null;\n\t\t\ttoggle = null;\n\t\t\tfixedHeader = null;\n\t\t\teventTimeout = null;\n\t\t\tanimationInterval = null;\n\n\t\t};\n\n\t\t/**\n\t\t * Initialize Smooth Scroll\n\t\t * @param {Object} options User settings\n\t\t */\n\t\tvar init = function () {\n\n\t\t\t// feature test\n\t\t\tif (!supports()) throw 'Smooth Scroll: This browser does not support the required JavaScript methods and browser APIs.';\n\n\t\t\t// Destroy any existing initializations\n\t\t\tsmoothScroll.destroy();\n\n\t\t\t// Selectors and variables\n\t\t\tsettings = extend(defaults, options || {}); // Merge user options with defaults\n\t\t\tfixedHeader = settings.header ? document.querySelector(settings.header) : null; // Get the fixed header\n\n\t\t\t// When a toggle is clicked, run the click handler\n\t\t\tdocument.addEventListener('click', clickHandler, false);\n\n\t\t\t// If updateURL and popState are enabled, listen for pop events\n\t\t\tif (settings.updateURL && settings.popstate) {\n\t\t\t\twindow.addEventListener('popstate', popstateHandler, false);\n\t\t\t}\n\n\t\t};\n\n\n\t\t//\n\t\t// Initialize plugin\n\t\t//\n\n\t\tinit();\n\n\n\t\t//\n\t\t// Public APIs\n\t\t//\n\n\t\treturn smoothScroll;\n\n\t};\n\n\treturn SmoothScroll;\n\n}));\n"
  },
  {
    "path": "src/assets/javascripts/plugins/svg4everybody.js",
    "content": "!function(root, factory) {\n    \"function\" == typeof define && define.amd ? // AMD. Register as an anonymous module unless amdModuleId is set\n    define([], function() {\n        return root.svg4everybody = factory();\n    }) : \"object\" == typeof module && module.exports ? // Node. Does not work with strict CommonJS, but\n    // only CommonJS-like environments that support module.exports,\n    // like Node.\n    module.exports = factory() : root.svg4everybody = factory();\n}(this, function() {\n    /*! svg4everybody v2.1.8 | github.com/jonathantneal/svg4everybody */\n    function embed(parent, svg, target) {\n        // if the target exists\n        if (target) {\n            // create a document fragment to hold the contents of the target\n            var fragment = document.createDocumentFragment(), viewBox = !svg.hasAttribute(\"viewBox\") && target.getAttribute(\"viewBox\");\n            // conditionally set the viewBox on the svg\n            viewBox && svg.setAttribute(\"viewBox\", viewBox);\n            // copy the contents of the clone into the fragment\n            for (// clone the target\n            var clone = target.cloneNode(!0); clone.childNodes.length; ) {\n                fragment.appendChild(clone.firstChild);\n            }\n            // append the fragment into the svg\n            parent.appendChild(fragment);\n        }\n    }\n    function loadreadystatechange(xhr) {\n        // listen to changes in the request\n        xhr.onreadystatechange = function() {\n            // if the request is ready\n            if (4 === xhr.readyState) {\n                // get the cached html document\n                var cachedDocument = xhr._cachedDocument;\n                // ensure the cached html document based on the xhr response\n                cachedDocument || (cachedDocument = xhr._cachedDocument = document.implementation.createHTMLDocument(\"\"), \n                cachedDocument.body.innerHTML = xhr.responseText, xhr._cachedTarget = {}), // clear the xhr embeds list and embed each item\n                xhr._embeds.splice(0).map(function(item) {\n                    // get the cached target\n                    var target = xhr._cachedTarget[item.id];\n                    // ensure the cached target\n                    target || (target = xhr._cachedTarget[item.id] = cachedDocument.getElementById(item.id)), \n                    // embed the target into the svg\n                    embed(item.parent, item.svg, target);\n                });\n            }\n        }, // test the ready state change immediately\n        xhr.onreadystatechange();\n    }\n    function svg4everybody(rawopts) {\n        function oninterval() {\n            // while the index exists in the live <use> collection\n            for (// get the cached <use> index\n            var index = 0; index < uses.length; ) {\n                // get the current <use>\n                var use = uses[index], parent = use.parentNode, svg = getSVGAncestor(parent);\n                if (svg) {\n                    var src = use.getAttribute(\"xlink:href\") || use.getAttribute(\"href\");\n                    !src && opts.attributeName && (src = use.getAttribute(opts.attributeName));\n                    if (polyfill) {\n                        if (!opts.validate || opts.validate(src, svg, use)) {\n                            // remove the <use> element\n                            parent.removeChild(use);\n                            // parse the src and get the url and id\n                            var srcSplit = src.split(\"#\"), url = srcSplit.shift(), id = srcSplit.join(\"#\");\n                            // if the link is external\n                            if (url.length) {\n                                // get the cached xhr request\n                                var xhr = requests[url];\n                                // ensure the xhr request exists\n                                xhr || (xhr = requests[url] = new XMLHttpRequest(), xhr.open(\"GET\", url), xhr.send(), \n                                xhr._embeds = []), // add the svg and id as an item to the xhr embeds list\n                                xhr._embeds.push({\n                                    parent: parent,\n                                    svg: svg,\n                                    id: id\n                                }), // prepare the xhr ready state change event\n                                loadreadystatechange(xhr);\n                            } else {\n                                // embed the local id into the svg\n                                embed(parent, svg, document.getElementById(id));\n                            }\n                        } else {\n                            // increase the index when the previous value was not \"valid\"\n                            ++index, ++numberOfSvgUseElementsToBypass;\n                        }\n                    }\n                } else {\n                    // increase the index when the previous value was not \"valid\"\n                    ++index;\n                }\n            }\n            // continue the interval\n            (!uses.length || uses.length - numberOfSvgUseElementsToBypass > 0) && requestAnimationFrame(oninterval, 67);\n        }\n        var polyfill, opts = Object(rawopts), newerIEUA = /\\bTrident\\/[567]\\b|\\bMSIE (?:9|10)\\.0\\b/, webkitUA = /\\bAppleWebKit\\/(\\d+)\\b/, olderEdgeUA = /\\bEdge\\/12\\.(\\d+)\\b/, edgeUA = /\\bEdge\\/.(\\d+)\\b/, inIframe = window.top !== window.self;\n        polyfill = \"polyfill\" in opts ? opts.polyfill : newerIEUA.test(navigator.userAgent) || (navigator.userAgent.match(olderEdgeUA) || [])[1] < 10547 || (navigator.userAgent.match(webkitUA) || [])[1] < 537 || edgeUA.test(navigator.userAgent) && inIframe;\n        // create xhr requests object\n        var requests = {}, requestAnimationFrame = window.requestAnimationFrame || setTimeout, uses = document.getElementsByTagName(\"use\"), numberOfSvgUseElementsToBypass = 0;\n        // conditionally start the interval if the polyfill is active\n        polyfill && oninterval();\n    }\n    function getSVGAncestor(node) {\n        for (var svg = node; \"svg\" !== svg.nodeName.toLowerCase() && (svg = svg.parentNode); ) {}\n        return svg;\n    }\n    return svg4everybody;\n});"
  },
  {
    "path": "src/assets/javascripts/vendor/jquery/jquery.js",
    "content": "/*!\n * jQuery JavaScript Library v3.4.0\n * https://jquery.com/\n *\n * Includes Sizzle.js\n * https://sizzlejs.com/\n *\n * Copyright JS Foundation and other contributors\n * Released under the MIT license\n * https://jquery.org/license\n *\n * Date: 2019-04-10T19:48Z\n */\n( function( global, factory ) {\n\n\t\"use strict\";\n\n\tif ( typeof module === \"object\" && typeof module.exports === \"object\" ) {\n\n\t\t// For CommonJS and CommonJS-like environments where a proper `window`\n\t\t// is present, execute the factory and get jQuery.\n\t\t// For environments that do not have a `window` with a `document`\n\t\t// (such as Node.js), expose a factory as module.exports.\n\t\t// This accentuates the need for the creation of a real `window`.\n\t\t// e.g. var jQuery = require(\"jquery\")(window);\n\t\t// See ticket #14549 for more info.\n\t\tmodule.exports = global.document ?\n\t\t\tfactory( global, true ) :\n\t\t\tfunction( w ) {\n\t\t\t\tif ( !w.document ) {\n\t\t\t\t\tthrow new Error( \"jQuery requires a window with a document\" );\n\t\t\t\t}\n\t\t\t\treturn factory( w );\n\t\t\t};\n\t} else {\n\t\tfactory( global );\n\t}\n\n// Pass this if window is not defined yet\n} )( typeof window !== \"undefined\" ? window : this, function( window, noGlobal ) {\n\n// Edge <= 12 - 13+, Firefox <=18 - 45+, IE 10 - 11, Safari 5.1 - 9+, iOS 6 - 9.1\n// throw exceptions when non-strict code (e.g., ASP.NET 4.5) accesses strict mode\n// arguments.callee.caller (trac-13335). But as of jQuery 3.0 (2016), strict mode should be common\n// enough that all such attempts are guarded in a try block.\n\"use strict\";\n\nvar arr = [];\n\nvar document = window.document;\n\nvar getProto = Object.getPrototypeOf;\n\nvar slice = arr.slice;\n\nvar concat = arr.concat;\n\nvar push = arr.push;\n\nvar indexOf = arr.indexOf;\n\nvar class2type = {};\n\nvar toString = class2type.toString;\n\nvar hasOwn = class2type.hasOwnProperty;\n\nvar fnToString = hasOwn.toString;\n\nvar ObjectFunctionString = fnToString.call( Object );\n\nvar support = {};\n\nvar isFunction = function isFunction( obj ) {\n\n      // Support: Chrome <=57, Firefox <=52\n      // In some browsers, typeof returns \"function\" for HTML <object> elements\n      // (i.e., `typeof document.createElement( \"object\" ) === \"function\"`).\n      // We don't want to classify *any* DOM node as a function.\n      return typeof obj === \"function\" && typeof obj.nodeType !== \"number\";\n  };\n\n\nvar isWindow = function isWindow( obj ) {\n\t\treturn obj != null && obj === obj.window;\n\t};\n\n\n\n\n\tvar preservedScriptAttributes = {\n\t\ttype: true,\n\t\tsrc: true,\n\t\tnonce: true,\n\t\tnoModule: true\n\t};\n\n\tfunction DOMEval( code, node, doc ) {\n\t\tdoc = doc || document;\n\n\t\tvar i, val,\n\t\t\tscript = doc.createElement( \"script\" );\n\n\t\tscript.text = code;\n\t\tif ( node ) {\n\t\t\tfor ( i in preservedScriptAttributes ) {\n\n\t\t\t\t// Support: Firefox 64+, Edge 18+\n\t\t\t\t// Some browsers don't support the \"nonce\" property on scripts.\n\t\t\t\t// On the other hand, just using `getAttribute` is not enough as\n\t\t\t\t// the `nonce` attribute is reset to an empty string whenever it\n\t\t\t\t// becomes browsing-context connected.\n\t\t\t\t// See https://github.com/whatwg/html/issues/2369\n\t\t\t\t// See https://html.spec.whatwg.org/#nonce-attributes\n\t\t\t\t// The `node.getAttribute` check was added for the sake of\n\t\t\t\t// `jQuery.globalEval` so that it can fake a nonce-containing node\n\t\t\t\t// via an object.\n\t\t\t\tval = node[ i ] || node.getAttribute && node.getAttribute( i );\n\t\t\t\tif ( val ) {\n\t\t\t\t\tscript.setAttribute( i, val );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tdoc.head.appendChild( script ).parentNode.removeChild( script );\n\t}\n\n\nfunction toType( obj ) {\n\tif ( obj == null ) {\n\t\treturn obj + \"\";\n\t}\n\n\t// Support: Android <=2.3 only (functionish RegExp)\n\treturn typeof obj === \"object\" || typeof obj === \"function\" ?\n\t\tclass2type[ toString.call( obj ) ] || \"object\" :\n\t\ttypeof obj;\n}\n/* global Symbol */\n// Defining this global in .eslintrc.json would create a danger of using the global\n// unguarded in another place, it seems safer to define global only for this module\n\n\n\nvar\n\tversion = \"3.4.0\",\n\n\t// Define a local copy of jQuery\n\tjQuery = function( selector, context ) {\n\n\t\t// The jQuery object is actually just the init constructor 'enhanced'\n\t\t// Need init if jQuery is called (just allow error to be thrown if not included)\n\t\treturn new jQuery.fn.init( selector, context );\n\t},\n\n\t// Support: Android <=4.0 only\n\t// Make sure we trim BOM and NBSP\n\trtrim = /^[\\s\\uFEFF\\xA0]+|[\\s\\uFEFF\\xA0]+$/g;\n\njQuery.fn = jQuery.prototype = {\n\n\t// The current version of jQuery being used\n\tjquery: version,\n\n\tconstructor: jQuery,\n\n\t// The default length of a jQuery object is 0\n\tlength: 0,\n\n\ttoArray: function() {\n\t\treturn slice.call( this );\n\t},\n\n\t// Get the Nth element in the matched element set OR\n\t// Get the whole matched element set as a clean array\n\tget: function( num ) {\n\n\t\t// Return all the elements in a clean array\n\t\tif ( num == null ) {\n\t\t\treturn slice.call( this );\n\t\t}\n\n\t\t// Return just the one element from the set\n\t\treturn num < 0 ? this[ num + this.length ] : this[ num ];\n\t},\n\n\t// Take an array of elements and push it onto the stack\n\t// (returning the new matched element set)\n\tpushStack: function( elems ) {\n\n\t\t// Build a new jQuery matched element set\n\t\tvar ret = jQuery.merge( this.constructor(), elems );\n\n\t\t// Add the old object onto the stack (as a reference)\n\t\tret.prevObject = this;\n\n\t\t// Return the newly-formed element set\n\t\treturn ret;\n\t},\n\n\t// Execute a callback for every element in the matched set.\n\teach: function( callback ) {\n\t\treturn jQuery.each( this, callback );\n\t},\n\n\tmap: function( callback ) {\n\t\treturn this.pushStack( jQuery.map( this, function( elem, i ) {\n\t\t\treturn callback.call( elem, i, elem );\n\t\t} ) );\n\t},\n\n\tslice: function() {\n\t\treturn this.pushStack( slice.apply( this, arguments ) );\n\t},\n\n\tfirst: function() {\n\t\treturn this.eq( 0 );\n\t},\n\n\tlast: function() {\n\t\treturn this.eq( -1 );\n\t},\n\n\teq: function( i ) {\n\t\tvar len = this.length,\n\t\t\tj = +i + ( i < 0 ? len : 0 );\n\t\treturn this.pushStack( j >= 0 && j < len ? [ this[ j ] ] : [] );\n\t},\n\n\tend: function() {\n\t\treturn this.prevObject || this.constructor();\n\t},\n\n\t// For internal use only.\n\t// Behaves like an Array's method, not like a jQuery method.\n\tpush: push,\n\tsort: arr.sort,\n\tsplice: arr.splice\n};\n\njQuery.extend = jQuery.fn.extend = function() {\n\tvar options, name, src, copy, copyIsArray, clone,\n\t\ttarget = arguments[ 0 ] || {},\n\t\ti = 1,\n\t\tlength = arguments.length,\n\t\tdeep = false;\n\n\t// Handle a deep copy situation\n\tif ( typeof target === \"boolean\" ) {\n\t\tdeep = target;\n\n\t\t// Skip the boolean and the target\n\t\ttarget = arguments[ i ] || {};\n\t\ti++;\n\t}\n\n\t// Handle case when target is a string or something (possible in deep copy)\n\tif ( typeof target !== \"object\" && !isFunction( target ) ) {\n\t\ttarget = {};\n\t}\n\n\t// Extend jQuery itself if only one argument is passed\n\tif ( i === length ) {\n\t\ttarget = this;\n\t\ti--;\n\t}\n\n\tfor ( ; i < length; i++ ) {\n\n\t\t// Only deal with non-null/undefined values\n\t\tif ( ( options = arguments[ i ] ) != null ) {\n\n\t\t\t// Extend the base object\n\t\t\tfor ( name in options ) {\n\t\t\t\tcopy = options[ name ];\n\n\t\t\t\t// Prevent Object.prototype pollution\n\t\t\t\t// Prevent never-ending loop\n\t\t\t\tif ( name === \"__proto__\" || target === copy ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\t// Recurse if we're merging plain objects or arrays\n\t\t\t\tif ( deep && copy && ( jQuery.isPlainObject( copy ) ||\n\t\t\t\t\t( copyIsArray = Array.isArray( copy ) ) ) ) {\n\t\t\t\t\tsrc = target[ name ];\n\n\t\t\t\t\t// Ensure proper type for the source value\n\t\t\t\t\tif ( copyIsArray && !Array.isArray( src ) ) {\n\t\t\t\t\t\tclone = [];\n\t\t\t\t\t} else if ( !copyIsArray && !jQuery.isPlainObject( src ) ) {\n\t\t\t\t\t\tclone = {};\n\t\t\t\t\t} else {\n\t\t\t\t\t\tclone = src;\n\t\t\t\t\t}\n\t\t\t\t\tcopyIsArray = false;\n\n\t\t\t\t\t// Never move original objects, clone them\n\t\t\t\t\ttarget[ name ] = jQuery.extend( deep, clone, copy );\n\n\t\t\t\t// Don't bring in undefined values\n\t\t\t\t} else if ( copy !== undefined ) {\n\t\t\t\t\ttarget[ name ] = copy;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// Return the modified object\n\treturn target;\n};\n\njQuery.extend( {\n\n\t// Unique for each copy of jQuery on the page\n\texpando: \"jQuery\" + ( version + Math.random() ).replace( /\\D/g, \"\" ),\n\n\t// Assume jQuery is ready without the ready module\n\tisReady: true,\n\n\terror: function( msg ) {\n\t\tthrow new Error( msg );\n\t},\n\n\tnoop: function() {},\n\n\tisPlainObject: function( obj ) {\n\t\tvar proto, Ctor;\n\n\t\t// Detect obvious negatives\n\t\t// Use toString instead of jQuery.type to catch host objects\n\t\tif ( !obj || toString.call( obj ) !== \"[object Object]\" ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tproto = getProto( obj );\n\n\t\t// Objects with no prototype (e.g., `Object.create( null )`) are plain\n\t\tif ( !proto ) {\n\t\t\treturn true;\n\t\t}\n\n\t\t// Objects with prototype are plain iff they were constructed by a global Object function\n\t\tCtor = hasOwn.call( proto, \"constructor\" ) && proto.constructor;\n\t\treturn typeof Ctor === \"function\" && fnToString.call( Ctor ) === ObjectFunctionString;\n\t},\n\n\tisEmptyObject: function( obj ) {\n\t\tvar name;\n\n\t\tfor ( name in obj ) {\n\t\t\treturn false;\n\t\t}\n\t\treturn true;\n\t},\n\n\t// Evaluates a script in a global context\n\tglobalEval: function( code, options ) {\n\t\tDOMEval( code, { nonce: options && options.nonce } );\n\t},\n\n\teach: function( obj, callback ) {\n\t\tvar length, i = 0;\n\n\t\tif ( isArrayLike( obj ) ) {\n\t\t\tlength = obj.length;\n\t\t\tfor ( ; i < length; i++ ) {\n\t\t\t\tif ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tfor ( i in obj ) {\n\t\t\t\tif ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn obj;\n\t},\n\n\t// Support: Android <=4.0 only\n\ttrim: function( text ) {\n\t\treturn text == null ?\n\t\t\t\"\" :\n\t\t\t( text + \"\" ).replace( rtrim, \"\" );\n\t},\n\n\t// results is for internal usage only\n\tmakeArray: function( arr, results ) {\n\t\tvar ret = results || [];\n\n\t\tif ( arr != null ) {\n\t\t\tif ( isArrayLike( Object( arr ) ) ) {\n\t\t\t\tjQuery.merge( ret,\n\t\t\t\t\ttypeof arr === \"string\" ?\n\t\t\t\t\t[ arr ] : arr\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tpush.call( ret, arr );\n\t\t\t}\n\t\t}\n\n\t\treturn ret;\n\t},\n\n\tinArray: function( elem, arr, i ) {\n\t\treturn arr == null ? -1 : indexOf.call( arr, elem, i );\n\t},\n\n\t// Support: Android <=4.0 only, PhantomJS 1 only\n\t// push.apply(_, arraylike) throws on ancient WebKit\n\tmerge: function( first, second ) {\n\t\tvar len = +second.length,\n\t\t\tj = 0,\n\t\t\ti = first.length;\n\n\t\tfor ( ; j < len; j++ ) {\n\t\t\tfirst[ i++ ] = second[ j ];\n\t\t}\n\n\t\tfirst.length = i;\n\n\t\treturn first;\n\t},\n\n\tgrep: function( elems, callback, invert ) {\n\t\tvar callbackInverse,\n\t\t\tmatches = [],\n\t\t\ti = 0,\n\t\t\tlength = elems.length,\n\t\t\tcallbackExpect = !invert;\n\n\t\t// Go through the array, only saving the items\n\t\t// that pass the validator function\n\t\tfor ( ; i < length; i++ ) {\n\t\t\tcallbackInverse = !callback( elems[ i ], i );\n\t\t\tif ( callbackInverse !== callbackExpect ) {\n\t\t\t\tmatches.push( elems[ i ] );\n\t\t\t}\n\t\t}\n\n\t\treturn matches;\n\t},\n\n\t// arg is for internal usage only\n\tmap: function( elems, callback, arg ) {\n\t\tvar length, value,\n\t\t\ti = 0,\n\t\t\tret = [];\n\n\t\t// Go through the array, translating each of the items to their new values\n\t\tif ( isArrayLike( elems ) ) {\n\t\t\tlength = elems.length;\n\t\t\tfor ( ; i < length; i++ ) {\n\t\t\t\tvalue = callback( elems[ i ], i, arg );\n\n\t\t\t\tif ( value != null ) {\n\t\t\t\t\tret.push( value );\n\t\t\t\t}\n\t\t\t}\n\n\t\t// Go through every key on the object,\n\t\t} else {\n\t\t\tfor ( i in elems ) {\n\t\t\t\tvalue = callback( elems[ i ], i, arg );\n\n\t\t\t\tif ( value != null ) {\n\t\t\t\t\tret.push( value );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Flatten any nested arrays\n\t\treturn concat.apply( [], ret );\n\t},\n\n\t// A global GUID counter for objects\n\tguid: 1,\n\n\t// jQuery.support is not used in Core but other projects attach their\n\t// properties to it so it needs to exist.\n\tsupport: support\n} );\n\nif ( typeof Symbol === \"function\" ) {\n\tjQuery.fn[ Symbol.iterator ] = arr[ Symbol.iterator ];\n}\n\n// Populate the class2type map\njQuery.each( \"Boolean Number String Function Array Date RegExp Object Error Symbol\".split( \" \" ),\nfunction( i, name ) {\n\tclass2type[ \"[object \" + name + \"]\" ] = name.toLowerCase();\n} );\n\nfunction isArrayLike( obj ) {\n\n\t// Support: real iOS 8.2 only (not reproducible in simulator)\n\t// `in` check used to prevent JIT error (gh-2145)\n\t// hasOwn isn't used here due to false negatives\n\t// regarding Nodelist length in IE\n\tvar length = !!obj && \"length\" in obj && obj.length,\n\t\ttype = toType( obj );\n\n\tif ( isFunction( obj ) || isWindow( obj ) ) {\n\t\treturn false;\n\t}\n\n\treturn type === \"array\" || length === 0 ||\n\t\ttypeof length === \"number\" && length > 0 && ( length - 1 ) in obj;\n}\nvar Sizzle =\n/*!\n * Sizzle CSS Selector Engine v2.3.4\n * https://sizzlejs.com/\n *\n * Copyright JS Foundation and other contributors\n * Released under the MIT license\n * https://js.foundation/\n *\n * Date: 2019-04-08\n */\n(function( window ) {\n\nvar i,\n\tsupport,\n\tExpr,\n\tgetText,\n\tisXML,\n\ttokenize,\n\tcompile,\n\tselect,\n\toutermostContext,\n\tsortInput,\n\thasDuplicate,\n\n\t// Local document vars\n\tsetDocument,\n\tdocument,\n\tdocElem,\n\tdocumentIsHTML,\n\trbuggyQSA,\n\trbuggyMatches,\n\tmatches,\n\tcontains,\n\n\t// Instance-specific data\n\texpando = \"sizzle\" + 1 * new Date(),\n\tpreferredDoc = window.document,\n\tdirruns = 0,\n\tdone = 0,\n\tclassCache = createCache(),\n\ttokenCache = createCache(),\n\tcompilerCache = createCache(),\n\tnonnativeSelectorCache = createCache(),\n\tsortOrder = function( a, b ) {\n\t\tif ( a === b ) {\n\t\t\thasDuplicate = true;\n\t\t}\n\t\treturn 0;\n\t},\n\n\t// Instance methods\n\thasOwn = ({}).hasOwnProperty,\n\tarr = [],\n\tpop = arr.pop,\n\tpush_native = arr.push,\n\tpush = arr.push,\n\tslice = arr.slice,\n\t// Use a stripped-down indexOf as it's faster than native\n\t// https://jsperf.com/thor-indexof-vs-for/5\n\tindexOf = function( list, elem ) {\n\t\tvar i = 0,\n\t\t\tlen = list.length;\n\t\tfor ( ; i < len; i++ ) {\n\t\t\tif ( list[i] === elem ) {\n\t\t\t\treturn i;\n\t\t\t}\n\t\t}\n\t\treturn -1;\n\t},\n\n\tbooleans = \"checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped\",\n\n\t// Regular expressions\n\n\t// http://www.w3.org/TR/css3-selectors/#whitespace\n\twhitespace = \"[\\\\x20\\\\t\\\\r\\\\n\\\\f]\",\n\n\t// http://www.w3.org/TR/CSS21/syndata.html#value-def-identifier\n\tidentifier = \"(?:\\\\\\\\.|[\\\\w-]|[^\\0-\\\\xa0])+\",\n\n\t// Attribute selectors: http://www.w3.org/TR/selectors/#attribute-selectors\n\tattributes = \"\\\\[\" + whitespace + \"*(\" + identifier + \")(?:\" + whitespace +\n\t\t// Operator (capture 2)\n\t\t\"*([*^$|!~]?=)\" + whitespace +\n\t\t// \"Attribute values must be CSS identifiers [capture 5] or strings [capture 3 or capture 4]\"\n\t\t\"*(?:'((?:\\\\\\\\.|[^\\\\\\\\'])*)'|\\\"((?:\\\\\\\\.|[^\\\\\\\\\\\"])*)\\\"|(\" + identifier + \"))|)\" + whitespace +\n\t\t\"*\\\\]\",\n\n\tpseudos = \":(\" + identifier + \")(?:\\\\((\" +\n\t\t// To reduce the number of selectors needing tokenize in the preFilter, prefer arguments:\n\t\t// 1. quoted (capture 3; capture 4 or capture 5)\n\t\t\"('((?:\\\\\\\\.|[^\\\\\\\\'])*)'|\\\"((?:\\\\\\\\.|[^\\\\\\\\\\\"])*)\\\")|\" +\n\t\t// 2. simple (capture 6)\n\t\t\"((?:\\\\\\\\.|[^\\\\\\\\()[\\\\]]|\" + attributes + \")*)|\" +\n\t\t// 3. anything else (capture 2)\n\t\t\".*\" +\n\t\t\")\\\\)|)\",\n\n\t// Leading and non-escaped trailing whitespace, capturing some non-whitespace characters preceding the latter\n\trwhitespace = new RegExp( whitespace + \"+\", \"g\" ),\n\trtrim = new RegExp( \"^\" + whitespace + \"+|((?:^|[^\\\\\\\\])(?:\\\\\\\\.)*)\" + whitespace + \"+$\", \"g\" ),\n\n\trcomma = new RegExp( \"^\" + whitespace + \"*,\" + whitespace + \"*\" ),\n\trcombinators = new RegExp( \"^\" + whitespace + \"*([>+~]|\" + whitespace + \")\" + whitespace + \"*\" ),\n\trdescend = new RegExp( whitespace + \"|>\" ),\n\n\trpseudo = new RegExp( pseudos ),\n\tridentifier = new RegExp( \"^\" + identifier + \"$\" ),\n\n\tmatchExpr = {\n\t\t\"ID\": new RegExp( \"^#(\" + identifier + \")\" ),\n\t\t\"CLASS\": new RegExp( \"^\\\\.(\" + identifier + \")\" ),\n\t\t\"TAG\": new RegExp( \"^(\" + identifier + \"|[*])\" ),\n\t\t\"ATTR\": new RegExp( \"^\" + attributes ),\n\t\t\"PSEUDO\": new RegExp( \"^\" + pseudos ),\n\t\t\"CHILD\": new RegExp( \"^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\\\(\" + whitespace +\n\t\t\t\"*(even|odd|(([+-]|)(\\\\d*)n|)\" + whitespace + \"*(?:([+-]|)\" + whitespace +\n\t\t\t\"*(\\\\d+)|))\" + whitespace + \"*\\\\)|)\", \"i\" ),\n\t\t\"bool\": new RegExp( \"^(?:\" + booleans + \")$\", \"i\" ),\n\t\t// For use in libraries implementing .is()\n\t\t// We use this for POS matching in `select`\n\t\t\"needsContext\": new RegExp( \"^\" + whitespace + \"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\\\(\" +\n\t\t\twhitespace + \"*((?:-\\\\d)?\\\\d*)\" + whitespace + \"*\\\\)|)(?=[^-]|$)\", \"i\" )\n\t},\n\n\trhtml = /HTML$/i,\n\trinputs = /^(?:input|select|textarea|button)$/i,\n\trheader = /^h\\d$/i,\n\n\trnative = /^[^{]+\\{\\s*\\[native \\w/,\n\n\t// Easily-parseable/retrievable ID or TAG or CLASS selectors\n\trquickExpr = /^(?:#([\\w-]+)|(\\w+)|\\.([\\w-]+))$/,\n\n\trsibling = /[+~]/,\n\n\t// CSS escapes\n\t// http://www.w3.org/TR/CSS21/syndata.html#escaped-characters\n\trunescape = new RegExp( \"\\\\\\\\([\\\\da-f]{1,6}\" + whitespace + \"?|(\" + whitespace + \")|.)\", \"ig\" ),\n\tfunescape = function( _, escaped, escapedWhitespace ) {\n\t\tvar high = \"0x\" + escaped - 0x10000;\n\t\t// NaN means non-codepoint\n\t\t// Support: Firefox<24\n\t\t// Workaround erroneous numeric interpretation of +\"0x\"\n\t\treturn high !== high || escapedWhitespace ?\n\t\t\tescaped :\n\t\t\thigh < 0 ?\n\t\t\t\t// BMP codepoint\n\t\t\t\tString.fromCharCode( high + 0x10000 ) :\n\t\t\t\t// Supplemental Plane codepoint (surrogate pair)\n\t\t\t\tString.fromCharCode( high >> 10 | 0xD800, high & 0x3FF | 0xDC00 );\n\t},\n\n\t// CSS string/identifier serialization\n\t// https://drafts.csswg.org/cssom/#common-serializing-idioms\n\trcssescape = /([\\0-\\x1f\\x7f]|^-?\\d)|^-$|[^\\0-\\x1f\\x7f-\\uFFFF\\w-]/g,\n\tfcssescape = function( ch, asCodePoint ) {\n\t\tif ( asCodePoint ) {\n\n\t\t\t// U+0000 NULL becomes U+FFFD REPLACEMENT CHARACTER\n\t\t\tif ( ch === \"\\0\" ) {\n\t\t\t\treturn \"\\uFFFD\";\n\t\t\t}\n\n\t\t\t// Control characters and (dependent upon position) numbers get escaped as code points\n\t\t\treturn ch.slice( 0, -1 ) + \"\\\\\" + ch.charCodeAt( ch.length - 1 ).toString( 16 ) + \" \";\n\t\t}\n\n\t\t// Other potentially-special ASCII characters get backslash-escaped\n\t\treturn \"\\\\\" + ch;\n\t},\n\n\t// Used for iframes\n\t// See setDocument()\n\t// Removing the function wrapper causes a \"Permission Denied\"\n\t// error in IE\n\tunloadHandler = function() {\n\t\tsetDocument();\n\t},\n\n\tinDisabledFieldset = addCombinator(\n\t\tfunction( elem ) {\n\t\t\treturn elem.disabled === true && elem.nodeName.toLowerCase() === \"fieldset\";\n\t\t},\n\t\t{ dir: \"parentNode\", next: \"legend\" }\n\t);\n\n// Optimize for push.apply( _, NodeList )\ntry {\n\tpush.apply(\n\t\t(arr = slice.call( preferredDoc.childNodes )),\n\t\tpreferredDoc.childNodes\n\t);\n\t// Support: Android<4.0\n\t// Detect silently failing push.apply\n\tarr[ preferredDoc.childNodes.length ].nodeType;\n} catch ( e ) {\n\tpush = { apply: arr.length ?\n\n\t\t// Leverage slice if possible\n\t\tfunction( target, els ) {\n\t\t\tpush_native.apply( target, slice.call(els) );\n\t\t} :\n\n\t\t// Support: IE<9\n\t\t// Otherwise append directly\n\t\tfunction( target, els ) {\n\t\t\tvar j = target.length,\n\t\t\t\ti = 0;\n\t\t\t// Can't trust NodeList.length\n\t\t\twhile ( (target[j++] = els[i++]) ) {}\n\t\t\ttarget.length = j - 1;\n\t\t}\n\t};\n}\n\nfunction Sizzle( selector, context, results, seed ) {\n\tvar m, i, elem, nid, match, groups, newSelector,\n\t\tnewContext = context && context.ownerDocument,\n\n\t\t// nodeType defaults to 9, since context defaults to document\n\t\tnodeType = context ? context.nodeType : 9;\n\n\tresults = results || [];\n\n\t// Return early from calls with invalid selector or context\n\tif ( typeof selector !== \"string\" || !selector ||\n\t\tnodeType !== 1 && nodeType !== 9 && nodeType !== 11 ) {\n\n\t\treturn results;\n\t}\n\n\t// Try to shortcut find operations (as opposed to filters) in HTML documents\n\tif ( !seed ) {\n\n\t\tif ( ( context ? context.ownerDocument || context : preferredDoc ) !== document ) {\n\t\t\tsetDocument( context );\n\t\t}\n\t\tcontext = context || document;\n\n\t\tif ( documentIsHTML ) {\n\n\t\t\t// If the selector is sufficiently simple, try using a \"get*By*\" DOM method\n\t\t\t// (excepting DocumentFragment context, where the methods don't exist)\n\t\t\tif ( nodeType !== 11 && (match = rquickExpr.exec( selector )) ) {\n\n\t\t\t\t// ID selector\n\t\t\t\tif ( (m = match[1]) ) {\n\n\t\t\t\t\t// Document context\n\t\t\t\t\tif ( nodeType === 9 ) {\n\t\t\t\t\t\tif ( (elem = context.getElementById( m )) ) {\n\n\t\t\t\t\t\t\t// Support: IE, Opera, Webkit\n\t\t\t\t\t\t\t// TODO: identify versions\n\t\t\t\t\t\t\t// getElementById can match elements by name instead of ID\n\t\t\t\t\t\t\tif ( elem.id === m ) {\n\t\t\t\t\t\t\t\tresults.push( elem );\n\t\t\t\t\t\t\t\treturn results;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn results;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t// Element context\n\t\t\t\t\t} else {\n\n\t\t\t\t\t\t// Support: IE, Opera, Webkit\n\t\t\t\t\t\t// TODO: identify versions\n\t\t\t\t\t\t// getElementById can match elements by name instead of ID\n\t\t\t\t\t\tif ( newContext && (elem = newContext.getElementById( m )) &&\n\t\t\t\t\t\t\tcontains( context, elem ) &&\n\t\t\t\t\t\t\telem.id === m ) {\n\n\t\t\t\t\t\t\tresults.push( elem );\n\t\t\t\t\t\t\treturn results;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t// Type selector\n\t\t\t\t} else if ( match[2] ) {\n\t\t\t\t\tpush.apply( results, context.getElementsByTagName( selector ) );\n\t\t\t\t\treturn results;\n\n\t\t\t\t// Class selector\n\t\t\t\t} else if ( (m = match[3]) && support.getElementsByClassName &&\n\t\t\t\t\tcontext.getElementsByClassName ) {\n\n\t\t\t\t\tpush.apply( results, context.getElementsByClassName( m ) );\n\t\t\t\t\treturn results;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Take advantage of querySelectorAll\n\t\t\tif ( support.qsa &&\n\t\t\t\t!nonnativeSelectorCache[ selector + \" \" ] &&\n\t\t\t\t(!rbuggyQSA || !rbuggyQSA.test( selector )) &&\n\n\t\t\t\t// Support: IE 8 only\n\t\t\t\t// Exclude object elements\n\t\t\t\t(nodeType !== 1 || context.nodeName.toLowerCase() !== \"object\") ) {\n\n\t\t\t\tnewSelector = selector;\n\t\t\t\tnewContext = context;\n\n\t\t\t\t// qSA considers elements outside a scoping root when evaluating child or\n\t\t\t\t// descendant combinators, which is not what we want.\n\t\t\t\t// In such cases, we work around the behavior by prefixing every selector in the\n\t\t\t\t// list with an ID selector referencing the scope context.\n\t\t\t\t// Thanks to Andrew Dupont for this technique.\n\t\t\t\tif ( nodeType === 1 && rdescend.test( selector ) ) {\n\n\t\t\t\t\t// Capture the context ID, setting it first if necessary\n\t\t\t\t\tif ( (nid = context.getAttribute( \"id\" )) ) {\n\t\t\t\t\t\tnid = nid.replace( rcssescape, fcssescape );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tcontext.setAttribute( \"id\", (nid = expando) );\n\t\t\t\t\t}\n\n\t\t\t\t\t// Prefix every selector in the list\n\t\t\t\t\tgroups = tokenize( selector );\n\t\t\t\t\ti = groups.length;\n\t\t\t\t\twhile ( i-- ) {\n\t\t\t\t\t\tgroups[i] = \"#\" + nid + \" \" + toSelector( groups[i] );\n\t\t\t\t\t}\n\t\t\t\t\tnewSelector = groups.join( \",\" );\n\n\t\t\t\t\t// Expand context for sibling selectors\n\t\t\t\t\tnewContext = rsibling.test( selector ) && testContext( context.parentNode ) ||\n\t\t\t\t\t\tcontext;\n\t\t\t\t}\n\n\t\t\t\ttry {\n\t\t\t\t\tpush.apply( results,\n\t\t\t\t\t\tnewContext.querySelectorAll( newSelector )\n\t\t\t\t\t);\n\t\t\t\t\treturn results;\n\t\t\t\t} catch ( qsaError ) {\n\t\t\t\t\tnonnativeSelectorCache( selector, true );\n\t\t\t\t} finally {\n\t\t\t\t\tif ( nid === expando ) {\n\t\t\t\t\t\tcontext.removeAttribute( \"id\" );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// All others\n\treturn select( selector.replace( rtrim, \"$1\" ), context, results, seed );\n}\n\n/**\n * Create key-value caches of limited size\n * @returns {function(string, object)} Returns the Object data after storing it on itself with\n *\tproperty name the (space-suffixed) string and (if the cache is larger than Expr.cacheLength)\n *\tdeleting the oldest entry\n */\nfunction createCache() {\n\tvar keys = [];\n\n\tfunction cache( key, value ) {\n\t\t// Use (key + \" \") to avoid collision with native prototype properties (see Issue #157)\n\t\tif ( keys.push( key + \" \" ) > Expr.cacheLength ) {\n\t\t\t// Only keep the most recent entries\n\t\t\tdelete cache[ keys.shift() ];\n\t\t}\n\t\treturn (cache[ key + \" \" ] = value);\n\t}\n\treturn cache;\n}\n\n/**\n * Mark a function for special use by Sizzle\n * @param {Function} fn The function to mark\n */\nfunction markFunction( fn ) {\n\tfn[ expando ] = true;\n\treturn fn;\n}\n\n/**\n * Support testing using an element\n * @param {Function} fn Passed the created element and returns a boolean result\n */\nfunction assert( fn ) {\n\tvar el = document.createElement(\"fieldset\");\n\n\ttry {\n\t\treturn !!fn( el );\n\t} catch (e) {\n\t\treturn false;\n\t} finally {\n\t\t// Remove from its parent by default\n\t\tif ( el.parentNode ) {\n\t\t\tel.parentNode.removeChild( el );\n\t\t}\n\t\t// release memory in IE\n\t\tel = null;\n\t}\n}\n\n/**\n * Adds the same handler for all of the specified attrs\n * @param {String} attrs Pipe-separated list of attributes\n * @param {Function} handler The method that will be applied\n */\nfunction addHandle( attrs, handler ) {\n\tvar arr = attrs.split(\"|\"),\n\t\ti = arr.length;\n\n\twhile ( i-- ) {\n\t\tExpr.attrHandle[ arr[i] ] = handler;\n\t}\n}\n\n/**\n * Checks document order of two siblings\n * @param {Element} a\n * @param {Element} b\n * @returns {Number} Returns less than 0 if a precedes b, greater than 0 if a follows b\n */\nfunction siblingCheck( a, b ) {\n\tvar cur = b && a,\n\t\tdiff = cur && a.nodeType === 1 && b.nodeType === 1 &&\n\t\t\ta.sourceIndex - b.sourceIndex;\n\n\t// Use IE sourceIndex if available on both nodes\n\tif ( diff ) {\n\t\treturn diff;\n\t}\n\n\t// Check if b follows a\n\tif ( cur ) {\n\t\twhile ( (cur = cur.nextSibling) ) {\n\t\t\tif ( cur === b ) {\n\t\t\t\treturn -1;\n\t\t\t}\n\t\t}\n\t}\n\n\treturn a ? 1 : -1;\n}\n\n/**\n * Returns a function to use in pseudos for input types\n * @param {String} type\n */\nfunction createInputPseudo( type ) {\n\treturn function( elem ) {\n\t\tvar name = elem.nodeName.toLowerCase();\n\t\treturn name === \"input\" && elem.type === type;\n\t};\n}\n\n/**\n * Returns a function to use in pseudos for buttons\n * @param {String} type\n */\nfunction createButtonPseudo( type ) {\n\treturn function( elem ) {\n\t\tvar name = elem.nodeName.toLowerCase();\n\t\treturn (name === \"input\" || name === \"button\") && elem.type === type;\n\t};\n}\n\n/**\n * Returns a function to use in pseudos for :enabled/:disabled\n * @param {Boolean} disabled true for :disabled; false for :enabled\n */\nfunction createDisabledPseudo( disabled ) {\n\n\t// Known :disabled false positives: fieldset[disabled] > legend:nth-of-type(n+2) :can-disable\n\treturn function( elem ) {\n\n\t\t// Only certain elements can match :enabled or :disabled\n\t\t// https://html.spec.whatwg.org/multipage/scripting.html#selector-enabled\n\t\t// https://html.spec.whatwg.org/multipage/scripting.html#selector-disabled\n\t\tif ( \"form\" in elem ) {\n\n\t\t\t// Check for inherited disabledness on relevant non-disabled elements:\n\t\t\t// * listed form-associated elements in a disabled fieldset\n\t\t\t//   https://html.spec.whatwg.org/multipage/forms.html#category-listed\n\t\t\t//   https://html.spec.whatwg.org/multipage/forms.html#concept-fe-disabled\n\t\t\t// * option elements in a disabled optgroup\n\t\t\t//   https://html.spec.whatwg.org/multipage/forms.html#concept-option-disabled\n\t\t\t// All such elements have a \"form\" property.\n\t\t\tif ( elem.parentNode && elem.disabled === false ) {\n\n\t\t\t\t// Option elements defer to a parent optgroup if present\n\t\t\t\tif ( \"label\" in elem ) {\n\t\t\t\t\tif ( \"label\" in elem.parentNode ) {\n\t\t\t\t\t\treturn elem.parentNode.disabled === disabled;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn elem.disabled === disabled;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Support: IE 6 - 11\n\t\t\t\t// Use the isDisabled shortcut property to check for disabled fieldset ancestors\n\t\t\t\treturn elem.isDisabled === disabled ||\n\n\t\t\t\t\t// Where there is no isDisabled, check manually\n\t\t\t\t\t/* jshint -W018 */\n\t\t\t\t\telem.isDisabled !== !disabled &&\n\t\t\t\t\t\tinDisabledFieldset( elem ) === disabled;\n\t\t\t}\n\n\t\t\treturn elem.disabled === disabled;\n\n\t\t// Try to winnow out elements that can't be disabled before trusting the disabled property.\n\t\t// Some victims get caught in our net (label, legend, menu, track), but it shouldn't\n\t\t// even exist on them, let alone have a boolean value.\n\t\t} else if ( \"label\" in elem ) {\n\t\t\treturn elem.disabled === disabled;\n\t\t}\n\n\t\t// Remaining elements are neither :enabled nor :disabled\n\t\treturn false;\n\t};\n}\n\n/**\n * Returns a function to use in pseudos for positionals\n * @param {Function} fn\n */\nfunction createPositionalPseudo( fn ) {\n\treturn markFunction(function( argument ) {\n\t\targument = +argument;\n\t\treturn markFunction(function( seed, matches ) {\n\t\t\tvar j,\n\t\t\t\tmatchIndexes = fn( [], seed.length, argument ),\n\t\t\t\ti = matchIndexes.length;\n\n\t\t\t// Match elements found at the specified indexes\n\t\t\twhile ( i-- ) {\n\t\t\t\tif ( seed[ (j = matchIndexes[i]) ] ) {\n\t\t\t\t\tseed[j] = !(matches[j] = seed[j]);\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t});\n}\n\n/**\n * Checks a node for validity as a Sizzle context\n * @param {Element|Object=} context\n * @returns {Element|Object|Boolean} The input node if acceptable, otherwise a falsy value\n */\nfunction testContext( context ) {\n\treturn context && typeof context.getElementsByTagName !== \"undefined\" && context;\n}\n\n// Expose support vars for convenience\nsupport = Sizzle.support = {};\n\n/**\n * Detects XML nodes\n * @param {Element|Object} elem An element or a document\n * @returns {Boolean} True iff elem is a non-HTML XML node\n */\nisXML = Sizzle.isXML = function( elem ) {\n\tvar namespace = elem.namespaceURI,\n\t\tdocElem = (elem.ownerDocument || elem).documentElement;\n\n\t// Support: IE <=8\n\t// Assume HTML when documentElement doesn't yet exist, such as inside loading iframes\n\t// https://bugs.jquery.com/ticket/4833\n\treturn !rhtml.test( namespace || docElem && docElem.nodeName || \"HTML\" );\n};\n\n/**\n * Sets document-related variables once based on the current document\n * @param {Element|Object} [doc] An element or document object to use to set the document\n * @returns {Object} Returns the current document\n */\nsetDocument = Sizzle.setDocument = function( node ) {\n\tvar hasCompare, subWindow,\n\t\tdoc = node ? node.ownerDocument || node : preferredDoc;\n\n\t// Return early if doc is invalid or already selected\n\tif ( doc === document || doc.nodeType !== 9 || !doc.documentElement ) {\n\t\treturn document;\n\t}\n\n\t// Update global variables\n\tdocument = doc;\n\tdocElem = document.documentElement;\n\tdocumentIsHTML = !isXML( document );\n\n\t// Support: IE 9-11, Edge\n\t// Accessing iframe documents after unload throws \"permission denied\" errors (jQuery #13936)\n\tif ( preferredDoc !== document &&\n\t\t(subWindow = document.defaultView) && subWindow.top !== subWindow ) {\n\n\t\t// Support: IE 11, Edge\n\t\tif ( subWindow.addEventListener ) {\n\t\t\tsubWindow.addEventListener( \"unload\", unloadHandler, false );\n\n\t\t// Support: IE 9 - 10 only\n\t\t} else if ( subWindow.attachEvent ) {\n\t\t\tsubWindow.attachEvent( \"onunload\", unloadHandler );\n\t\t}\n\t}\n\n\t/* Attributes\n\t---------------------------------------------------------------------- */\n\n\t// Support: IE<8\n\t// Verify that getAttribute really returns attributes and not properties\n\t// (excepting IE8 booleans)\n\tsupport.attributes = assert(function( el ) {\n\t\tel.className = \"i\";\n\t\treturn !el.getAttribute(\"className\");\n\t});\n\n\t/* getElement(s)By*\n\t---------------------------------------------------------------------- */\n\n\t// Check if getElementsByTagName(\"*\") returns only elements\n\tsupport.getElementsByTagName = assert(function( el ) {\n\t\tel.appendChild( document.createComment(\"\") );\n\t\treturn !el.getElementsByTagName(\"*\").length;\n\t});\n\n\t// Support: IE<9\n\tsupport.getElementsByClassName = rnative.test( document.getElementsByClassName );\n\n\t// Support: IE<10\n\t// Check if getElementById returns elements by name\n\t// The broken getElementById methods don't pick up programmatically-set names,\n\t// so use a roundabout getElementsByName test\n\tsupport.getById = assert(function( el ) {\n\t\tdocElem.appendChild( el ).id = expando;\n\t\treturn !document.getElementsByName || !document.getElementsByName( expando ).length;\n\t});\n\n\t// ID filter and find\n\tif ( support.getById ) {\n\t\tExpr.filter[\"ID\"] = function( id ) {\n\t\t\tvar attrId = id.replace( runescape, funescape );\n\t\t\treturn function( elem ) {\n\t\t\t\treturn elem.getAttribute(\"id\") === attrId;\n\t\t\t};\n\t\t};\n\t\tExpr.find[\"ID\"] = function( id, context ) {\n\t\t\tif ( typeof context.getElementById !== \"undefined\" && documentIsHTML ) {\n\t\t\t\tvar elem = context.getElementById( id );\n\t\t\t\treturn elem ? [ elem ] : [];\n\t\t\t}\n\t\t};\n\t} else {\n\t\tExpr.filter[\"ID\"] =  function( id ) {\n\t\t\tvar attrId = id.replace( runescape, funescape );\n\t\t\treturn function( elem ) {\n\t\t\t\tvar node = typeof elem.getAttributeNode !== \"undefined\" &&\n\t\t\t\t\telem.getAttributeNode(\"id\");\n\t\t\t\treturn node && node.value === attrId;\n\t\t\t};\n\t\t};\n\n\t\t// Support: IE 6 - 7 only\n\t\t// getElementById is not reliable as a find shortcut\n\t\tExpr.find[\"ID\"] = function( id, context ) {\n\t\t\tif ( typeof context.getElementById !== \"undefined\" && documentIsHTML ) {\n\t\t\t\tvar node, i, elems,\n\t\t\t\t\telem = context.getElementById( id );\n\n\t\t\t\tif ( elem ) {\n\n\t\t\t\t\t// Verify the id attribute\n\t\t\t\t\tnode = elem.getAttributeNode(\"id\");\n\t\t\t\t\tif ( node && node.value === id ) {\n\t\t\t\t\t\treturn [ elem ];\n\t\t\t\t\t}\n\n\t\t\t\t\t// Fall back on getElementsByName\n\t\t\t\t\telems = context.getElementsByName( id );\n\t\t\t\t\ti = 0;\n\t\t\t\t\twhile ( (elem = elems[i++]) ) {\n\t\t\t\t\t\tnode = elem.getAttributeNode(\"id\");\n\t\t\t\t\t\tif ( node && node.value === id ) {\n\t\t\t\t\t\t\treturn [ elem ];\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn [];\n\t\t\t}\n\t\t};\n\t}\n\n\t// Tag\n\tExpr.find[\"TAG\"] = support.getElementsByTagName ?\n\t\tfunction( tag, context ) {\n\t\t\tif ( typeof context.getElementsByTagName !== \"undefined\" ) {\n\t\t\t\treturn context.getElementsByTagName( tag );\n\n\t\t\t// DocumentFragment nodes don't have gEBTN\n\t\t\t} else if ( support.qsa ) {\n\t\t\t\treturn context.querySelectorAll( tag );\n\t\t\t}\n\t\t} :\n\n\t\tfunction( tag, context ) {\n\t\t\tvar elem,\n\t\t\t\ttmp = [],\n\t\t\t\ti = 0,\n\t\t\t\t// By happy coincidence, a (broken) gEBTN appears on DocumentFragment nodes too\n\t\t\t\tresults = context.getElementsByTagName( tag );\n\n\t\t\t// Filter out possible comments\n\t\t\tif ( tag === \"*\" ) {\n\t\t\t\twhile ( (elem = results[i++]) ) {\n\t\t\t\t\tif ( elem.nodeType === 1 ) {\n\t\t\t\t\t\ttmp.push( elem );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn tmp;\n\t\t\t}\n\t\t\treturn results;\n\t\t};\n\n\t// Class\n\tExpr.find[\"CLASS\"] = support.getElementsByClassName && function( className, context ) {\n\t\tif ( typeof context.getElementsByClassName !== \"undefined\" && documentIsHTML ) {\n\t\t\treturn context.getElementsByClassName( className );\n\t\t}\n\t};\n\n\t/* QSA/matchesSelector\n\t---------------------------------------------------------------------- */\n\n\t// QSA and matchesSelector support\n\n\t// matchesSelector(:active) reports false when true (IE9/Opera 11.5)\n\trbuggyMatches = [];\n\n\t// qSa(:focus) reports false when true (Chrome 21)\n\t// We allow this because of a bug in IE8/9 that throws an error\n\t// whenever `document.activeElement` is accessed on an iframe\n\t// So, we allow :focus to pass through QSA all the time to avoid the IE error\n\t// See https://bugs.jquery.com/ticket/13378\n\trbuggyQSA = [];\n\n\tif ( (support.qsa = rnative.test( document.querySelectorAll )) ) {\n\t\t// Build QSA regex\n\t\t// Regex strategy adopted from Diego Perini\n\t\tassert(function( el ) {\n\t\t\t// Select is set to empty string on purpose\n\t\t\t// This is to test IE's treatment of not explicitly\n\t\t\t// setting a boolean content attribute,\n\t\t\t// since its presence should be enough\n\t\t\t// https://bugs.jquery.com/ticket/12359\n\t\t\tdocElem.appendChild( el ).innerHTML = \"<a id='\" + expando + \"'></a>\" +\n\t\t\t\t\"<select id='\" + expando + \"-\\r\\\\' msallowcapture=''>\" +\n\t\t\t\t\"<option selected=''></option></select>\";\n\n\t\t\t// Support: IE8, Opera 11-12.16\n\t\t\t// Nothing should be selected when empty strings follow ^= or $= or *=\n\t\t\t// The test attribute must be unknown in Opera but \"safe\" for WinRT\n\t\t\t// https://msdn.microsoft.com/en-us/library/ie/hh465388.aspx#attribute_section\n\t\t\tif ( el.querySelectorAll(\"[msallowcapture^='']\").length ) {\n\t\t\t\trbuggyQSA.push( \"[*^$]=\" + whitespace + \"*(?:''|\\\"\\\")\" );\n\t\t\t}\n\n\t\t\t// Support: IE8\n\t\t\t// Boolean attributes and \"value\" are not treated correctly\n\t\t\tif ( !el.querySelectorAll(\"[selected]\").length ) {\n\t\t\t\trbuggyQSA.push( \"\\\\[\" + whitespace + \"*(?:value|\" + booleans + \")\" );\n\t\t\t}\n\n\t\t\t// Support: Chrome<29, Android<4.4, Safari<7.0+, iOS<7.0+, PhantomJS<1.9.8+\n\t\t\tif ( !el.querySelectorAll( \"[id~=\" + expando + \"-]\" ).length ) {\n\t\t\t\trbuggyQSA.push(\"~=\");\n\t\t\t}\n\n\t\t\t// Webkit/Opera - :checked should return selected option elements\n\t\t\t// http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked\n\t\t\t// IE8 throws error here and will not see later tests\n\t\t\tif ( !el.querySelectorAll(\":checked\").length ) {\n\t\t\t\trbuggyQSA.push(\":checked\");\n\t\t\t}\n\n\t\t\t// Support: Safari 8+, iOS 8+\n\t\t\t// https://bugs.webkit.org/show_bug.cgi?id=136851\n\t\t\t// In-page `selector#id sibling-combinator selector` fails\n\t\t\tif ( !el.querySelectorAll( \"a#\" + expando + \"+*\" ).length ) {\n\t\t\t\trbuggyQSA.push(\".#.+[+~]\");\n\t\t\t}\n\t\t});\n\n\t\tassert(function( el ) {\n\t\t\tel.innerHTML = \"<a href='' disabled='disabled'></a>\" +\n\t\t\t\t\"<select disabled='disabled'><option/></select>\";\n\n\t\t\t// Support: Windows 8 Native Apps\n\t\t\t// The type and name attributes are restricted during .innerHTML assignment\n\t\t\tvar input = document.createElement(\"input\");\n\t\t\tinput.setAttribute( \"type\", \"hidden\" );\n\t\t\tel.appendChild( input ).setAttribute( \"name\", \"D\" );\n\n\t\t\t// Support: IE8\n\t\t\t// Enforce case-sensitivity of name attribute\n\t\t\tif ( el.querySelectorAll(\"[name=d]\").length ) {\n\t\t\t\trbuggyQSA.push( \"name\" + whitespace + \"*[*^$|!~]?=\" );\n\t\t\t}\n\n\t\t\t// FF 3.5 - :enabled/:disabled and hidden elements (hidden elements are still enabled)\n\t\t\t// IE8 throws error here and will not see later tests\n\t\t\tif ( el.querySelectorAll(\":enabled\").length !== 2 ) {\n\t\t\t\trbuggyQSA.push( \":enabled\", \":disabled\" );\n\t\t\t}\n\n\t\t\t// Support: IE9-11+\n\t\t\t// IE's :disabled selector does not pick up the children of disabled fieldsets\n\t\t\tdocElem.appendChild( el ).disabled = true;\n\t\t\tif ( el.querySelectorAll(\":disabled\").length !== 2 ) {\n\t\t\t\trbuggyQSA.push( \":enabled\", \":disabled\" );\n\t\t\t}\n\n\t\t\t// Opera 10-11 does not throw on post-comma invalid pseudos\n\t\t\tel.querySelectorAll(\"*,:x\");\n\t\t\trbuggyQSA.push(\",.*:\");\n\t\t});\n\t}\n\n\tif ( (support.matchesSelector = rnative.test( (matches = docElem.matches ||\n\t\tdocElem.webkitMatchesSelector ||\n\t\tdocElem.mozMatchesSelector ||\n\t\tdocElem.oMatchesSelector ||\n\t\tdocElem.msMatchesSelector) )) ) {\n\n\t\tassert(function( el ) {\n\t\t\t// Check to see if it's possible to do matchesSelector\n\t\t\t// on a disconnected node (IE 9)\n\t\t\tsupport.disconnectedMatch = matches.call( el, \"*\" );\n\n\t\t\t// This should fail with an exception\n\t\t\t// Gecko does not error, returns false instead\n\t\t\tmatches.call( el, \"[s!='']:x\" );\n\t\t\trbuggyMatches.push( \"!=\", pseudos );\n\t\t});\n\t}\n\n\trbuggyQSA = rbuggyQSA.length && new RegExp( rbuggyQSA.join(\"|\") );\n\trbuggyMatches = rbuggyMatches.length && new RegExp( rbuggyMatches.join(\"|\") );\n\n\t/* Contains\n\t---------------------------------------------------------------------- */\n\thasCompare = rnative.test( docElem.compareDocumentPosition );\n\n\t// Element contains another\n\t// Purposefully self-exclusive\n\t// As in, an element does not contain itself\n\tcontains = hasCompare || rnative.test( docElem.contains ) ?\n\t\tfunction( a, b ) {\n\t\t\tvar adown = a.nodeType === 9 ? a.documentElement : a,\n\t\t\t\tbup = b && b.parentNode;\n\t\t\treturn a === bup || !!( bup && bup.nodeType === 1 && (\n\t\t\t\tadown.contains ?\n\t\t\t\t\tadown.contains( bup ) :\n\t\t\t\t\ta.compareDocumentPosition && a.compareDocumentPosition( bup ) & 16\n\t\t\t));\n\t\t} :\n\t\tfunction( a, b ) {\n\t\t\tif ( b ) {\n\t\t\t\twhile ( (b = b.parentNode) ) {\n\t\t\t\t\tif ( b === a ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn false;\n\t\t};\n\n\t/* Sorting\n\t---------------------------------------------------------------------- */\n\n\t// Document order sorting\n\tsortOrder = hasCompare ?\n\tfunction( a, b ) {\n\n\t\t// Flag for duplicate removal\n\t\tif ( a === b ) {\n\t\t\thasDuplicate = true;\n\t\t\treturn 0;\n\t\t}\n\n\t\t// Sort on method existence if only one input has compareDocumentPosition\n\t\tvar compare = !a.compareDocumentPosition - !b.compareDocumentPosition;\n\t\tif ( compare ) {\n\t\t\treturn compare;\n\t\t}\n\n\t\t// Calculate position if both inputs belong to the same document\n\t\tcompare = ( a.ownerDocument || a ) === ( b.ownerDocument || b ) ?\n\t\t\ta.compareDocumentPosition( b ) :\n\n\t\t\t// Otherwise we know they are disconnected\n\t\t\t1;\n\n\t\t// Disconnected nodes\n\t\tif ( compare & 1 ||\n\t\t\t(!support.sortDetached && b.compareDocumentPosition( a ) === compare) ) {\n\n\t\t\t// Choose the first element that is related to our preferred document\n\t\t\tif ( a === document || a.ownerDocument === preferredDoc && contains(preferredDoc, a) ) {\n\t\t\t\treturn -1;\n\t\t\t}\n\t\t\tif ( b === document || b.ownerDocument === preferredDoc && contains(preferredDoc, b) ) {\n\t\t\t\treturn 1;\n\t\t\t}\n\n\t\t\t// Maintain original order\n\t\t\treturn sortInput ?\n\t\t\t\t( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) :\n\t\t\t\t0;\n\t\t}\n\n\t\treturn compare & 4 ? -1 : 1;\n\t} :\n\tfunction( a, b ) {\n\t\t// Exit early if the nodes are identical\n\t\tif ( a === b ) {\n\t\t\thasDuplicate = true;\n\t\t\treturn 0;\n\t\t}\n\n\t\tvar cur,\n\t\t\ti = 0,\n\t\t\taup = a.parentNode,\n\t\t\tbup = b.parentNode,\n\t\t\tap = [ a ],\n\t\t\tbp = [ b ];\n\n\t\t// Parentless nodes are either documents or disconnected\n\t\tif ( !aup || !bup ) {\n\t\t\treturn a === document ? -1 :\n\t\t\t\tb === document ? 1 :\n\t\t\t\taup ? -1 :\n\t\t\t\tbup ? 1 :\n\t\t\t\tsortInput ?\n\t\t\t\t( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) :\n\t\t\t\t0;\n\n\t\t// If the nodes are siblings, we can do a quick check\n\t\t} else if ( aup === bup ) {\n\t\t\treturn siblingCheck( a, b );\n\t\t}\n\n\t\t// Otherwise we need full lists of their ancestors for comparison\n\t\tcur = a;\n\t\twhile ( (cur = cur.parentNode) ) {\n\t\t\tap.unshift( cur );\n\t\t}\n\t\tcur = b;\n\t\twhile ( (cur = cur.parentNode) ) {\n\t\t\tbp.unshift( cur );\n\t\t}\n\n\t\t// Walk down the tree looking for a discrepancy\n\t\twhile ( ap[i] === bp[i] ) {\n\t\t\ti++;\n\t\t}\n\n\t\treturn i ?\n\t\t\t// Do a sibling check if the nodes have a common ancestor\n\t\t\tsiblingCheck( ap[i], bp[i] ) :\n\n\t\t\t// Otherwise nodes in our document sort first\n\t\t\tap[i] === preferredDoc ? -1 :\n\t\t\tbp[i] === preferredDoc ? 1 :\n\t\t\t0;\n\t};\n\n\treturn document;\n};\n\nSizzle.matches = function( expr, elements ) {\n\treturn Sizzle( expr, null, null, elements );\n};\n\nSizzle.matchesSelector = function( elem, expr ) {\n\t// Set document vars if needed\n\tif ( ( elem.ownerDocument || elem ) !== document ) {\n\t\tsetDocument( elem );\n\t}\n\n\tif ( support.matchesSelector && documentIsHTML &&\n\t\t!nonnativeSelectorCache[ expr + \" \" ] &&\n\t\t( !rbuggyMatches || !rbuggyMatches.test( expr ) ) &&\n\t\t( !rbuggyQSA     || !rbuggyQSA.test( expr ) ) ) {\n\n\t\ttry {\n\t\t\tvar ret = matches.call( elem, expr );\n\n\t\t\t// IE 9's matchesSelector returns false on disconnected nodes\n\t\t\tif ( ret || support.disconnectedMatch ||\n\t\t\t\t\t// As well, disconnected nodes are said to be in a document\n\t\t\t\t\t// fragment in IE 9\n\t\t\t\t\telem.document && elem.document.nodeType !== 11 ) {\n\t\t\t\treturn ret;\n\t\t\t}\n\t\t} catch (e) {\n\t\t\tnonnativeSelectorCache( expr, true );\n\t\t}\n\t}\n\n\treturn Sizzle( expr, document, null, [ elem ] ).length > 0;\n};\n\nSizzle.contains = function( context, elem ) {\n\t// Set document vars if needed\n\tif ( ( context.ownerDocument || context ) !== document ) {\n\t\tsetDocument( context );\n\t}\n\treturn contains( context, elem );\n};\n\nSizzle.attr = function( elem, name ) {\n\t// Set document vars if needed\n\tif ( ( elem.ownerDocument || elem ) !== document ) {\n\t\tsetDocument( elem );\n\t}\n\n\tvar fn = Expr.attrHandle[ name.toLowerCase() ],\n\t\t// Don't get fooled by Object.prototype properties (jQuery #13807)\n\t\tval = fn && hasOwn.call( Expr.attrHandle, name.toLowerCase() ) ?\n\t\t\tfn( elem, name, !documentIsHTML ) :\n\t\t\tundefined;\n\n\treturn val !== undefined ?\n\t\tval :\n\t\tsupport.attributes || !documentIsHTML ?\n\t\t\telem.getAttribute( name ) :\n\t\t\t(val = elem.getAttributeNode(name)) && val.specified ?\n\t\t\t\tval.value :\n\t\t\t\tnull;\n};\n\nSizzle.escape = function( sel ) {\n\treturn (sel + \"\").replace( rcssescape, fcssescape );\n};\n\nSizzle.error = function( msg ) {\n\tthrow new Error( \"Syntax error, unrecognized expression: \" + msg );\n};\n\n/**\n * Document sorting and removing duplicates\n * @param {ArrayLike} results\n */\nSizzle.uniqueSort = function( results ) {\n\tvar elem,\n\t\tduplicates = [],\n\t\tj = 0,\n\t\ti = 0;\n\n\t// Unless we *know* we can detect duplicates, assume their presence\n\thasDuplicate = !support.detectDuplicates;\n\tsortInput = !support.sortStable && results.slice( 0 );\n\tresults.sort( sortOrder );\n\n\tif ( hasDuplicate ) {\n\t\twhile ( (elem = results[i++]) ) {\n\t\t\tif ( elem === results[ i ] ) {\n\t\t\t\tj = duplicates.push( i );\n\t\t\t}\n\t\t}\n\t\twhile ( j-- ) {\n\t\t\tresults.splice( duplicates[ j ], 1 );\n\t\t}\n\t}\n\n\t// Clear input after sorting to release objects\n\t// See https://github.com/jquery/sizzle/pull/225\n\tsortInput = null;\n\n\treturn results;\n};\n\n/**\n * Utility function for retrieving the text value of an array of DOM nodes\n * @param {Array|Element} elem\n */\ngetText = Sizzle.getText = function( elem ) {\n\tvar node,\n\t\tret = \"\",\n\t\ti = 0,\n\t\tnodeType = elem.nodeType;\n\n\tif ( !nodeType ) {\n\t\t// If no nodeType, this is expected to be an array\n\t\twhile ( (node = elem[i++]) ) {\n\t\t\t// Do not traverse comment nodes\n\t\t\tret += getText( node );\n\t\t}\n\t} else if ( nodeType === 1 || nodeType === 9 || nodeType === 11 ) {\n\t\t// Use textContent for elements\n\t\t// innerText usage removed for consistency of new lines (jQuery #11153)\n\t\tif ( typeof elem.textContent === \"string\" ) {\n\t\t\treturn elem.textContent;\n\t\t} else {\n\t\t\t// Traverse its children\n\t\t\tfor ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {\n\t\t\t\tret += getText( elem );\n\t\t\t}\n\t\t}\n\t} else if ( nodeType === 3 || nodeType === 4 ) {\n\t\treturn elem.nodeValue;\n\t}\n\t// Do not include comment or processing instruction nodes\n\n\treturn ret;\n};\n\nExpr = Sizzle.selectors = {\n\n\t// Can be adjusted by the user\n\tcacheLength: 50,\n\n\tcreatePseudo: markFunction,\n\n\tmatch: matchExpr,\n\n\tattrHandle: {},\n\n\tfind: {},\n\n\trelative: {\n\t\t\">\": { dir: \"parentNode\", first: true },\n\t\t\" \": { dir: \"parentNode\" },\n\t\t\"+\": { dir: \"previousSibling\", first: true },\n\t\t\"~\": { dir: \"previousSibling\" }\n\t},\n\n\tpreFilter: {\n\t\t\"ATTR\": function( match ) {\n\t\t\tmatch[1] = match[1].replace( runescape, funescape );\n\n\t\t\t// Move the given value to match[3] whether quoted or unquoted\n\t\t\tmatch[3] = ( match[3] || match[4] || match[5] || \"\" ).replace( runescape, funescape );\n\n\t\t\tif ( match[2] === \"~=\" ) {\n\t\t\t\tmatch[3] = \" \" + match[3] + \" \";\n\t\t\t}\n\n\t\t\treturn match.slice( 0, 4 );\n\t\t},\n\n\t\t\"CHILD\": function( match ) {\n\t\t\t/* matches from matchExpr[\"CHILD\"]\n\t\t\t\t1 type (only|nth|...)\n\t\t\t\t2 what (child|of-type)\n\t\t\t\t3 argument (even|odd|\\d*|\\d*n([+-]\\d+)?|...)\n\t\t\t\t4 xn-component of xn+y argument ([+-]?\\d*n|)\n\t\t\t\t5 sign of xn-component\n\t\t\t\t6 x of xn-component\n\t\t\t\t7 sign of y-component\n\t\t\t\t8 y of y-component\n\t\t\t*/\n\t\t\tmatch[1] = match[1].toLowerCase();\n\n\t\t\tif ( match[1].slice( 0, 3 ) === \"nth\" ) {\n\t\t\t\t// nth-* requires argument\n\t\t\t\tif ( !match[3] ) {\n\t\t\t\t\tSizzle.error( match[0] );\n\t\t\t\t}\n\n\t\t\t\t// numeric x and y parameters for Expr.filter.CHILD\n\t\t\t\t// remember that false/true cast respectively to 0/1\n\t\t\t\tmatch[4] = +( match[4] ? match[5] + (match[6] || 1) : 2 * ( match[3] === \"even\" || match[3] === \"odd\" ) );\n\t\t\t\tmatch[5] = +( ( match[7] + match[8] ) || match[3] === \"odd\" );\n\n\t\t\t// other types prohibit arguments\n\t\t\t} else if ( match[3] ) {\n\t\t\t\tSizzle.error( match[0] );\n\t\t\t}\n\n\t\t\treturn match;\n\t\t},\n\n\t\t\"PSEUDO\": function( match ) {\n\t\t\tvar excess,\n\t\t\t\tunquoted = !match[6] && match[2];\n\n\t\t\tif ( matchExpr[\"CHILD\"].test( match[0] ) ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\t// Accept quoted arguments as-is\n\t\t\tif ( match[3] ) {\n\t\t\t\tmatch[2] = match[4] || match[5] || \"\";\n\n\t\t\t// Strip excess characters from unquoted arguments\n\t\t\t} else if ( unquoted && rpseudo.test( unquoted ) &&\n\t\t\t\t// Get excess from tokenize (recursively)\n\t\t\t\t(excess = tokenize( unquoted, true )) &&\n\t\t\t\t// advance to the next closing parenthesis\n\t\t\t\t(excess = unquoted.indexOf( \")\", unquoted.length - excess ) - unquoted.length) ) {\n\n\t\t\t\t// excess is a negative index\n\t\t\t\tmatch[0] = match[0].slice( 0, excess );\n\t\t\t\tmatch[2] = unquoted.slice( 0, excess );\n\t\t\t}\n\n\t\t\t// Return only captures needed by the pseudo filter method (type and argument)\n\t\t\treturn match.slice( 0, 3 );\n\t\t}\n\t},\n\n\tfilter: {\n\n\t\t\"TAG\": function( nodeNameSelector ) {\n\t\t\tvar nodeName = nodeNameSelector.replace( runescape, funescape ).toLowerCase();\n\t\t\treturn nodeNameSelector === \"*\" ?\n\t\t\t\tfunction() { return true; } :\n\t\t\t\tfunction( elem ) {\n\t\t\t\t\treturn elem.nodeName && elem.nodeName.toLowerCase() === nodeName;\n\t\t\t\t};\n\t\t},\n\n\t\t\"CLASS\": function( className ) {\n\t\t\tvar pattern = classCache[ className + \" \" ];\n\n\t\t\treturn pattern ||\n\t\t\t\t(pattern = new RegExp( \"(^|\" + whitespace + \")\" + className + \"(\" + whitespace + \"|$)\" )) &&\n\t\t\t\tclassCache( className, function( elem ) {\n\t\t\t\t\treturn pattern.test( typeof elem.className === \"string\" && elem.className || typeof elem.getAttribute !== \"undefined\" && elem.getAttribute(\"class\") || \"\" );\n\t\t\t\t});\n\t\t},\n\n\t\t\"ATTR\": function( name, operator, check ) {\n\t\t\treturn function( elem ) {\n\t\t\t\tvar result = Sizzle.attr( elem, name );\n\n\t\t\t\tif ( result == null ) {\n\t\t\t\t\treturn operator === \"!=\";\n\t\t\t\t}\n\t\t\t\tif ( !operator ) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tresult += \"\";\n\n\t\t\t\treturn operator === \"=\" ? result === check :\n\t\t\t\t\toperator === \"!=\" ? result !== check :\n\t\t\t\t\toperator === \"^=\" ? check && result.indexOf( check ) === 0 :\n\t\t\t\t\toperator === \"*=\" ? check && result.indexOf( check ) > -1 :\n\t\t\t\t\toperator === \"$=\" ? check && result.slice( -check.length ) === check :\n\t\t\t\t\toperator === \"~=\" ? ( \" \" + result.replace( rwhitespace, \" \" ) + \" \" ).indexOf( check ) > -1 :\n\t\t\t\t\toperator === \"|=\" ? result === check || result.slice( 0, check.length + 1 ) === check + \"-\" :\n\t\t\t\t\tfalse;\n\t\t\t};\n\t\t},\n\n\t\t\"CHILD\": function( type, what, argument, first, last ) {\n\t\t\tvar simple = type.slice( 0, 3 ) !== \"nth\",\n\t\t\t\tforward = type.slice( -4 ) !== \"last\",\n\t\t\t\tofType = what === \"of-type\";\n\n\t\t\treturn first === 1 && last === 0 ?\n\n\t\t\t\t// Shortcut for :nth-*(n)\n\t\t\t\tfunction( elem ) {\n\t\t\t\t\treturn !!elem.parentNode;\n\t\t\t\t} :\n\n\t\t\t\tfunction( elem, context, xml ) {\n\t\t\t\t\tvar cache, uniqueCache, outerCache, node, nodeIndex, start,\n\t\t\t\t\t\tdir = simple !== forward ? \"nextSibling\" : \"previousSibling\",\n\t\t\t\t\t\tparent = elem.parentNode,\n\t\t\t\t\t\tname = ofType && elem.nodeName.toLowerCase(),\n\t\t\t\t\t\tuseCache = !xml && !ofType,\n\t\t\t\t\t\tdiff = false;\n\n\t\t\t\t\tif ( parent ) {\n\n\t\t\t\t\t\t// :(first|last|only)-(child|of-type)\n\t\t\t\t\t\tif ( simple ) {\n\t\t\t\t\t\t\twhile ( dir ) {\n\t\t\t\t\t\t\t\tnode = elem;\n\t\t\t\t\t\t\t\twhile ( (node = node[ dir ]) ) {\n\t\t\t\t\t\t\t\t\tif ( ofType ?\n\t\t\t\t\t\t\t\t\t\tnode.nodeName.toLowerCase() === name :\n\t\t\t\t\t\t\t\t\t\tnode.nodeType === 1 ) {\n\n\t\t\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// Reverse direction for :only-* (if we haven't yet done so)\n\t\t\t\t\t\t\t\tstart = dir = type === \"only\" && !start && \"nextSibling\";\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tstart = [ forward ? parent.firstChild : parent.lastChild ];\n\n\t\t\t\t\t\t// non-xml :nth-child(...) stores cache data on `parent`\n\t\t\t\t\t\tif ( forward && useCache ) {\n\n\t\t\t\t\t\t\t// Seek `elem` from a previously-cached index\n\n\t\t\t\t\t\t\t// ...in a gzip-friendly way\n\t\t\t\t\t\t\tnode = parent;\n\t\t\t\t\t\t\touterCache = node[ expando ] || (node[ expando ] = {});\n\n\t\t\t\t\t\t\t// Support: IE <9 only\n\t\t\t\t\t\t\t// Defend against cloned attroperties (jQuery gh-1709)\n\t\t\t\t\t\t\tuniqueCache = outerCache[ node.uniqueID ] ||\n\t\t\t\t\t\t\t\t(outerCache[ node.uniqueID ] = {});\n\n\t\t\t\t\t\t\tcache = uniqueCache[ type ] || [];\n\t\t\t\t\t\t\tnodeIndex = cache[ 0 ] === dirruns && cache[ 1 ];\n\t\t\t\t\t\t\tdiff = nodeIndex && cache[ 2 ];\n\t\t\t\t\t\t\tnode = nodeIndex && parent.childNodes[ nodeIndex ];\n\n\t\t\t\t\t\t\twhile ( (node = ++nodeIndex && node && node[ dir ] ||\n\n\t\t\t\t\t\t\t\t// Fallback to seeking `elem` from the start\n\t\t\t\t\t\t\t\t(diff = nodeIndex = 0) || start.pop()) ) {\n\n\t\t\t\t\t\t\t\t// When found, cache indexes on `parent` and break\n\t\t\t\t\t\t\t\tif ( node.nodeType === 1 && ++diff && node === elem ) {\n\t\t\t\t\t\t\t\t\tuniqueCache[ type ] = [ dirruns, nodeIndex, diff ];\n\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t// Use previously-cached element index if available\n\t\t\t\t\t\t\tif ( useCache ) {\n\t\t\t\t\t\t\t\t// ...in a gzip-friendly way\n\t\t\t\t\t\t\t\tnode = elem;\n\t\t\t\t\t\t\t\touterCache = node[ expando ] || (node[ expando ] = {});\n\n\t\t\t\t\t\t\t\t// Support: IE <9 only\n\t\t\t\t\t\t\t\t// Defend against cloned attroperties (jQuery gh-1709)\n\t\t\t\t\t\t\t\tuniqueCache = outerCache[ node.uniqueID ] ||\n\t\t\t\t\t\t\t\t\t(outerCache[ node.uniqueID ] = {});\n\n\t\t\t\t\t\t\t\tcache = uniqueCache[ type ] || [];\n\t\t\t\t\t\t\t\tnodeIndex = cache[ 0 ] === dirruns && cache[ 1 ];\n\t\t\t\t\t\t\t\tdiff = nodeIndex;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t// xml :nth-child(...)\n\t\t\t\t\t\t\t// or :nth-last-child(...) or :nth(-last)?-of-type(...)\n\t\t\t\t\t\t\tif ( diff === false ) {\n\t\t\t\t\t\t\t\t// Use the same loop as above to seek `elem` from the start\n\t\t\t\t\t\t\t\twhile ( (node = ++nodeIndex && node && node[ dir ] ||\n\t\t\t\t\t\t\t\t\t(diff = nodeIndex = 0) || start.pop()) ) {\n\n\t\t\t\t\t\t\t\t\tif ( ( ofType ?\n\t\t\t\t\t\t\t\t\t\tnode.nodeName.toLowerCase() === name :\n\t\t\t\t\t\t\t\t\t\tnode.nodeType === 1 ) &&\n\t\t\t\t\t\t\t\t\t\t++diff ) {\n\n\t\t\t\t\t\t\t\t\t\t// Cache the index of each encountered element\n\t\t\t\t\t\t\t\t\t\tif ( useCache ) {\n\t\t\t\t\t\t\t\t\t\t\touterCache = node[ expando ] || (node[ expando ] = {});\n\n\t\t\t\t\t\t\t\t\t\t\t// Support: IE <9 only\n\t\t\t\t\t\t\t\t\t\t\t// Defend against cloned attroperties (jQuery gh-1709)\n\t\t\t\t\t\t\t\t\t\t\tuniqueCache = outerCache[ node.uniqueID ] ||\n\t\t\t\t\t\t\t\t\t\t\t\t(outerCache[ node.uniqueID ] = {});\n\n\t\t\t\t\t\t\t\t\t\t\tuniqueCache[ type ] = [ dirruns, diff ];\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\tif ( node === elem ) {\n\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Incorporate the offset, then check against cycle size\n\t\t\t\t\t\tdiff -= last;\n\t\t\t\t\t\treturn diff === first || ( diff % first === 0 && diff / first >= 0 );\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t},\n\n\t\t\"PSEUDO\": function( pseudo, argument ) {\n\t\t\t// pseudo-class names are case-insensitive\n\t\t\t// http://www.w3.org/TR/selectors/#pseudo-classes\n\t\t\t// Prioritize by case sensitivity in case custom pseudos are added with uppercase letters\n\t\t\t// Remember that setFilters inherits from pseudos\n\t\t\tvar args,\n\t\t\t\tfn = Expr.pseudos[ pseudo ] || Expr.setFilters[ pseudo.toLowerCase() ] ||\n\t\t\t\t\tSizzle.error( \"unsupported pseudo: \" + pseudo );\n\n\t\t\t// The user may use createPseudo to indicate that\n\t\t\t// arguments are needed to create the filter function\n\t\t\t// just as Sizzle does\n\t\t\tif ( fn[ expando ] ) {\n\t\t\t\treturn fn( argument );\n\t\t\t}\n\n\t\t\t// But maintain support for old signatures\n\t\t\tif ( fn.length > 1 ) {\n\t\t\t\targs = [ pseudo, pseudo, \"\", argument ];\n\t\t\t\treturn Expr.setFilters.hasOwnProperty( pseudo.toLowerCase() ) ?\n\t\t\t\t\tmarkFunction(function( seed, matches ) {\n\t\t\t\t\t\tvar idx,\n\t\t\t\t\t\t\tmatched = fn( seed, argument ),\n\t\t\t\t\t\t\ti = matched.length;\n\t\t\t\t\t\twhile ( i-- ) {\n\t\t\t\t\t\t\tidx = indexOf( seed, matched[i] );\n\t\t\t\t\t\t\tseed[ idx ] = !( matches[ idx ] = matched[i] );\n\t\t\t\t\t\t}\n\t\t\t\t\t}) :\n\t\t\t\t\tfunction( elem ) {\n\t\t\t\t\t\treturn fn( elem, 0, args );\n\t\t\t\t\t};\n\t\t\t}\n\n\t\t\treturn fn;\n\t\t}\n\t},\n\n\tpseudos: {\n\t\t// Potentially complex pseudos\n\t\t\"not\": markFunction(function( selector ) {\n\t\t\t// Trim the selector passed to compile\n\t\t\t// to avoid treating leading and trailing\n\t\t\t// spaces as combinators\n\t\t\tvar input = [],\n\t\t\t\tresults = [],\n\t\t\t\tmatcher = compile( selector.replace( rtrim, \"$1\" ) );\n\n\t\t\treturn matcher[ expando ] ?\n\t\t\t\tmarkFunction(function( seed, matches, context, xml ) {\n\t\t\t\t\tvar elem,\n\t\t\t\t\t\tunmatched = matcher( seed, null, xml, [] ),\n\t\t\t\t\t\ti = seed.length;\n\n\t\t\t\t\t// Match elements unmatched by `matcher`\n\t\t\t\t\twhile ( i-- ) {\n\t\t\t\t\t\tif ( (elem = unmatched[i]) ) {\n\t\t\t\t\t\t\tseed[i] = !(matches[i] = elem);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}) :\n\t\t\t\tfunction( elem, context, xml ) {\n\t\t\t\t\tinput[0] = elem;\n\t\t\t\t\tmatcher( input, null, xml, results );\n\t\t\t\t\t// Don't keep the element (issue #299)\n\t\t\t\t\tinput[0] = null;\n\t\t\t\t\treturn !results.pop();\n\t\t\t\t};\n\t\t}),\n\n\t\t\"has\": markFunction(function( selector ) {\n\t\t\treturn function( elem ) {\n\t\t\t\treturn Sizzle( selector, elem ).length > 0;\n\t\t\t};\n\t\t}),\n\n\t\t\"contains\": markFunction(function( text ) {\n\t\t\ttext = text.replace( runescape, funescape );\n\t\t\treturn function( elem ) {\n\t\t\t\treturn ( elem.textContent || getText( elem ) ).indexOf( text ) > -1;\n\t\t\t};\n\t\t}),\n\n\t\t// \"Whether an element is represented by a :lang() selector\n\t\t// is based solely on the element's language value\n\t\t// being equal to the identifier C,\n\t\t// or beginning with the identifier C immediately followed by \"-\".\n\t\t// The matching of C against the element's language value is performed case-insensitively.\n\t\t// The identifier C does not have to be a valid language name.\"\n\t\t// http://www.w3.org/TR/selectors/#lang-pseudo\n\t\t\"lang\": markFunction( function( lang ) {\n\t\t\t// lang value must be a valid identifier\n\t\t\tif ( !ridentifier.test(lang || \"\") ) {\n\t\t\t\tSizzle.error( \"unsupported lang: \" + lang );\n\t\t\t}\n\t\t\tlang = lang.replace( runescape, funescape ).toLowerCase();\n\t\t\treturn function( elem ) {\n\t\t\t\tvar elemLang;\n\t\t\t\tdo {\n\t\t\t\t\tif ( (elemLang = documentIsHTML ?\n\t\t\t\t\t\telem.lang :\n\t\t\t\t\t\telem.getAttribute(\"xml:lang\") || elem.getAttribute(\"lang\")) ) {\n\n\t\t\t\t\t\telemLang = elemLang.toLowerCase();\n\t\t\t\t\t\treturn elemLang === lang || elemLang.indexOf( lang + \"-\" ) === 0;\n\t\t\t\t\t}\n\t\t\t\t} while ( (elem = elem.parentNode) && elem.nodeType === 1 );\n\t\t\t\treturn false;\n\t\t\t};\n\t\t}),\n\n\t\t// Miscellaneous\n\t\t\"target\": function( elem ) {\n\t\t\tvar hash = window.location && window.location.hash;\n\t\t\treturn hash && hash.slice( 1 ) === elem.id;\n\t\t},\n\n\t\t\"root\": function( elem ) {\n\t\t\treturn elem === docElem;\n\t\t},\n\n\t\t\"focus\": function( elem ) {\n\t\t\treturn elem === document.activeElement && (!document.hasFocus || document.hasFocus()) && !!(elem.type || elem.href || ~elem.tabIndex);\n\t\t},\n\n\t\t// Boolean properties\n\t\t\"enabled\": createDisabledPseudo( false ),\n\t\t\"disabled\": createDisabledPseudo( true ),\n\n\t\t\"checked\": function( elem ) {\n\t\t\t// In CSS3, :checked should return both checked and selected elements\n\t\t\t// http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked\n\t\t\tvar nodeName = elem.nodeName.toLowerCase();\n\t\t\treturn (nodeName === \"input\" && !!elem.checked) || (nodeName === \"option\" && !!elem.selected);\n\t\t},\n\n\t\t\"selected\": function( elem ) {\n\t\t\t// Accessing this property makes selected-by-default\n\t\t\t// options in Safari work properly\n\t\t\tif ( elem.parentNode ) {\n\t\t\t\telem.parentNode.selectedIndex;\n\t\t\t}\n\n\t\t\treturn elem.selected === true;\n\t\t},\n\n\t\t// Contents\n\t\t\"empty\": function( elem ) {\n\t\t\t// http://www.w3.org/TR/selectors/#empty-pseudo\n\t\t\t// :empty is negated by element (1) or content nodes (text: 3; cdata: 4; entity ref: 5),\n\t\t\t//   but not by others (comment: 8; processing instruction: 7; etc.)\n\t\t\t// nodeType < 6 works because attributes (2) do not appear as children\n\t\t\tfor ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {\n\t\t\t\tif ( elem.nodeType < 6 ) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn true;\n\t\t},\n\n\t\t\"parent\": function( elem ) {\n\t\t\treturn !Expr.pseudos[\"empty\"]( elem );\n\t\t},\n\n\t\t// Element/input types\n\t\t\"header\": function( elem ) {\n\t\t\treturn rheader.test( elem.nodeName );\n\t\t},\n\n\t\t\"input\": function( elem ) {\n\t\t\treturn rinputs.test( elem.nodeName );\n\t\t},\n\n\t\t\"button\": function( elem ) {\n\t\t\tvar name = elem.nodeName.toLowerCase();\n\t\t\treturn name === \"input\" && elem.type === \"button\" || name === \"button\";\n\t\t},\n\n\t\t\"text\": function( elem ) {\n\t\t\tvar attr;\n\t\t\treturn elem.nodeName.toLowerCase() === \"input\" &&\n\t\t\t\telem.type === \"text\" &&\n\n\t\t\t\t// Support: IE<8\n\t\t\t\t// New HTML5 attribute values (e.g., \"search\") appear with elem.type === \"text\"\n\t\t\t\t( (attr = elem.getAttribute(\"type\")) == null || attr.toLowerCase() === \"text\" );\n\t\t},\n\n\t\t// Position-in-collection\n\t\t\"first\": createPositionalPseudo(function() {\n\t\t\treturn [ 0 ];\n\t\t}),\n\n\t\t\"last\": createPositionalPseudo(function( matchIndexes, length ) {\n\t\t\treturn [ length - 1 ];\n\t\t}),\n\n\t\t\"eq\": createPositionalPseudo(function( matchIndexes, length, argument ) {\n\t\t\treturn [ argument < 0 ? argument + length : argument ];\n\t\t}),\n\n\t\t\"even\": createPositionalPseudo(function( matchIndexes, length ) {\n\t\t\tvar i = 0;\n\t\t\tfor ( ; i < length; i += 2 ) {\n\t\t\t\tmatchIndexes.push( i );\n\t\t\t}\n\t\t\treturn matchIndexes;\n\t\t}),\n\n\t\t\"odd\": createPositionalPseudo(function( matchIndexes, length ) {\n\t\t\tvar i = 1;\n\t\t\tfor ( ; i < length; i += 2 ) {\n\t\t\t\tmatchIndexes.push( i );\n\t\t\t}\n\t\t\treturn matchIndexes;\n\t\t}),\n\n\t\t\"lt\": createPositionalPseudo(function( matchIndexes, length, argument ) {\n\t\t\tvar i = argument < 0 ?\n\t\t\t\targument + length :\n\t\t\t\targument > length ?\n\t\t\t\t\tlength :\n\t\t\t\t\targument;\n\t\t\tfor ( ; --i >= 0; ) {\n\t\t\t\tmatchIndexes.push( i );\n\t\t\t}\n\t\t\treturn matchIndexes;\n\t\t}),\n\n\t\t\"gt\": createPositionalPseudo(function( matchIndexes, length, argument ) {\n\t\t\tvar i = argument < 0 ? argument + length : argument;\n\t\t\tfor ( ; ++i < length; ) {\n\t\t\t\tmatchIndexes.push( i );\n\t\t\t}\n\t\t\treturn matchIndexes;\n\t\t})\n\t}\n};\n\nExpr.pseudos[\"nth\"] = Expr.pseudos[\"eq\"];\n\n// Add button/input type pseudos\nfor ( i in { radio: true, checkbox: true, file: true, password: true, image: true } ) {\n\tExpr.pseudos[ i ] = createInputPseudo( i );\n}\nfor ( i in { submit: true, reset: true } ) {\n\tExpr.pseudos[ i ] = createButtonPseudo( i );\n}\n\n// Easy API for creating new setFilters\nfunction setFilters() {}\nsetFilters.prototype = Expr.filters = Expr.pseudos;\nExpr.setFilters = new setFilters();\n\ntokenize = Sizzle.tokenize = function( selector, parseOnly ) {\n\tvar matched, match, tokens, type,\n\t\tsoFar, groups, preFilters,\n\t\tcached = tokenCache[ selector + \" \" ];\n\n\tif ( cached ) {\n\t\treturn parseOnly ? 0 : cached.slice( 0 );\n\t}\n\n\tsoFar = selector;\n\tgroups = [];\n\tpreFilters = Expr.preFilter;\n\n\twhile ( soFar ) {\n\n\t\t// Comma and first run\n\t\tif ( !matched || (match = rcomma.exec( soFar )) ) {\n\t\t\tif ( match ) {\n\t\t\t\t// Don't consume trailing commas as valid\n\t\t\t\tsoFar = soFar.slice( match[0].length ) || soFar;\n\t\t\t}\n\t\t\tgroups.push( (tokens = []) );\n\t\t}\n\n\t\tmatched = false;\n\n\t\t// Combinators\n\t\tif ( (match = rcombinators.exec( soFar )) ) {\n\t\t\tmatched = match.shift();\n\t\t\ttokens.push({\n\t\t\t\tvalue: matched,\n\t\t\t\t// Cast descendant combinators to space\n\t\t\t\ttype: match[0].replace( rtrim, \" \" )\n\t\t\t});\n\t\t\tsoFar = soFar.slice( matched.length );\n\t\t}\n\n\t\t// Filters\n\t\tfor ( type in Expr.filter ) {\n\t\t\tif ( (match = matchExpr[ type ].exec( soFar )) && (!preFilters[ type ] ||\n\t\t\t\t(match = preFilters[ type ]( match ))) ) {\n\t\t\t\tmatched = match.shift();\n\t\t\t\ttokens.push({\n\t\t\t\t\tvalue: matched,\n\t\t\t\t\ttype: type,\n\t\t\t\t\tmatches: match\n\t\t\t\t});\n\t\t\t\tsoFar = soFar.slice( matched.length );\n\t\t\t}\n\t\t}\n\n\t\tif ( !matched ) {\n\t\t\tbreak;\n\t\t}\n\t}\n\n\t// Return the length of the invalid excess\n\t// if we're just parsing\n\t// Otherwise, throw an error or return tokens\n\treturn parseOnly ?\n\t\tsoFar.length :\n\t\tsoFar ?\n\t\t\tSizzle.error( selector ) :\n\t\t\t// Cache the tokens\n\t\t\ttokenCache( selector, groups ).slice( 0 );\n};\n\nfunction toSelector( tokens ) {\n\tvar i = 0,\n\t\tlen = tokens.length,\n\t\tselector = \"\";\n\tfor ( ; i < len; i++ ) {\n\t\tselector += tokens[i].value;\n\t}\n\treturn selector;\n}\n\nfunction addCombinator( matcher, combinator, base ) {\n\tvar dir = combinator.dir,\n\t\tskip = combinator.next,\n\t\tkey = skip || dir,\n\t\tcheckNonElements = base && key === \"parentNode\",\n\t\tdoneName = done++;\n\n\treturn combinator.first ?\n\t\t// Check against closest ancestor/preceding element\n\t\tfunction( elem, context, xml ) {\n\t\t\twhile ( (elem = elem[ dir ]) ) {\n\t\t\t\tif ( elem.nodeType === 1 || checkNonElements ) {\n\t\t\t\t\treturn matcher( elem, context, xml );\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn false;\n\t\t} :\n\n\t\t// Check against all ancestor/preceding elements\n\t\tfunction( elem, context, xml ) {\n\t\t\tvar oldCache, uniqueCache, outerCache,\n\t\t\t\tnewCache = [ dirruns, doneName ];\n\n\t\t\t// We can't set arbitrary data on XML nodes, so they don't benefit from combinator caching\n\t\t\tif ( xml ) {\n\t\t\t\twhile ( (elem = elem[ dir ]) ) {\n\t\t\t\t\tif ( elem.nodeType === 1 || checkNonElements ) {\n\t\t\t\t\t\tif ( matcher( elem, context, xml ) ) {\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\twhile ( (elem = elem[ dir ]) ) {\n\t\t\t\t\tif ( elem.nodeType === 1 || checkNonElements ) {\n\t\t\t\t\t\touterCache = elem[ expando ] || (elem[ expando ] = {});\n\n\t\t\t\t\t\t// Support: IE <9 only\n\t\t\t\t\t\t// Defend against cloned attroperties (jQuery gh-1709)\n\t\t\t\t\t\tuniqueCache = outerCache[ elem.uniqueID ] || (outerCache[ elem.uniqueID ] = {});\n\n\t\t\t\t\t\tif ( skip && skip === elem.nodeName.toLowerCase() ) {\n\t\t\t\t\t\t\telem = elem[ dir ] || elem;\n\t\t\t\t\t\t} else if ( (oldCache = uniqueCache[ key ]) &&\n\t\t\t\t\t\t\toldCache[ 0 ] === dirruns && oldCache[ 1 ] === doneName ) {\n\n\t\t\t\t\t\t\t// Assign to newCache so results back-propagate to previous elements\n\t\t\t\t\t\t\treturn (newCache[ 2 ] = oldCache[ 2 ]);\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t// Reuse newcache so results back-propagate to previous elements\n\t\t\t\t\t\t\tuniqueCache[ key ] = newCache;\n\n\t\t\t\t\t\t\t// A match means we're done; a fail means we have to keep checking\n\t\t\t\t\t\t\tif ( (newCache[ 2 ] = matcher( elem, context, xml )) ) {\n\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn false;\n\t\t};\n}\n\nfunction elementMatcher( matchers ) {\n\treturn matchers.length > 1 ?\n\t\tfunction( elem, context, xml ) {\n\t\t\tvar i = matchers.length;\n\t\t\twhile ( i-- ) {\n\t\t\t\tif ( !matchers[i]( elem, context, xml ) ) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn true;\n\t\t} :\n\t\tmatchers[0];\n}\n\nfunction multipleContexts( selector, contexts, results ) {\n\tvar i = 0,\n\t\tlen = contexts.length;\n\tfor ( ; i < len; i++ ) {\n\t\tSizzle( selector, contexts[i], results );\n\t}\n\treturn results;\n}\n\nfunction condense( unmatched, map, filter, context, xml ) {\n\tvar elem,\n\t\tnewUnmatched = [],\n\t\ti = 0,\n\t\tlen = unmatched.length,\n\t\tmapped = map != null;\n\n\tfor ( ; i < len; i++ ) {\n\t\tif ( (elem = unmatched[i]) ) {\n\t\t\tif ( !filter || filter( elem, context, xml ) ) {\n\t\t\t\tnewUnmatched.push( elem );\n\t\t\t\tif ( mapped ) {\n\t\t\t\t\tmap.push( i );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\treturn newUnmatched;\n}\n\nfunction setMatcher( preFilter, selector, matcher, postFilter, postFinder, postSelector ) {\n\tif ( postFilter && !postFilter[ expando ] ) {\n\t\tpostFilter = setMatcher( postFilter );\n\t}\n\tif ( postFinder && !postFinder[ expando ] ) {\n\t\tpostFinder = setMatcher( postFinder, postSelector );\n\t}\n\treturn markFunction(function( seed, results, context, xml ) {\n\t\tvar temp, i, elem,\n\t\t\tpreMap = [],\n\t\t\tpostMap = [],\n\t\t\tpreexisting = results.length,\n\n\t\t\t// Get initial elements from seed or context\n\t\t\telems = seed || multipleContexts( selector || \"*\", context.nodeType ? [ context ] : context, [] ),\n\n\t\t\t// Prefilter to get matcher input, preserving a map for seed-results synchronization\n\t\t\tmatcherIn = preFilter && ( seed || !selector ) ?\n\t\t\t\tcondense( elems, preMap, preFilter, context, xml ) :\n\t\t\t\telems,\n\n\t\t\tmatcherOut = matcher ?\n\t\t\t\t// If we have a postFinder, or filtered seed, or non-seed postFilter or preexisting results,\n\t\t\t\tpostFinder || ( seed ? preFilter : preexisting || postFilter ) ?\n\n\t\t\t\t\t// ...intermediate processing is necessary\n\t\t\t\t\t[] :\n\n\t\t\t\t\t// ...otherwise use results directly\n\t\t\t\t\tresults :\n\t\t\t\tmatcherIn;\n\n\t\t// Find primary matches\n\t\tif ( matcher ) {\n\t\t\tmatcher( matcherIn, matcherOut, context, xml );\n\t\t}\n\n\t\t// Apply postFilter\n\t\tif ( postFilter ) {\n\t\t\ttemp = condense( matcherOut, postMap );\n\t\t\tpostFilter( temp, [], context, xml );\n\n\t\t\t// Un-match failing elements by moving them back to matcherIn\n\t\t\ti = temp.length;\n\t\t\twhile ( i-- ) {\n\t\t\t\tif ( (elem = temp[i]) ) {\n\t\t\t\t\tmatcherOut[ postMap[i] ] = !(matcherIn[ postMap[i] ] = elem);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif ( seed ) {\n\t\t\tif ( postFinder || preFilter ) {\n\t\t\t\tif ( postFinder ) {\n\t\t\t\t\t// Get the final matcherOut by condensing this intermediate into postFinder contexts\n\t\t\t\t\ttemp = [];\n\t\t\t\t\ti = matcherOut.length;\n\t\t\t\t\twhile ( i-- ) {\n\t\t\t\t\t\tif ( (elem = matcherOut[i]) ) {\n\t\t\t\t\t\t\t// Restore matcherIn since elem is not yet a final match\n\t\t\t\t\t\t\ttemp.push( (matcherIn[i] = elem) );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tpostFinder( null, (matcherOut = []), temp, xml );\n\t\t\t\t}\n\n\t\t\t\t// Move matched elements from seed to results to keep them synchronized\n\t\t\t\ti = matcherOut.length;\n\t\t\t\twhile ( i-- ) {\n\t\t\t\t\tif ( (elem = matcherOut[i]) &&\n\t\t\t\t\t\t(temp = postFinder ? indexOf( seed, elem ) : preMap[i]) > -1 ) {\n\n\t\t\t\t\t\tseed[temp] = !(results[temp] = elem);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t// Add elements to results, through postFinder if defined\n\t\t} else {\n\t\t\tmatcherOut = condense(\n\t\t\t\tmatcherOut === results ?\n\t\t\t\t\tmatcherOut.splice( preexisting, matcherOut.length ) :\n\t\t\t\t\tmatcherOut\n\t\t\t);\n\t\t\tif ( postFinder ) {\n\t\t\t\tpostFinder( null, results, matcherOut, xml );\n\t\t\t} else {\n\t\t\t\tpush.apply( results, matcherOut );\n\t\t\t}\n\t\t}\n\t});\n}\n\nfunction matcherFromTokens( tokens ) {\n\tvar checkContext, matcher, j,\n\t\tlen = tokens.length,\n\t\tleadingRelative = Expr.relative[ tokens[0].type ],\n\t\timplicitRelative = leadingRelative || Expr.relative[\" \"],\n\t\ti = leadingRelative ? 1 : 0,\n\n\t\t// The foundational matcher ensures that elements are reachable from top-level context(s)\n\t\tmatchContext = addCombinator( function( elem ) {\n\t\t\treturn elem === checkContext;\n\t\t}, implicitRelative, true ),\n\t\tmatchAnyContext = addCombinator( function( elem ) {\n\t\t\treturn indexOf( checkContext, elem ) > -1;\n\t\t}, implicitRelative, true ),\n\t\tmatchers = [ function( elem, context, xml ) {\n\t\t\tvar ret = ( !leadingRelative && ( xml || context !== outermostContext ) ) || (\n\t\t\t\t(checkContext = context).nodeType ?\n\t\t\t\t\tmatchContext( elem, context, xml ) :\n\t\t\t\t\tmatchAnyContext( elem, context, xml ) );\n\t\t\t// Avoid hanging onto element (issue #299)\n\t\t\tcheckContext = null;\n\t\t\treturn ret;\n\t\t} ];\n\n\tfor ( ; i < len; i++ ) {\n\t\tif ( (matcher = Expr.relative[ tokens[i].type ]) ) {\n\t\t\tmatchers = [ addCombinator(elementMatcher( matchers ), matcher) ];\n\t\t} else {\n\t\t\tmatcher = Expr.filter[ tokens[i].type ].apply( null, tokens[i].matches );\n\n\t\t\t// Return special upon seeing a positional matcher\n\t\t\tif ( matcher[ expando ] ) {\n\t\t\t\t// Find the next relative operator (if any) for proper handling\n\t\t\t\tj = ++i;\n\t\t\t\tfor ( ; j < len; j++ ) {\n\t\t\t\t\tif ( Expr.relative[ tokens[j].type ] ) {\n\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn setMatcher(\n\t\t\t\t\ti > 1 && elementMatcher( matchers ),\n\t\t\t\t\ti > 1 && toSelector(\n\t\t\t\t\t\t// If the preceding token was a descendant combinator, insert an implicit any-element `*`\n\t\t\t\t\t\ttokens.slice( 0, i - 1 ).concat({ value: tokens[ i - 2 ].type === \" \" ? \"*\" : \"\" })\n\t\t\t\t\t).replace( rtrim, \"$1\" ),\n\t\t\t\t\tmatcher,\n\t\t\t\t\ti < j && matcherFromTokens( tokens.slice( i, j ) ),\n\t\t\t\t\tj < len && matcherFromTokens( (tokens = tokens.slice( j )) ),\n\t\t\t\t\tj < len && toSelector( tokens )\n\t\t\t\t);\n\t\t\t}\n\t\t\tmatchers.push( matcher );\n\t\t}\n\t}\n\n\treturn elementMatcher( matchers );\n}\n\nfunction matcherFromGroupMatchers( elementMatchers, setMatchers ) {\n\tvar bySet = setMatchers.length > 0,\n\t\tbyElement = elementMatchers.length > 0,\n\t\tsuperMatcher = function( seed, context, xml, results, outermost ) {\n\t\t\tvar elem, j, matcher,\n\t\t\t\tmatchedCount = 0,\n\t\t\t\ti = \"0\",\n\t\t\t\tunmatched = seed && [],\n\t\t\t\tsetMatched = [],\n\t\t\t\tcontextBackup = outermostContext,\n\t\t\t\t// We must always have either seed elements or outermost context\n\t\t\t\telems = seed || byElement && Expr.find[\"TAG\"]( \"*\", outermost ),\n\t\t\t\t// Use integer dirruns iff this is the outermost matcher\n\t\t\t\tdirrunsUnique = (dirruns += contextBackup == null ? 1 : Math.random() || 0.1),\n\t\t\t\tlen = elems.length;\n\n\t\t\tif ( outermost ) {\n\t\t\t\toutermostContext = context === document || context || outermost;\n\t\t\t}\n\n\t\t\t// Add elements passing elementMatchers directly to results\n\t\t\t// Support: IE<9, Safari\n\t\t\t// Tolerate NodeList properties (IE: \"length\"; Safari: <number>) matching elements by id\n\t\t\tfor ( ; i !== len && (elem = elems[i]) != null; i++ ) {\n\t\t\t\tif ( byElement && elem ) {\n\t\t\t\t\tj = 0;\n\t\t\t\t\tif ( !context && elem.ownerDocument !== document ) {\n\t\t\t\t\t\tsetDocument( elem );\n\t\t\t\t\t\txml = !documentIsHTML;\n\t\t\t\t\t}\n\t\t\t\t\twhile ( (matcher = elementMatchers[j++]) ) {\n\t\t\t\t\t\tif ( matcher( elem, context || document, xml) ) {\n\t\t\t\t\t\t\tresults.push( elem );\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tif ( outermost ) {\n\t\t\t\t\t\tdirruns = dirrunsUnique;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Track unmatched elements for set filters\n\t\t\t\tif ( bySet ) {\n\t\t\t\t\t// They will have gone through all possible matchers\n\t\t\t\t\tif ( (elem = !matcher && elem) ) {\n\t\t\t\t\t\tmatchedCount--;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Lengthen the array for every element, matched or not\n\t\t\t\t\tif ( seed ) {\n\t\t\t\t\t\tunmatched.push( elem );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// `i` is now the count of elements visited above, and adding it to `matchedCount`\n\t\t\t// makes the latter nonnegative.\n\t\t\tmatchedCount += i;\n\n\t\t\t// Apply set filters to unmatched elements\n\t\t\t// NOTE: This can be skipped if there are no unmatched elements (i.e., `matchedCount`\n\t\t\t// equals `i`), unless we didn't visit _any_ elements in the above loop because we have\n\t\t\t// no element matchers and no seed.\n\t\t\t// Incrementing an initially-string \"0\" `i` allows `i` to remain a string only in that\n\t\t\t// case, which will result in a \"00\" `matchedCount` that differs from `i` but is also\n\t\t\t// numerically zero.\n\t\t\tif ( bySet && i !== matchedCount ) {\n\t\t\t\tj = 0;\n\t\t\t\twhile ( (matcher = setMatchers[j++]) ) {\n\t\t\t\t\tmatcher( unmatched, setMatched, context, xml );\n\t\t\t\t}\n\n\t\t\t\tif ( seed ) {\n\t\t\t\t\t// Reintegrate element matches to eliminate the need for sorting\n\t\t\t\t\tif ( matchedCount > 0 ) {\n\t\t\t\t\t\twhile ( i-- ) {\n\t\t\t\t\t\t\tif ( !(unmatched[i] || setMatched[i]) ) {\n\t\t\t\t\t\t\t\tsetMatched[i] = pop.call( results );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Discard index placeholder values to get only actual matches\n\t\t\t\t\tsetMatched = condense( setMatched );\n\t\t\t\t}\n\n\t\t\t\t// Add matches to results\n\t\t\t\tpush.apply( results, setMatched );\n\n\t\t\t\t// Seedless set matches succeeding multiple successful matchers stipulate sorting\n\t\t\t\tif ( outermost && !seed && setMatched.length > 0 &&\n\t\t\t\t\t( matchedCount + setMatchers.length ) > 1 ) {\n\n\t\t\t\t\tSizzle.uniqueSort( results );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Override manipulation of globals by nested matchers\n\t\t\tif ( outermost ) {\n\t\t\t\tdirruns = dirrunsUnique;\n\t\t\t\toutermostContext = contextBackup;\n\t\t\t}\n\n\t\t\treturn unmatched;\n\t\t};\n\n\treturn bySet ?\n\t\tmarkFunction( superMatcher ) :\n\t\tsuperMatcher;\n}\n\ncompile = Sizzle.compile = function( selector, match /* Internal Use Only */ ) {\n\tvar i,\n\t\tsetMatchers = [],\n\t\telementMatchers = [],\n\t\tcached = compilerCache[ selector + \" \" ];\n\n\tif ( !cached ) {\n\t\t// Generate a function of recursive functions that can be used to check each element\n\t\tif ( !match ) {\n\t\t\tmatch = tokenize( selector );\n\t\t}\n\t\ti = match.length;\n\t\twhile ( i-- ) {\n\t\t\tcached = matcherFromTokens( match[i] );\n\t\t\tif ( cached[ expando ] ) {\n\t\t\t\tsetMatchers.push( cached );\n\t\t\t} else {\n\t\t\t\telementMatchers.push( cached );\n\t\t\t}\n\t\t}\n\n\t\t// Cache the compiled function\n\t\tcached = compilerCache( selector, matcherFromGroupMatchers( elementMatchers, setMatchers ) );\n\n\t\t// Save selector and tokenization\n\t\tcached.selector = selector;\n\t}\n\treturn cached;\n};\n\n/**\n * A low-level selection function that works with Sizzle's compiled\n *  selector functions\n * @param {String|Function} selector A selector or a pre-compiled\n *  selector function built with Sizzle.compile\n * @param {Element} context\n * @param {Array} [results]\n * @param {Array} [seed] A set of elements to match against\n */\nselect = Sizzle.select = function( selector, context, results, seed ) {\n\tvar i, tokens, token, type, find,\n\t\tcompiled = typeof selector === \"function\" && selector,\n\t\tmatch = !seed && tokenize( (selector = compiled.selector || selector) );\n\n\tresults = results || [];\n\n\t// Try to minimize operations if there is only one selector in the list and no seed\n\t// (the latter of which guarantees us context)\n\tif ( match.length === 1 ) {\n\n\t\t// Reduce context if the leading compound selector is an ID\n\t\ttokens = match[0] = match[0].slice( 0 );\n\t\tif ( tokens.length > 2 && (token = tokens[0]).type === \"ID\" &&\n\t\t\t\tcontext.nodeType === 9 && documentIsHTML && Expr.relative[ tokens[1].type ] ) {\n\n\t\t\tcontext = ( Expr.find[\"ID\"]( token.matches[0].replace(runescape, funescape), context ) || [] )[0];\n\t\t\tif ( !context ) {\n\t\t\t\treturn results;\n\n\t\t\t// Precompiled matchers will still verify ancestry, so step up a level\n\t\t\t} else if ( compiled ) {\n\t\t\t\tcontext = context.parentNode;\n\t\t\t}\n\n\t\t\tselector = selector.slice( tokens.shift().value.length );\n\t\t}\n\n\t\t// Fetch a seed set for right-to-left matching\n\t\ti = matchExpr[\"needsContext\"].test( selector ) ? 0 : tokens.length;\n\t\twhile ( i-- ) {\n\t\t\ttoken = tokens[i];\n\n\t\t\t// Abort if we hit a combinator\n\t\t\tif ( Expr.relative[ (type = token.type) ] ) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tif ( (find = Expr.find[ type ]) ) {\n\t\t\t\t// Search, expanding context for leading sibling combinators\n\t\t\t\tif ( (seed = find(\n\t\t\t\t\ttoken.matches[0].replace( runescape, funescape ),\n\t\t\t\t\trsibling.test( tokens[0].type ) && testContext( context.parentNode ) || context\n\t\t\t\t)) ) {\n\n\t\t\t\t\t// If seed is empty or no tokens remain, we can return early\n\t\t\t\t\ttokens.splice( i, 1 );\n\t\t\t\t\tselector = seed.length && toSelector( tokens );\n\t\t\t\t\tif ( !selector ) {\n\t\t\t\t\t\tpush.apply( results, seed );\n\t\t\t\t\t\treturn results;\n\t\t\t\t\t}\n\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// Compile and execute a filtering function if one is not provided\n\t// Provide `match` to avoid retokenization if we modified the selector above\n\t( compiled || compile( selector, match ) )(\n\t\tseed,\n\t\tcontext,\n\t\t!documentIsHTML,\n\t\tresults,\n\t\t!context || rsibling.test( selector ) && testContext( context.parentNode ) || context\n\t);\n\treturn results;\n};\n\n// One-time assignments\n\n// Sort stability\nsupport.sortStable = expando.split(\"\").sort( sortOrder ).join(\"\") === expando;\n\n// Support: Chrome 14-35+\n// Always assume duplicates if they aren't passed to the comparison function\nsupport.detectDuplicates = !!hasDuplicate;\n\n// Initialize against the default document\nsetDocument();\n\n// Support: Webkit<537.32 - Safari 6.0.3/Chrome 25 (fixed in Chrome 27)\n// Detached nodes confoundingly follow *each other*\nsupport.sortDetached = assert(function( el ) {\n\t// Should return 1, but returns 4 (following)\n\treturn el.compareDocumentPosition( document.createElement(\"fieldset\") ) & 1;\n});\n\n// Support: IE<8\n// Prevent attribute/property \"interpolation\"\n// https://msdn.microsoft.com/en-us/library/ms536429%28VS.85%29.aspx\nif ( !assert(function( el ) {\n\tel.innerHTML = \"<a href='#'></a>\";\n\treturn el.firstChild.getAttribute(\"href\") === \"#\" ;\n}) ) {\n\taddHandle( \"type|href|height|width\", function( elem, name, isXML ) {\n\t\tif ( !isXML ) {\n\t\t\treturn elem.getAttribute( name, name.toLowerCase() === \"type\" ? 1 : 2 );\n\t\t}\n\t});\n}\n\n// Support: IE<9\n// Use defaultValue in place of getAttribute(\"value\")\nif ( !support.attributes || !assert(function( el ) {\n\tel.innerHTML = \"<input/>\";\n\tel.firstChild.setAttribute( \"value\", \"\" );\n\treturn el.firstChild.getAttribute( \"value\" ) === \"\";\n}) ) {\n\taddHandle( \"value\", function( elem, name, isXML ) {\n\t\tif ( !isXML && elem.nodeName.toLowerCase() === \"input\" ) {\n\t\t\treturn elem.defaultValue;\n\t\t}\n\t});\n}\n\n// Support: IE<9\n// Use getAttributeNode to fetch booleans when getAttribute lies\nif ( !assert(function( el ) {\n\treturn el.getAttribute(\"disabled\") == null;\n}) ) {\n\taddHandle( booleans, function( elem, name, isXML ) {\n\t\tvar val;\n\t\tif ( !isXML ) {\n\t\t\treturn elem[ name ] === true ? name.toLowerCase() :\n\t\t\t\t\t(val = elem.getAttributeNode( name )) && val.specified ?\n\t\t\t\t\tval.value :\n\t\t\t\tnull;\n\t\t}\n\t});\n}\n\nreturn Sizzle;\n\n})( window );\n\n\n\njQuery.find = Sizzle;\njQuery.expr = Sizzle.selectors;\n\n// Deprecated\njQuery.expr[ \":\" ] = jQuery.expr.pseudos;\njQuery.uniqueSort = jQuery.unique = Sizzle.uniqueSort;\njQuery.text = Sizzle.getText;\njQuery.isXMLDoc = Sizzle.isXML;\njQuery.contains = Sizzle.contains;\njQuery.escapeSelector = Sizzle.escape;\n\n\n\n\nvar dir = function( elem, dir, until ) {\n\tvar matched = [],\n\t\ttruncate = until !== undefined;\n\n\twhile ( ( elem = elem[ dir ] ) && elem.nodeType !== 9 ) {\n\t\tif ( elem.nodeType === 1 ) {\n\t\t\tif ( truncate && jQuery( elem ).is( until ) ) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tmatched.push( elem );\n\t\t}\n\t}\n\treturn matched;\n};\n\n\nvar siblings = function( n, elem ) {\n\tvar matched = [];\n\n\tfor ( ; n; n = n.nextSibling ) {\n\t\tif ( n.nodeType === 1 && n !== elem ) {\n\t\t\tmatched.push( n );\n\t\t}\n\t}\n\n\treturn matched;\n};\n\n\nvar rneedsContext = jQuery.expr.match.needsContext;\n\n\n\nfunction nodeName( elem, name ) {\n\n  return elem.nodeName && elem.nodeName.toLowerCase() === name.toLowerCase();\n\n};\nvar rsingleTag = ( /^<([a-z][^\\/\\0>:\\x20\\t\\r\\n\\f]*)[\\x20\\t\\r\\n\\f]*\\/?>(?:<\\/\\1>|)$/i );\n\n\n\n// Implement the identical functionality for filter and not\nfunction winnow( elements, qualifier, not ) {\n\tif ( isFunction( qualifier ) ) {\n\t\treturn jQuery.grep( elements, function( elem, i ) {\n\t\t\treturn !!qualifier.call( elem, i, elem ) !== not;\n\t\t} );\n\t}\n\n\t// Single element\n\tif ( qualifier.nodeType ) {\n\t\treturn jQuery.grep( elements, function( elem ) {\n\t\t\treturn ( elem === qualifier ) !== not;\n\t\t} );\n\t}\n\n\t// Arraylike of elements (jQuery, arguments, Array)\n\tif ( typeof qualifier !== \"string\" ) {\n\t\treturn jQuery.grep( elements, function( elem ) {\n\t\t\treturn ( indexOf.call( qualifier, elem ) > -1 ) !== not;\n\t\t} );\n\t}\n\n\t// Filtered directly for both simple and complex selectors\n\treturn jQuery.filter( qualifier, elements, not );\n}\n\njQuery.filter = function( expr, elems, not ) {\n\tvar elem = elems[ 0 ];\n\n\tif ( not ) {\n\t\texpr = \":not(\" + expr + \")\";\n\t}\n\n\tif ( elems.length === 1 && elem.nodeType === 1 ) {\n\t\treturn jQuery.find.matchesSelector( elem, expr ) ? [ elem ] : [];\n\t}\n\n\treturn jQuery.find.matches( expr, jQuery.grep( elems, function( elem ) {\n\t\treturn elem.nodeType === 1;\n\t} ) );\n};\n\njQuery.fn.extend( {\n\tfind: function( selector ) {\n\t\tvar i, ret,\n\t\t\tlen = this.length,\n\t\t\tself = this;\n\n\t\tif ( typeof selector !== \"string\" ) {\n\t\t\treturn this.pushStack( jQuery( selector ).filter( function() {\n\t\t\t\tfor ( i = 0; i < len; i++ ) {\n\t\t\t\t\tif ( jQuery.contains( self[ i ], this ) ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} ) );\n\t\t}\n\n\t\tret = this.pushStack( [] );\n\n\t\tfor ( i = 0; i < len; i++ ) {\n\t\t\tjQuery.find( selector, self[ i ], ret );\n\t\t}\n\n\t\treturn len > 1 ? jQuery.uniqueSort( ret ) : ret;\n\t},\n\tfilter: function( selector ) {\n\t\treturn this.pushStack( winnow( this, selector || [], false ) );\n\t},\n\tnot: function( selector ) {\n\t\treturn this.pushStack( winnow( this, selector || [], true ) );\n\t},\n\tis: function( selector ) {\n\t\treturn !!winnow(\n\t\t\tthis,\n\n\t\t\t// If this is a positional/relative selector, check membership in the returned set\n\t\t\t// so $(\"p:first\").is(\"p:last\") won't return true for a doc with two \"p\".\n\t\t\ttypeof selector === \"string\" && rneedsContext.test( selector ) ?\n\t\t\t\tjQuery( selector ) :\n\t\t\t\tselector || [],\n\t\t\tfalse\n\t\t).length;\n\t}\n} );\n\n\n// Initialize a jQuery object\n\n\n// A central reference to the root jQuery(document)\nvar rootjQuery,\n\n\t// A simple way to check for HTML strings\n\t// Prioritize #id over <tag> to avoid XSS via location.hash (#9521)\n\t// Strict HTML recognition (#11290: must start with <)\n\t// Shortcut simple #id case for speed\n\trquickExpr = /^(?:\\s*(<[\\w\\W]+>)[^>]*|#([\\w-]+))$/,\n\n\tinit = jQuery.fn.init = function( selector, context, root ) {\n\t\tvar match, elem;\n\n\t\t// HANDLE: $(\"\"), $(null), $(undefined), $(false)\n\t\tif ( !selector ) {\n\t\t\treturn this;\n\t\t}\n\n\t\t// Method init() accepts an alternate rootjQuery\n\t\t// so migrate can support jQuery.sub (gh-2101)\n\t\troot = root || rootjQuery;\n\n\t\t// Handle HTML strings\n\t\tif ( typeof selector === \"string\" ) {\n\t\t\tif ( selector[ 0 ] === \"<\" &&\n\t\t\t\tselector[ selector.length - 1 ] === \">\" &&\n\t\t\t\tselector.length >= 3 ) {\n\n\t\t\t\t// Assume that strings that start and end with <> are HTML and skip the regex check\n\t\t\t\tmatch = [ null, selector, null ];\n\n\t\t\t} else {\n\t\t\t\tmatch = rquickExpr.exec( selector );\n\t\t\t}\n\n\t\t\t// Match html or make sure no context is specified for #id\n\t\t\tif ( match && ( match[ 1 ] || !context ) ) {\n\n\t\t\t\t// HANDLE: $(html) -> $(array)\n\t\t\t\tif ( match[ 1 ] ) {\n\t\t\t\t\tcontext = context instanceof jQuery ? context[ 0 ] : context;\n\n\t\t\t\t\t// Option to run scripts is true for back-compat\n\t\t\t\t\t// Intentionally let the error be thrown if parseHTML is not present\n\t\t\t\t\tjQuery.merge( this, jQuery.parseHTML(\n\t\t\t\t\t\tmatch[ 1 ],\n\t\t\t\t\t\tcontext && context.nodeType ? context.ownerDocument || context : document,\n\t\t\t\t\t\ttrue\n\t\t\t\t\t) );\n\n\t\t\t\t\t// HANDLE: $(html, props)\n\t\t\t\t\tif ( rsingleTag.test( match[ 1 ] ) && jQuery.isPlainObject( context ) ) {\n\t\t\t\t\t\tfor ( match in context ) {\n\n\t\t\t\t\t\t\t// Properties of context are called as methods if possible\n\t\t\t\t\t\t\tif ( isFunction( this[ match ] ) ) {\n\t\t\t\t\t\t\t\tthis[ match ]( context[ match ] );\n\n\t\t\t\t\t\t\t// ...and otherwise set as attributes\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tthis.attr( match, context[ match ] );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn this;\n\n\t\t\t\t// HANDLE: $(#id)\n\t\t\t\t} else {\n\t\t\t\t\telem = document.getElementById( match[ 2 ] );\n\n\t\t\t\t\tif ( elem ) {\n\n\t\t\t\t\t\t// Inject the element directly into the jQuery object\n\t\t\t\t\t\tthis[ 0 ] = elem;\n\t\t\t\t\t\tthis.length = 1;\n\t\t\t\t\t}\n\t\t\t\t\treturn this;\n\t\t\t\t}\n\n\t\t\t// HANDLE: $(expr, $(...))\n\t\t\t} else if ( !context || context.jquery ) {\n\t\t\t\treturn ( context || root ).find( selector );\n\n\t\t\t// HANDLE: $(expr, context)\n\t\t\t// (which is just equivalent to: $(context).find(expr)\n\t\t\t} else {\n\t\t\t\treturn this.constructor( context ).find( selector );\n\t\t\t}\n\n\t\t// HANDLE: $(DOMElement)\n\t\t} else if ( selector.nodeType ) {\n\t\t\tthis[ 0 ] = selector;\n\t\t\tthis.length = 1;\n\t\t\treturn this;\n\n\t\t// HANDLE: $(function)\n\t\t// Shortcut for document ready\n\t\t} else if ( isFunction( selector ) ) {\n\t\t\treturn root.ready !== undefined ?\n\t\t\t\troot.ready( selector ) :\n\n\t\t\t\t// Execute immediately if ready is not present\n\t\t\t\tselector( jQuery );\n\t\t}\n\n\t\treturn jQuery.makeArray( selector, this );\n\t};\n\n// Give the init function the jQuery prototype for later instantiation\ninit.prototype = jQuery.fn;\n\n// Initialize central reference\nrootjQuery = jQuery( document );\n\n\nvar rparentsprev = /^(?:parents|prev(?:Until|All))/,\n\n\t// Methods guaranteed to produce a unique set when starting from a unique set\n\tguaranteedUnique = {\n\t\tchildren: true,\n\t\tcontents: true,\n\t\tnext: true,\n\t\tprev: true\n\t};\n\njQuery.fn.extend( {\n\thas: function( target ) {\n\t\tvar targets = jQuery( target, this ),\n\t\t\tl = targets.length;\n\n\t\treturn this.filter( function() {\n\t\t\tvar i = 0;\n\t\t\tfor ( ; i < l; i++ ) {\n\t\t\t\tif ( jQuery.contains( this, targets[ i ] ) ) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t},\n\n\tclosest: function( selectors, context ) {\n\t\tvar cur,\n\t\t\ti = 0,\n\t\t\tl = this.length,\n\t\t\tmatched = [],\n\t\t\ttargets = typeof selectors !== \"string\" && jQuery( selectors );\n\n\t\t// Positional selectors never match, since there's no _selection_ context\n\t\tif ( !rneedsContext.test( selectors ) ) {\n\t\t\tfor ( ; i < l; i++ ) {\n\t\t\t\tfor ( cur = this[ i ]; cur && cur !== context; cur = cur.parentNode ) {\n\n\t\t\t\t\t// Always skip document fragments\n\t\t\t\t\tif ( cur.nodeType < 11 && ( targets ?\n\t\t\t\t\t\ttargets.index( cur ) > -1 :\n\n\t\t\t\t\t\t// Don't pass non-elements to Sizzle\n\t\t\t\t\t\tcur.nodeType === 1 &&\n\t\t\t\t\t\t\tjQuery.find.matchesSelector( cur, selectors ) ) ) {\n\n\t\t\t\t\t\tmatched.push( cur );\n\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn this.pushStack( matched.length > 1 ? jQuery.uniqueSort( matched ) : matched );\n\t},\n\n\t// Determine the position of an element within the set\n\tindex: function( elem ) {\n\n\t\t// No argument, return index in parent\n\t\tif ( !elem ) {\n\t\t\treturn ( this[ 0 ] && this[ 0 ].parentNode ) ? this.first().prevAll().length : -1;\n\t\t}\n\n\t\t// Index in selector\n\t\tif ( typeof elem === \"string\" ) {\n\t\t\treturn indexOf.call( jQuery( elem ), this[ 0 ] );\n\t\t}\n\n\t\t// Locate the position of the desired element\n\t\treturn indexOf.call( this,\n\n\t\t\t// If it receives a jQuery object, the first element is used\n\t\t\telem.jquery ? elem[ 0 ] : elem\n\t\t);\n\t},\n\n\tadd: function( selector, context ) {\n\t\treturn this.pushStack(\n\t\t\tjQuery.uniqueSort(\n\t\t\t\tjQuery.merge( this.get(), jQuery( selector, context ) )\n\t\t\t)\n\t\t);\n\t},\n\n\taddBack: function( selector ) {\n\t\treturn this.add( selector == null ?\n\t\t\tthis.prevObject : this.prevObject.filter( selector )\n\t\t);\n\t}\n} );\n\nfunction sibling( cur, dir ) {\n\twhile ( ( cur = cur[ dir ] ) && cur.nodeType !== 1 ) {}\n\treturn cur;\n}\n\njQuery.each( {\n\tparent: function( elem ) {\n\t\tvar parent = elem.parentNode;\n\t\treturn parent && parent.nodeType !== 11 ? parent : null;\n\t},\n\tparents: function( elem ) {\n\t\treturn dir( elem, \"parentNode\" );\n\t},\n\tparentsUntil: function( elem, i, until ) {\n\t\treturn dir( elem, \"parentNode\", until );\n\t},\n\tnext: function( elem ) {\n\t\treturn sibling( elem, \"nextSibling\" );\n\t},\n\tprev: function( elem ) {\n\t\treturn sibling( elem, \"previousSibling\" );\n\t},\n\tnextAll: function( elem ) {\n\t\treturn dir( elem, \"nextSibling\" );\n\t},\n\tprevAll: function( elem ) {\n\t\treturn dir( elem, \"previousSibling\" );\n\t},\n\tnextUntil: function( elem, i, until ) {\n\t\treturn dir( elem, \"nextSibling\", until );\n\t},\n\tprevUntil: function( elem, i, until ) {\n\t\treturn dir( elem, \"previousSibling\", until );\n\t},\n\tsiblings: function( elem ) {\n\t\treturn siblings( ( elem.parentNode || {} ).firstChild, elem );\n\t},\n\tchildren: function( elem ) {\n\t\treturn siblings( elem.firstChild );\n\t},\n\tcontents: function( elem ) {\n\t\tif ( typeof elem.contentDocument !== \"undefined\" ) {\n\t\t\treturn elem.contentDocument;\n\t\t}\n\n\t\t// Support: IE 9 - 11 only, iOS 7 only, Android Browser <=4.3 only\n\t\t// Treat the template element as a regular one in browsers that\n\t\t// don't support it.\n\t\tif ( nodeName( elem, \"template\" ) ) {\n\t\t\telem = elem.content || elem;\n\t\t}\n\n\t\treturn jQuery.merge( [], elem.childNodes );\n\t}\n}, function( name, fn ) {\n\tjQuery.fn[ name ] = function( until, selector ) {\n\t\tvar matched = jQuery.map( this, fn, until );\n\n\t\tif ( name.slice( -5 ) !== \"Until\" ) {\n\t\t\tselector = until;\n\t\t}\n\n\t\tif ( selector && typeof selector === \"string\" ) {\n\t\t\tmatched = jQuery.filter( selector, matched );\n\t\t}\n\n\t\tif ( this.length > 1 ) {\n\n\t\t\t// Remove duplicates\n\t\t\tif ( !guaranteedUnique[ name ] ) {\n\t\t\t\tjQuery.uniqueSort( matched );\n\t\t\t}\n\n\t\t\t// Reverse order for parents* and prev-derivatives\n\t\t\tif ( rparentsprev.test( name ) ) {\n\t\t\t\tmatched.reverse();\n\t\t\t}\n\t\t}\n\n\t\treturn this.pushStack( matched );\n\t};\n} );\nvar rnothtmlwhite = ( /[^\\x20\\t\\r\\n\\f]+/g );\n\n\n\n// Convert String-formatted options into Object-formatted ones\nfunction createOptions( options ) {\n\tvar object = {};\n\tjQuery.each( options.match( rnothtmlwhite ) || [], function( _, flag ) {\n\t\tobject[ flag ] = true;\n\t} );\n\treturn object;\n}\n\n/*\n * Create a callback list using the following parameters:\n *\n *\toptions: an optional list of space-separated options that will change how\n *\t\t\tthe callback list behaves or a more traditional option object\n *\n * By default a callback list will act like an event callback list and can be\n * \"fired\" multiple times.\n *\n * Possible options:\n *\n *\tonce:\t\t\twill ensure the callback list can only be fired once (like a Deferred)\n *\n *\tmemory:\t\t\twill keep track of previous values and will call any callback added\n *\t\t\t\t\tafter the list has been fired right away with the latest \"memorized\"\n *\t\t\t\t\tvalues (like a Deferred)\n *\n *\tunique:\t\t\twill ensure a callback can only be added once (no duplicate in the list)\n *\n *\tstopOnFalse:\tinterrupt callings when a callback returns false\n *\n */\njQuery.Callbacks = function( options ) {\n\n\t// Convert options from String-formatted to Object-formatted if needed\n\t// (we check in cache first)\n\toptions = typeof options === \"string\" ?\n\t\tcreateOptions( options ) :\n\t\tjQuery.extend( {}, options );\n\n\tvar // Flag to know if list is currently firing\n\t\tfiring,\n\n\t\t// Last fire value for non-forgettable lists\n\t\tmemory,\n\n\t\t// Flag to know if list was already fired\n\t\tfired,\n\n\t\t// Flag to prevent firing\n\t\tlocked,\n\n\t\t// Actual callback list\n\t\tlist = [],\n\n\t\t// Queue of execution data for repeatable lists\n\t\tqueue = [],\n\n\t\t// Index of currently firing callback (modified by add/remove as needed)\n\t\tfiringIndex = -1,\n\n\t\t// Fire callbacks\n\t\tfire = function() {\n\n\t\t\t// Enforce single-firing\n\t\t\tlocked = locked || options.once;\n\n\t\t\t// Execute callbacks for all pending executions,\n\t\t\t// respecting firingIndex overrides and runtime changes\n\t\t\tfired = firing = true;\n\t\t\tfor ( ; queue.length; firingIndex = -1 ) {\n\t\t\t\tmemory = queue.shift();\n\t\t\t\twhile ( ++firingIndex < list.length ) {\n\n\t\t\t\t\t// Run callback and check for early termination\n\t\t\t\t\tif ( list[ firingIndex ].apply( memory[ 0 ], memory[ 1 ] ) === false &&\n\t\t\t\t\t\toptions.stopOnFalse ) {\n\n\t\t\t\t\t\t// Jump to end and forget the data so .add doesn't re-fire\n\t\t\t\t\t\tfiringIndex = list.length;\n\t\t\t\t\t\tmemory = false;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Forget the data if we're done with it\n\t\t\tif ( !options.memory ) {\n\t\t\t\tmemory = false;\n\t\t\t}\n\n\t\t\tfiring = false;\n\n\t\t\t// Clean up if we're done firing for good\n\t\t\tif ( locked ) {\n\n\t\t\t\t// Keep an empty list if we have data for future add calls\n\t\t\t\tif ( memory ) {\n\t\t\t\t\tlist = [];\n\n\t\t\t\t// Otherwise, this object is spent\n\t\t\t\t} else {\n\t\t\t\t\tlist = \"\";\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\t// Actual Callbacks object\n\t\tself = {\n\n\t\t\t// Add a callback or a collection of callbacks to the list\n\t\t\tadd: function() {\n\t\t\t\tif ( list ) {\n\n\t\t\t\t\t// If we have memory from a past run, we should fire after adding\n\t\t\t\t\tif ( memory && !firing ) {\n\t\t\t\t\t\tfiringIndex = list.length - 1;\n\t\t\t\t\t\tqueue.push( memory );\n\t\t\t\t\t}\n\n\t\t\t\t\t( function add( args ) {\n\t\t\t\t\t\tjQuery.each( args, function( _, arg ) {\n\t\t\t\t\t\t\tif ( isFunction( arg ) ) {\n\t\t\t\t\t\t\t\tif ( !options.unique || !self.has( arg ) ) {\n\t\t\t\t\t\t\t\t\tlist.push( arg );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} else if ( arg && arg.length && toType( arg ) !== \"string\" ) {\n\n\t\t\t\t\t\t\t\t// Inspect recursively\n\t\t\t\t\t\t\t\tadd( arg );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} );\n\t\t\t\t\t} )( arguments );\n\n\t\t\t\t\tif ( memory && !firing ) {\n\t\t\t\t\t\tfire();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this;\n\t\t\t},\n\n\t\t\t// Remove a callback from the list\n\t\t\tremove: function() {\n\t\t\t\tjQuery.each( arguments, function( _, arg ) {\n\t\t\t\t\tvar index;\n\t\t\t\t\twhile ( ( index = jQuery.inArray( arg, list, index ) ) > -1 ) {\n\t\t\t\t\t\tlist.splice( index, 1 );\n\n\t\t\t\t\t\t// Handle firing indexes\n\t\t\t\t\t\tif ( index <= firingIndex ) {\n\t\t\t\t\t\t\tfiringIndex--;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\treturn this;\n\t\t\t},\n\n\t\t\t// Check if a given callback is in the list.\n\t\t\t// If no argument is given, return whether or not list has callbacks attached.\n\t\t\thas: function( fn ) {\n\t\t\t\treturn fn ?\n\t\t\t\t\tjQuery.inArray( fn, list ) > -1 :\n\t\t\t\t\tlist.length > 0;\n\t\t\t},\n\n\t\t\t// Remove all callbacks from the list\n\t\t\tempty: function() {\n\t\t\t\tif ( list ) {\n\t\t\t\t\tlist = [];\n\t\t\t\t}\n\t\t\t\treturn this;\n\t\t\t},\n\n\t\t\t// Disable .fire and .add\n\t\t\t// Abort any current/pending executions\n\t\t\t// Clear all callbacks and values\n\t\t\tdisable: function() {\n\t\t\t\tlocked = queue = [];\n\t\t\t\tlist = memory = \"\";\n\t\t\t\treturn this;\n\t\t\t},\n\t\t\tdisabled: function() {\n\t\t\t\treturn !list;\n\t\t\t},\n\n\t\t\t// Disable .fire\n\t\t\t// Also disable .add unless we have memory (since it would have no effect)\n\t\t\t// Abort any pending executions\n\t\t\tlock: function() {\n\t\t\t\tlocked = queue = [];\n\t\t\t\tif ( !memory && !firing ) {\n\t\t\t\t\tlist = memory = \"\";\n\t\t\t\t}\n\t\t\t\treturn this;\n\t\t\t},\n\t\t\tlocked: function() {\n\t\t\t\treturn !!locked;\n\t\t\t},\n\n\t\t\t// Call all callbacks with the given context and arguments\n\t\t\tfireWith: function( context, args ) {\n\t\t\t\tif ( !locked ) {\n\t\t\t\t\targs = args || [];\n\t\t\t\t\targs = [ context, args.slice ? args.slice() : args ];\n\t\t\t\t\tqueue.push( args );\n\t\t\t\t\tif ( !firing ) {\n\t\t\t\t\t\tfire();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn this;\n\t\t\t},\n\n\t\t\t// Call all the callbacks with the given arguments\n\t\t\tfire: function() {\n\t\t\t\tself.fireWith( this, arguments );\n\t\t\t\treturn this;\n\t\t\t},\n\n\t\t\t// To know if the callbacks have already been called at least once\n\t\t\tfired: function() {\n\t\t\t\treturn !!fired;\n\t\t\t}\n\t\t};\n\n\treturn self;\n};\n\n\nfunction Identity( v ) {\n\treturn v;\n}\nfunction Thrower( ex ) {\n\tthrow ex;\n}\n\nfunction adoptValue( value, resolve, reject, noValue ) {\n\tvar method;\n\n\ttry {\n\n\t\t// Check for promise aspect first to privilege synchronous behavior\n\t\tif ( value && isFunction( ( method = value.promise ) ) ) {\n\t\t\tmethod.call( value ).done( resolve ).fail( reject );\n\n\t\t// Other thenables\n\t\t} else if ( value && isFunction( ( method = value.then ) ) ) {\n\t\t\tmethod.call( value, resolve, reject );\n\n\t\t// Other non-thenables\n\t\t} else {\n\n\t\t\t// Control `resolve` arguments by letting Array#slice cast boolean `noValue` to integer:\n\t\t\t// * false: [ value ].slice( 0 ) => resolve( value )\n\t\t\t// * true: [ value ].slice( 1 ) => resolve()\n\t\t\tresolve.apply( undefined, [ value ].slice( noValue ) );\n\t\t}\n\n\t// For Promises/A+, convert exceptions into rejections\n\t// Since jQuery.when doesn't unwrap thenables, we can skip the extra checks appearing in\n\t// Deferred#then to conditionally suppress rejection.\n\t} catch ( value ) {\n\n\t\t// Support: Android 4.0 only\n\t\t// Strict mode functions invoked without .call/.apply get global-object context\n\t\treject.apply( undefined, [ value ] );\n\t}\n}\n\njQuery.extend( {\n\n\tDeferred: function( func ) {\n\t\tvar tuples = [\n\n\t\t\t\t// action, add listener, callbacks,\n\t\t\t\t// ... .then handlers, argument index, [final state]\n\t\t\t\t[ \"notify\", \"progress\", jQuery.Callbacks( \"memory\" ),\n\t\t\t\t\tjQuery.Callbacks( \"memory\" ), 2 ],\n\t\t\t\t[ \"resolve\", \"done\", jQuery.Callbacks( \"once memory\" ),\n\t\t\t\t\tjQuery.Callbacks( \"once memory\" ), 0, \"resolved\" ],\n\t\t\t\t[ \"reject\", \"fail\", jQuery.Callbacks( \"once memory\" ),\n\t\t\t\t\tjQuery.Callbacks( \"once memory\" ), 1, \"rejected\" ]\n\t\t\t],\n\t\t\tstate = \"pending\",\n\t\t\tpromise = {\n\t\t\t\tstate: function() {\n\t\t\t\t\treturn state;\n\t\t\t\t},\n\t\t\t\talways: function() {\n\t\t\t\t\tdeferred.done( arguments ).fail( arguments );\n\t\t\t\t\treturn this;\n\t\t\t\t},\n\t\t\t\t\"catch\": function( fn ) {\n\t\t\t\t\treturn promise.then( null, fn );\n\t\t\t\t},\n\n\t\t\t\t// Keep pipe for back-compat\n\t\t\t\tpipe: function( /* fnDone, fnFail, fnProgress */ ) {\n\t\t\t\t\tvar fns = arguments;\n\n\t\t\t\t\treturn jQuery.Deferred( function( newDefer ) {\n\t\t\t\t\t\tjQuery.each( tuples, function( i, tuple ) {\n\n\t\t\t\t\t\t\t// Map tuples (progress, done, fail) to arguments (done, fail, progress)\n\t\t\t\t\t\t\tvar fn = isFunction( fns[ tuple[ 4 ] ] ) && fns[ tuple[ 4 ] ];\n\n\t\t\t\t\t\t\t// deferred.progress(function() { bind to newDefer or newDefer.notify })\n\t\t\t\t\t\t\t// deferred.done(function() { bind to newDefer or newDefer.resolve })\n\t\t\t\t\t\t\t// deferred.fail(function() { bind to newDefer or newDefer.reject })\n\t\t\t\t\t\t\tdeferred[ tuple[ 1 ] ]( function() {\n\t\t\t\t\t\t\t\tvar returned = fn && fn.apply( this, arguments );\n\t\t\t\t\t\t\t\tif ( returned && isFunction( returned.promise ) ) {\n\t\t\t\t\t\t\t\t\treturned.promise()\n\t\t\t\t\t\t\t\t\t\t.progress( newDefer.notify )\n\t\t\t\t\t\t\t\t\t\t.done( newDefer.resolve )\n\t\t\t\t\t\t\t\t\t\t.fail( newDefer.reject );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tnewDefer[ tuple[ 0 ] + \"With\" ](\n\t\t\t\t\t\t\t\t\t\tthis,\n\t\t\t\t\t\t\t\t\t\tfn ? [ returned ] : arguments\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tfns = null;\n\t\t\t\t\t} ).promise();\n\t\t\t\t},\n\t\t\t\tthen: function( onFulfilled, onRejected, onProgress ) {\n\t\t\t\t\tvar maxDepth = 0;\n\t\t\t\t\tfunction resolve( depth, deferred, handler, special ) {\n\t\t\t\t\t\treturn function() {\n\t\t\t\t\t\t\tvar that = this,\n\t\t\t\t\t\t\t\targs = arguments,\n\t\t\t\t\t\t\t\tmightThrow = function() {\n\t\t\t\t\t\t\t\t\tvar returned, then;\n\n\t\t\t\t\t\t\t\t\t// Support: Promises/A+ section 2.3.3.3.3\n\t\t\t\t\t\t\t\t\t// https://promisesaplus.com/#point-59\n\t\t\t\t\t\t\t\t\t// Ignore double-resolution attempts\n\t\t\t\t\t\t\t\t\tif ( depth < maxDepth ) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\treturned = handler.apply( that, args );\n\n\t\t\t\t\t\t\t\t\t// Support: Promises/A+ section 2.3.1\n\t\t\t\t\t\t\t\t\t// https://promisesaplus.com/#point-48\n\t\t\t\t\t\t\t\t\tif ( returned === deferred.promise() ) {\n\t\t\t\t\t\t\t\t\t\tthrow new TypeError( \"Thenable self-resolution\" );\n\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t// Support: Promises/A+ sections 2.3.3.1, 3.5\n\t\t\t\t\t\t\t\t\t// https://promisesaplus.com/#point-54\n\t\t\t\t\t\t\t\t\t// https://promisesaplus.com/#point-75\n\t\t\t\t\t\t\t\t\t// Retrieve `then` only once\n\t\t\t\t\t\t\t\t\tthen = returned &&\n\n\t\t\t\t\t\t\t\t\t\t// Support: Promises/A+ section 2.3.4\n\t\t\t\t\t\t\t\t\t\t// https://promisesaplus.com/#point-64\n\t\t\t\t\t\t\t\t\t\t// Only check objects and functions for thenability\n\t\t\t\t\t\t\t\t\t\t( typeof returned === \"object\" ||\n\t\t\t\t\t\t\t\t\t\t\ttypeof returned === \"function\" ) &&\n\t\t\t\t\t\t\t\t\t\treturned.then;\n\n\t\t\t\t\t\t\t\t\t// Handle a returned thenable\n\t\t\t\t\t\t\t\t\tif ( isFunction( then ) ) {\n\n\t\t\t\t\t\t\t\t\t\t// Special processors (notify) just wait for resolution\n\t\t\t\t\t\t\t\t\t\tif ( special ) {\n\t\t\t\t\t\t\t\t\t\t\tthen.call(\n\t\t\t\t\t\t\t\t\t\t\t\treturned,\n\t\t\t\t\t\t\t\t\t\t\t\tresolve( maxDepth, deferred, Identity, special ),\n\t\t\t\t\t\t\t\t\t\t\t\tresolve( maxDepth, deferred, Thrower, special )\n\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t// Normal processors (resolve) also hook into progress\n\t\t\t\t\t\t\t\t\t\t} else {\n\n\t\t\t\t\t\t\t\t\t\t\t// ...and disregard older resolution values\n\t\t\t\t\t\t\t\t\t\t\tmaxDepth++;\n\n\t\t\t\t\t\t\t\t\t\t\tthen.call(\n\t\t\t\t\t\t\t\t\t\t\t\treturned,\n\t\t\t\t\t\t\t\t\t\t\t\tresolve( maxDepth, deferred, Identity, special ),\n\t\t\t\t\t\t\t\t\t\t\t\tresolve( maxDepth, deferred, Thrower, special ),\n\t\t\t\t\t\t\t\t\t\t\t\tresolve( maxDepth, deferred, Identity,\n\t\t\t\t\t\t\t\t\t\t\t\t\tdeferred.notifyWith )\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t// Handle all other returned values\n\t\t\t\t\t\t\t\t\t} else {\n\n\t\t\t\t\t\t\t\t\t\t// Only substitute handlers pass on context\n\t\t\t\t\t\t\t\t\t\t// and multiple values (non-spec behavior)\n\t\t\t\t\t\t\t\t\t\tif ( handler !== Identity ) {\n\t\t\t\t\t\t\t\t\t\t\tthat = undefined;\n\t\t\t\t\t\t\t\t\t\t\targs = [ returned ];\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t// Process the value(s)\n\t\t\t\t\t\t\t\t\t\t// Default process is resolve\n\t\t\t\t\t\t\t\t\t\t( special || deferred.resolveWith )( that, args );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t},\n\n\t\t\t\t\t\t\t\t// Only normal processors (resolve) catch and reject exceptions\n\t\t\t\t\t\t\t\tprocess = special ?\n\t\t\t\t\t\t\t\t\tmightThrow :\n\t\t\t\t\t\t\t\t\tfunction() {\n\t\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\t\tmightThrow();\n\t\t\t\t\t\t\t\t\t\t} catch ( e ) {\n\n\t\t\t\t\t\t\t\t\t\t\tif ( jQuery.Deferred.exceptionHook ) {\n\t\t\t\t\t\t\t\t\t\t\t\tjQuery.Deferred.exceptionHook( e,\n\t\t\t\t\t\t\t\t\t\t\t\t\tprocess.stackTrace );\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\t// Support: Promises/A+ section 2.3.3.3.4.1\n\t\t\t\t\t\t\t\t\t\t\t// https://promisesaplus.com/#point-61\n\t\t\t\t\t\t\t\t\t\t\t// Ignore post-resolution exceptions\n\t\t\t\t\t\t\t\t\t\t\tif ( depth + 1 >= maxDepth ) {\n\n\t\t\t\t\t\t\t\t\t\t\t\t// Only substitute handlers pass on context\n\t\t\t\t\t\t\t\t\t\t\t\t// and multiple values (non-spec behavior)\n\t\t\t\t\t\t\t\t\t\t\t\tif ( handler !== Thrower ) {\n\t\t\t\t\t\t\t\t\t\t\t\t\tthat = undefined;\n\t\t\t\t\t\t\t\t\t\t\t\t\targs = [ e ];\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\t\tdeferred.rejectWith( that, args );\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\t// Support: Promises/A+ section 2.3.3.3.1\n\t\t\t\t\t\t\t// https://promisesaplus.com/#point-57\n\t\t\t\t\t\t\t// Re-resolve promises immediately to dodge false rejection from\n\t\t\t\t\t\t\t// subsequent errors\n\t\t\t\t\t\t\tif ( depth ) {\n\t\t\t\t\t\t\t\tprocess();\n\t\t\t\t\t\t\t} else {\n\n\t\t\t\t\t\t\t\t// Call an optional hook to record the stack, in case of exception\n\t\t\t\t\t\t\t\t// since it's otherwise lost when execution goes async\n\t\t\t\t\t\t\t\tif ( jQuery.Deferred.getStackHook ) {\n\t\t\t\t\t\t\t\t\tprocess.stackTrace = jQuery.Deferred.getStackHook();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\twindow.setTimeout( process );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\treturn jQuery.Deferred( function( newDefer ) {\n\n\t\t\t\t\t\t// progress_handlers.add( ... )\n\t\t\t\t\t\ttuples[ 0 ][ 3 ].add(\n\t\t\t\t\t\t\tresolve(\n\t\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t\tnewDefer,\n\t\t\t\t\t\t\t\tisFunction( onProgress ) ?\n\t\t\t\t\t\t\t\t\tonProgress :\n\t\t\t\t\t\t\t\t\tIdentity,\n\t\t\t\t\t\t\t\tnewDefer.notifyWith\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\t// fulfilled_handlers.add( ... )\n\t\t\t\t\t\ttuples[ 1 ][ 3 ].add(\n\t\t\t\t\t\t\tresolve(\n\t\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t\tnewDefer,\n\t\t\t\t\t\t\t\tisFunction( onFulfilled ) ?\n\t\t\t\t\t\t\t\t\tonFulfilled :\n\t\t\t\t\t\t\t\t\tIdentity\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\t// rejected_handlers.add( ... )\n\t\t\t\t\t\ttuples[ 2 ][ 3 ].add(\n\t\t\t\t\t\t\tresolve(\n\t\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t\tnewDefer,\n\t\t\t\t\t\t\t\tisFunction( onRejected ) ?\n\t\t\t\t\t\t\t\t\tonRejected :\n\t\t\t\t\t\t\t\t\tThrower\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t} ).promise();\n\t\t\t\t},\n\n\t\t\t\t// Get a promise for this deferred\n\t\t\t\t// If obj is provided, the promise aspect is added to the object\n\t\t\t\tpromise: function( obj ) {\n\t\t\t\t\treturn obj != null ? jQuery.extend( obj, promise ) : promise;\n\t\t\t\t}\n\t\t\t},\n\t\t\tdeferred = {};\n\n\t\t// Add list-specific methods\n\t\tjQuery.each( tuples, function( i, tuple ) {\n\t\t\tvar list = tuple[ 2 ],\n\t\t\t\tstateString = tuple[ 5 ];\n\n\t\t\t// promise.progress = list.add\n\t\t\t// promise.done = list.add\n\t\t\t// promise.fail = list.add\n\t\t\tpromise[ tuple[ 1 ] ] = list.add;\n\n\t\t\t// Handle state\n\t\t\tif ( stateString ) {\n\t\t\t\tlist.add(\n\t\t\t\t\tfunction() {\n\n\t\t\t\t\t\t// state = \"resolved\" (i.e., fulfilled)\n\t\t\t\t\t\t// state = \"rejected\"\n\t\t\t\t\t\tstate = stateString;\n\t\t\t\t\t},\n\n\t\t\t\t\t// rejected_callbacks.disable\n\t\t\t\t\t// fulfilled_callbacks.disable\n\t\t\t\t\ttuples[ 3 - i ][ 2 ].disable,\n\n\t\t\t\t\t// rejected_handlers.disable\n\t\t\t\t\t// fulfilled_handlers.disable\n\t\t\t\t\ttuples[ 3 - i ][ 3 ].disable,\n\n\t\t\t\t\t// progress_callbacks.lock\n\t\t\t\t\ttuples[ 0 ][ 2 ].lock,\n\n\t\t\t\t\t// progress_handlers.lock\n\t\t\t\t\ttuples[ 0 ][ 3 ].lock\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t// progress_handlers.fire\n\t\t\t// fulfilled_handlers.fire\n\t\t\t// rejected_handlers.fire\n\t\t\tlist.add( tuple[ 3 ].fire );\n\n\t\t\t// deferred.notify = function() { deferred.notifyWith(...) }\n\t\t\t// deferred.resolve = function() { deferred.resolveWith(...) }\n\t\t\t// deferred.reject = function() { deferred.rejectWith(...) }\n\t\t\tdeferred[ tuple[ 0 ] ] = function() {\n\t\t\t\tdeferred[ tuple[ 0 ] + \"With\" ]( this === deferred ? undefined : this, arguments );\n\t\t\t\treturn this;\n\t\t\t};\n\n\t\t\t// deferred.notifyWith = list.fireWith\n\t\t\t// deferred.resolveWith = list.fireWith\n\t\t\t// deferred.rejectWith = list.fireWith\n\t\t\tdeferred[ tuple[ 0 ] + \"With\" ] = list.fireWith;\n\t\t} );\n\n\t\t// Make the deferred a promise\n\t\tpromise.promise( deferred );\n\n\t\t// Call given func if any\n\t\tif ( func ) {\n\t\t\tfunc.call( deferred, deferred );\n\t\t}\n\n\t\t// All done!\n\t\treturn deferred;\n\t},\n\n\t// Deferred helper\n\twhen: function( singleValue ) {\n\t\tvar\n\n\t\t\t// count of uncompleted subordinates\n\t\t\tremaining = arguments.length,\n\n\t\t\t// count of unprocessed arguments\n\t\t\ti = remaining,\n\n\t\t\t// subordinate fulfillment data\n\t\t\tresolveContexts = Array( i ),\n\t\t\tresolveValues = slice.call( arguments ),\n\n\t\t\t// the master Deferred\n\t\t\tmaster = jQuery.Deferred(),\n\n\t\t\t// subordinate callback factory\n\t\t\tupdateFunc = function( i ) {\n\t\t\t\treturn function( value ) {\n\t\t\t\t\tresolveContexts[ i ] = this;\n\t\t\t\t\tresolveValues[ i ] = arguments.length > 1 ? slice.call( arguments ) : value;\n\t\t\t\t\tif ( !( --remaining ) ) {\n\t\t\t\t\t\tmaster.resolveWith( resolveContexts, resolveValues );\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t};\n\n\t\t// Single- and empty arguments are adopted like Promise.resolve\n\t\tif ( remaining <= 1 ) {\n\t\t\tadoptValue( singleValue, master.done( updateFunc( i ) ).resolve, master.reject,\n\t\t\t\t!remaining );\n\n\t\t\t// Use .then() to unwrap secondary thenables (cf. gh-3000)\n\t\t\tif ( master.state() === \"pending\" ||\n\t\t\t\tisFunction( resolveValues[ i ] && resolveValues[ i ].then ) ) {\n\n\t\t\t\treturn master.then();\n\t\t\t}\n\t\t}\n\n\t\t// Multiple arguments are aggregated like Promise.all array elements\n\t\twhile ( i-- ) {\n\t\t\tadoptValue( resolveValues[ i ], updateFunc( i ), master.reject );\n\t\t}\n\n\t\treturn master.promise();\n\t}\n} );\n\n\n// These usually indicate a programmer mistake during development,\n// warn about them ASAP rather than swallowing them by default.\nvar rerrorNames = /^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;\n\njQuery.Deferred.exceptionHook = function( error, stack ) {\n\n\t// Support: IE 8 - 9 only\n\t// Console exists when dev tools are open, which can happen at any time\n\tif ( window.console && window.console.warn && error && rerrorNames.test( error.name ) ) {\n\t\twindow.console.warn( \"jQuery.Deferred exception: \" + error.message, error.stack, stack );\n\t}\n};\n\n\n\n\njQuery.readyException = function( error ) {\n\twindow.setTimeout( function() {\n\t\tthrow error;\n\t} );\n};\n\n\n\n\n// The deferred used on DOM ready\nvar readyList = jQuery.Deferred();\n\njQuery.fn.ready = function( fn ) {\n\n\treadyList\n\t\t.then( fn )\n\n\t\t// Wrap jQuery.readyException in a function so that the lookup\n\t\t// happens at the time of error handling instead of callback\n\t\t// registration.\n\t\t.catch( function( error ) {\n\t\t\tjQuery.readyException( error );\n\t\t} );\n\n\treturn this;\n};\n\njQuery.extend( {\n\n\t// Is the DOM ready to be used? Set to true once it occurs.\n\tisReady: false,\n\n\t// A counter to track how many items to wait for before\n\t// the ready event fires. See #6781\n\treadyWait: 1,\n\n\t// Handle when the DOM is ready\n\tready: function( wait ) {\n\n\t\t// Abort if there are pending holds or we're already ready\n\t\tif ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Remember that the DOM is ready\n\t\tjQuery.isReady = true;\n\n\t\t// If a normal DOM Ready event fired, decrement, and wait if need be\n\t\tif ( wait !== true && --jQuery.readyWait > 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// If there are functions bound, to execute\n\t\treadyList.resolveWith( document, [ jQuery ] );\n\t}\n} );\n\njQuery.ready.then = readyList.then;\n\n// The ready event handler and self cleanup method\nfunction completed() {\n\tdocument.removeEventListener( \"DOMContentLoaded\", completed );\n\twindow.removeEventListener( \"load\", completed );\n\tjQuery.ready();\n}\n\n// Catch cases where $(document).ready() is called\n// after the browser event has already occurred.\n// Support: IE <=9 - 10 only\n// Older IE sometimes signals \"interactive\" too soon\nif ( document.readyState === \"complete\" ||\n\t( document.readyState !== \"loading\" && !document.documentElement.doScroll ) ) {\n\n\t// Handle it asynchronously to allow scripts the opportunity to delay ready\n\twindow.setTimeout( jQuery.ready );\n\n} else {\n\n\t// Use the handy event callback\n\tdocument.addEventListener( \"DOMContentLoaded\", completed );\n\n\t// A fallback to window.onload, that will always work\n\twindow.addEventListener( \"load\", completed );\n}\n\n\n\n\n// Multifunctional method to get and set values of a collection\n// The value/s can optionally be executed if it's a function\nvar access = function( elems, fn, key, value, chainable, emptyGet, raw ) {\n\tvar i = 0,\n\t\tlen = elems.length,\n\t\tbulk = key == null;\n\n\t// Sets many values\n\tif ( toType( key ) === \"object\" ) {\n\t\tchainable = true;\n\t\tfor ( i in key ) {\n\t\t\taccess( elems, fn, i, key[ i ], true, emptyGet, raw );\n\t\t}\n\n\t// Sets one value\n\t} else if ( value !== undefined ) {\n\t\tchainable = true;\n\n\t\tif ( !isFunction( value ) ) {\n\t\t\traw = true;\n\t\t}\n\n\t\tif ( bulk ) {\n\n\t\t\t// Bulk operations run against the entire set\n\t\t\tif ( raw ) {\n\t\t\t\tfn.call( elems, value );\n\t\t\t\tfn = null;\n\n\t\t\t// ...except when executing function values\n\t\t\t} else {\n\t\t\t\tbulk = fn;\n\t\t\t\tfn = function( elem, key, value ) {\n\t\t\t\t\treturn bulk.call( jQuery( elem ), value );\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\n\t\tif ( fn ) {\n\t\t\tfor ( ; i < len; i++ ) {\n\t\t\t\tfn(\n\t\t\t\t\telems[ i ], key, raw ?\n\t\t\t\t\tvalue :\n\t\t\t\t\tvalue.call( elems[ i ], i, fn( elems[ i ], key ) )\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t}\n\n\tif ( chainable ) {\n\t\treturn elems;\n\t}\n\n\t// Gets\n\tif ( bulk ) {\n\t\treturn fn.call( elems );\n\t}\n\n\treturn len ? fn( elems[ 0 ], key ) : emptyGet;\n};\n\n\n// Matches dashed string for camelizing\nvar rmsPrefix = /^-ms-/,\n\trdashAlpha = /-([a-z])/g;\n\n// Used by camelCase as callback to replace()\nfunction fcamelCase( all, letter ) {\n\treturn letter.toUpperCase();\n}\n\n// Convert dashed to camelCase; used by the css and data modules\n// Support: IE <=9 - 11, Edge 12 - 15\n// Microsoft forgot to hump their vendor prefix (#9572)\nfunction camelCase( string ) {\n\treturn string.replace( rmsPrefix, \"ms-\" ).replace( rdashAlpha, fcamelCase );\n}\nvar acceptData = function( owner ) {\n\n\t// Accepts only:\n\t//  - Node\n\t//    - Node.ELEMENT_NODE\n\t//    - Node.DOCUMENT_NODE\n\t//  - Object\n\t//    - Any\n\treturn owner.nodeType === 1 || owner.nodeType === 9 || !( +owner.nodeType );\n};\n\n\n\n\nfunction Data() {\n\tthis.expando = jQuery.expando + Data.uid++;\n}\n\nData.uid = 1;\n\nData.prototype = {\n\n\tcache: function( owner ) {\n\n\t\t// Check if the owner object already has a cache\n\t\tvar value = owner[ this.expando ];\n\n\t\t// If not, create one\n\t\tif ( !value ) {\n\t\t\tvalue = {};\n\n\t\t\t// We can accept data for non-element nodes in modern browsers,\n\t\t\t// but we should not, see #8335.\n\t\t\t// Always return an empty object.\n\t\t\tif ( acceptData( owner ) ) {\n\n\t\t\t\t// If it is a node unlikely to be stringify-ed or looped over\n\t\t\t\t// use plain assignment\n\t\t\t\tif ( owner.nodeType ) {\n\t\t\t\t\towner[ this.expando ] = value;\n\n\t\t\t\t// Otherwise secure it in a non-enumerable property\n\t\t\t\t// configurable must be true to allow the property to be\n\t\t\t\t// deleted when data is removed\n\t\t\t\t} else {\n\t\t\t\t\tObject.defineProperty( owner, this.expando, {\n\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t\tconfigurable: true\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn value;\n\t},\n\tset: function( owner, data, value ) {\n\t\tvar prop,\n\t\t\tcache = this.cache( owner );\n\n\t\t// Handle: [ owner, key, value ] args\n\t\t// Always use camelCase key (gh-2257)\n\t\tif ( typeof data === \"string\" ) {\n\t\t\tcache[ camelCase( data ) ] = value;\n\n\t\t// Handle: [ owner, { properties } ] args\n\t\t} else {\n\n\t\t\t// Copy the properties one-by-one to the cache object\n\t\t\tfor ( prop in data ) {\n\t\t\t\tcache[ camelCase( prop ) ] = data[ prop ];\n\t\t\t}\n\t\t}\n\t\treturn cache;\n\t},\n\tget: function( owner, key ) {\n\t\treturn key === undefined ?\n\t\t\tthis.cache( owner ) :\n\n\t\t\t// Always use camelCase key (gh-2257)\n\t\t\towner[ this.expando ] && owner[ this.expando ][ camelCase( key ) ];\n\t},\n\taccess: function( owner, key, value ) {\n\n\t\t// In cases where either:\n\t\t//\n\t\t//   1. No key was specified\n\t\t//   2. A string key was specified, but no value provided\n\t\t//\n\t\t// Take the \"read\" path and allow the get method to determine\n\t\t// which value to return, respectively either:\n\t\t//\n\t\t//   1. The entire cache object\n\t\t//   2. The data stored at the key\n\t\t//\n\t\tif ( key === undefined ||\n\t\t\t\t( ( key && typeof key === \"string\" ) && value === undefined ) ) {\n\n\t\t\treturn this.get( owner, key );\n\t\t}\n\n\t\t// When the key is not a string, or both a key and value\n\t\t// are specified, set or extend (existing objects) with either:\n\t\t//\n\t\t//   1. An object of properties\n\t\t//   2. A key and value\n\t\t//\n\t\tthis.set( owner, key, value );\n\n\t\t// Since the \"set\" path can have two possible entry points\n\t\t// return the expected data based on which path was taken[*]\n\t\treturn value !== undefined ? value : key;\n\t},\n\tremove: function( owner, key ) {\n\t\tvar i,\n\t\t\tcache = owner[ this.expando ];\n\n\t\tif ( cache === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( key !== undefined ) {\n\n\t\t\t// Support array or space separated string of keys\n\t\t\tif ( Array.isArray( key ) ) {\n\n\t\t\t\t// If key is an array of keys...\n\t\t\t\t// We always set camelCase keys, so remove that.\n\t\t\t\tkey = key.map( camelCase );\n\t\t\t} else {\n\t\t\t\tkey = camelCase( key );\n\n\t\t\t\t// If a key with the spaces exists, use it.\n\t\t\t\t// Otherwise, create an array by matching non-whitespace\n\t\t\t\tkey = key in cache ?\n\t\t\t\t\t[ key ] :\n\t\t\t\t\t( key.match( rnothtmlwhite ) || [] );\n\t\t\t}\n\n\t\t\ti = key.length;\n\n\t\t\twhile ( i-- ) {\n\t\t\t\tdelete cache[ key[ i ] ];\n\t\t\t}\n\t\t}\n\n\t\t// Remove the expando if there's no more data\n\t\tif ( key === undefined || jQuery.isEmptyObject( cache ) ) {\n\n\t\t\t// Support: Chrome <=35 - 45\n\t\t\t// Webkit & Blink performance suffers when deleting properties\n\t\t\t// from DOM nodes, so set to undefined instead\n\t\t\t// https://bugs.chromium.org/p/chromium/issues/detail?id=378607 (bug restricted)\n\t\t\tif ( owner.nodeType ) {\n\t\t\t\towner[ this.expando ] = undefined;\n\t\t\t} else {\n\t\t\t\tdelete owner[ this.expando ];\n\t\t\t}\n\t\t}\n\t},\n\thasData: function( owner ) {\n\t\tvar cache = owner[ this.expando ];\n\t\treturn cache !== undefined && !jQuery.isEmptyObject( cache );\n\t}\n};\nvar dataPriv = new Data();\n\nvar dataUser = new Data();\n\n\n\n//\tImplementation Summary\n//\n//\t1. Enforce API surface and semantic compatibility with 1.9.x branch\n//\t2. Improve the module's maintainability by reducing the storage\n//\t\tpaths to a single mechanism.\n//\t3. Use the same single mechanism to support \"private\" and \"user\" data.\n//\t4. _Never_ expose \"private\" data to user code (TODO: Drop _data, _removeData)\n//\t5. Avoid exposing implementation details on user objects (eg. expando properties)\n//\t6. Provide a clear path for implementation upgrade to WeakMap in 2014\n\nvar rbrace = /^(?:\\{[\\w\\W]*\\}|\\[[\\w\\W]*\\])$/,\n\trmultiDash = /[A-Z]/g;\n\nfunction getData( data ) {\n\tif ( data === \"true\" ) {\n\t\treturn true;\n\t}\n\n\tif ( data === \"false\" ) {\n\t\treturn false;\n\t}\n\n\tif ( data === \"null\" ) {\n\t\treturn null;\n\t}\n\n\t// Only convert to a number if it doesn't change the string\n\tif ( data === +data + \"\" ) {\n\t\treturn +data;\n\t}\n\n\tif ( rbrace.test( data ) ) {\n\t\treturn JSON.parse( data );\n\t}\n\n\treturn data;\n}\n\nfunction dataAttr( elem, key, data ) {\n\tvar name;\n\n\t// If nothing was found internally, try to fetch any\n\t// data from the HTML5 data-* attribute\n\tif ( data === undefined && elem.nodeType === 1 ) {\n\t\tname = \"data-\" + key.replace( rmultiDash, \"-$&\" ).toLowerCase();\n\t\tdata = elem.getAttribute( name );\n\n\t\tif ( typeof data === \"string\" ) {\n\t\t\ttry {\n\t\t\t\tdata = getData( data );\n\t\t\t} catch ( e ) {}\n\n\t\t\t// Make sure we set the data so it isn't changed later\n\t\t\tdataUser.set( elem, key, data );\n\t\t} else {\n\t\t\tdata = undefined;\n\t\t}\n\t}\n\treturn data;\n}\n\njQuery.extend( {\n\thasData: function( elem ) {\n\t\treturn dataUser.hasData( elem ) || dataPriv.hasData( elem );\n\t},\n\n\tdata: function( elem, name, data ) {\n\t\treturn dataUser.access( elem, name, data );\n\t},\n\n\tremoveData: function( elem, name ) {\n\t\tdataUser.remove( elem, name );\n\t},\n\n\t// TODO: Now that all calls to _data and _removeData have been replaced\n\t// with direct calls to dataPriv methods, these can be deprecated.\n\t_data: function( elem, name, data ) {\n\t\treturn dataPriv.access( elem, name, data );\n\t},\n\n\t_removeData: function( elem, name ) {\n\t\tdataPriv.remove( elem, name );\n\t}\n} );\n\njQuery.fn.extend( {\n\tdata: function( key, value ) {\n\t\tvar i, name, data,\n\t\t\telem = this[ 0 ],\n\t\t\tattrs = elem && elem.attributes;\n\n\t\t// Gets all values\n\t\tif ( key === undefined ) {\n\t\t\tif ( this.length ) {\n\t\t\t\tdata = dataUser.get( elem );\n\n\t\t\t\tif ( elem.nodeType === 1 && !dataPriv.get( elem, \"hasDataAttrs\" ) ) {\n\t\t\t\t\ti = attrs.length;\n\t\t\t\t\twhile ( i-- ) {\n\n\t\t\t\t\t\t// Support: IE 11 only\n\t\t\t\t\t\t// The attrs elements can be null (#14894)\n\t\t\t\t\t\tif ( attrs[ i ] ) {\n\t\t\t\t\t\t\tname = attrs[ i ].name;\n\t\t\t\t\t\t\tif ( name.indexOf( \"data-\" ) === 0 ) {\n\t\t\t\t\t\t\t\tname = camelCase( name.slice( 5 ) );\n\t\t\t\t\t\t\t\tdataAttr( elem, name, data[ name ] );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tdataPriv.set( elem, \"hasDataAttrs\", true );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn data;\n\t\t}\n\n\t\t// Sets multiple values\n\t\tif ( typeof key === \"object\" ) {\n\t\t\treturn this.each( function() {\n\t\t\t\tdataUser.set( this, key );\n\t\t\t} );\n\t\t}\n\n\t\treturn access( this, function( value ) {\n\t\t\tvar data;\n\n\t\t\t// The calling jQuery object (element matches) is not empty\n\t\t\t// (and therefore has an element appears at this[ 0 ]) and the\n\t\t\t// `value` parameter was not undefined. An empty jQuery object\n\t\t\t// will result in `undefined` for elem = this[ 0 ] which will\n\t\t\t// throw an exception if an attempt to read a data cache is made.\n\t\t\tif ( elem && value === undefined ) {\n\n\t\t\t\t// Attempt to get data from the cache\n\t\t\t\t// The key will always be camelCased in Data\n\t\t\t\tdata = dataUser.get( elem, key );\n\t\t\t\tif ( data !== undefined ) {\n\t\t\t\t\treturn data;\n\t\t\t\t}\n\n\t\t\t\t// Attempt to \"discover\" the data in\n\t\t\t\t// HTML5 custom data-* attrs\n\t\t\t\tdata = dataAttr( elem, key );\n\t\t\t\tif ( data !== undefined ) {\n\t\t\t\t\treturn data;\n\t\t\t\t}\n\n\t\t\t\t// We tried really hard, but the data doesn't exist.\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Set the data...\n\t\t\tthis.each( function() {\n\n\t\t\t\t// We always store the camelCased key\n\t\t\t\tdataUser.set( this, key, value );\n\t\t\t} );\n\t\t}, null, value, arguments.length > 1, null, true );\n\t},\n\n\tremoveData: function( key ) {\n\t\treturn this.each( function() {\n\t\t\tdataUser.remove( this, key );\n\t\t} );\n\t}\n} );\n\n\njQuery.extend( {\n\tqueue: function( elem, type, data ) {\n\t\tvar queue;\n\n\t\tif ( elem ) {\n\t\t\ttype = ( type || \"fx\" ) + \"queue\";\n\t\t\tqueue = dataPriv.get( elem, type );\n\n\t\t\t// Speed up dequeue by getting out quickly if this is just a lookup\n\t\t\tif ( data ) {\n\t\t\t\tif ( !queue || Array.isArray( data ) ) {\n\t\t\t\t\tqueue = dataPriv.access( elem, type, jQuery.makeArray( data ) );\n\t\t\t\t} else {\n\t\t\t\t\tqueue.push( data );\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn queue || [];\n\t\t}\n\t},\n\n\tdequeue: function( elem, type ) {\n\t\ttype = type || \"fx\";\n\n\t\tvar queue = jQuery.queue( elem, type ),\n\t\t\tstartLength = queue.length,\n\t\t\tfn = queue.shift(),\n\t\t\thooks = jQuery._queueHooks( elem, type ),\n\t\t\tnext = function() {\n\t\t\t\tjQuery.dequeue( elem, type );\n\t\t\t};\n\n\t\t// If the fx queue is dequeued, always remove the progress sentinel\n\t\tif ( fn === \"inprogress\" ) {\n\t\t\tfn = queue.shift();\n\t\t\tstartLength--;\n\t\t}\n\n\t\tif ( fn ) {\n\n\t\t\t// Add a progress sentinel to prevent the fx queue from being\n\t\t\t// automatically dequeued\n\t\t\tif ( type === \"fx\" ) {\n\t\t\t\tqueue.unshift( \"inprogress\" );\n\t\t\t}\n\n\t\t\t// Clear up the last queue stop function\n\t\t\tdelete hooks.stop;\n\t\t\tfn.call( elem, next, hooks );\n\t\t}\n\n\t\tif ( !startLength && hooks ) {\n\t\t\thooks.empty.fire();\n\t\t}\n\t},\n\n\t// Not public - generate a queueHooks object, or return the current one\n\t_queueHooks: function( elem, type ) {\n\t\tvar key = type + \"queueHooks\";\n\t\treturn dataPriv.get( elem, key ) || dataPriv.access( elem, key, {\n\t\t\tempty: jQuery.Callbacks( \"once memory\" ).add( function() {\n\t\t\t\tdataPriv.remove( elem, [ type + \"queue\", key ] );\n\t\t\t} )\n\t\t} );\n\t}\n} );\n\njQuery.fn.extend( {\n\tqueue: function( type, data ) {\n\t\tvar setter = 2;\n\n\t\tif ( typeof type !== \"string\" ) {\n\t\t\tdata = type;\n\t\t\ttype = \"fx\";\n\t\t\tsetter--;\n\t\t}\n\n\t\tif ( arguments.length < setter ) {\n\t\t\treturn jQuery.queue( this[ 0 ], type );\n\t\t}\n\n\t\treturn data === undefined ?\n\t\t\tthis :\n\t\t\tthis.each( function() {\n\t\t\t\tvar queue = jQuery.queue( this, type, data );\n\n\t\t\t\t// Ensure a hooks for this queue\n\t\t\t\tjQuery._queueHooks( this, type );\n\n\t\t\t\tif ( type === \"fx\" && queue[ 0 ] !== \"inprogress\" ) {\n\t\t\t\t\tjQuery.dequeue( this, type );\n\t\t\t\t}\n\t\t\t} );\n\t},\n\tdequeue: function( type ) {\n\t\treturn this.each( function() {\n\t\t\tjQuery.dequeue( this, type );\n\t\t} );\n\t},\n\tclearQueue: function( type ) {\n\t\treturn this.queue( type || \"fx\", [] );\n\t},\n\n\t// Get a promise resolved when queues of a certain type\n\t// are emptied (fx is the type by default)\n\tpromise: function( type, obj ) {\n\t\tvar tmp,\n\t\t\tcount = 1,\n\t\t\tdefer = jQuery.Deferred(),\n\t\t\telements = this,\n\t\t\ti = this.length,\n\t\t\tresolve = function() {\n\t\t\t\tif ( !( --count ) ) {\n\t\t\t\t\tdefer.resolveWith( elements, [ elements ] );\n\t\t\t\t}\n\t\t\t};\n\n\t\tif ( typeof type !== \"string\" ) {\n\t\t\tobj = type;\n\t\t\ttype = undefined;\n\t\t}\n\t\ttype = type || \"fx\";\n\n\t\twhile ( i-- ) {\n\t\t\ttmp = dataPriv.get( elements[ i ], type + \"queueHooks\" );\n\t\t\tif ( tmp && tmp.empty ) {\n\t\t\t\tcount++;\n\t\t\t\ttmp.empty.add( resolve );\n\t\t\t}\n\t\t}\n\t\tresolve();\n\t\treturn defer.promise( obj );\n\t}\n} );\nvar pnum = ( /[+-]?(?:\\d*\\.|)\\d+(?:[eE][+-]?\\d+|)/ ).source;\n\nvar rcssNum = new RegExp( \"^(?:([+-])=|)(\" + pnum + \")([a-z%]*)$\", \"i\" );\n\n\nvar cssExpand = [ \"Top\", \"Right\", \"Bottom\", \"Left\" ];\n\nvar documentElement = document.documentElement;\n\n\n\n\tvar isAttached = function( elem ) {\n\t\t\treturn jQuery.contains( elem.ownerDocument, elem );\n\t\t},\n\t\tcomposed = { composed: true };\n\n\t// Check attachment across shadow DOM boundaries when possible (gh-3504)\n\tif ( documentElement.attachShadow ) {\n\t\tisAttached = function( elem ) {\n\t\t\treturn jQuery.contains( elem.ownerDocument, elem ) ||\n\t\t\t\telem.getRootNode( composed ) === elem.ownerDocument;\n\t\t};\n\t}\nvar isHiddenWithinTree = function( elem, el ) {\n\n\t\t// isHiddenWithinTree might be called from jQuery#filter function;\n\t\t// in that case, element will be second argument\n\t\telem = el || elem;\n\n\t\t// Inline style trumps all\n\t\treturn elem.style.display === \"none\" ||\n\t\t\telem.style.display === \"\" &&\n\n\t\t\t// Otherwise, check computed style\n\t\t\t// Support: Firefox <=43 - 45\n\t\t\t// Disconnected elements can have computed display: none, so first confirm that elem is\n\t\t\t// in the document.\n\t\t\tisAttached( elem ) &&\n\n\t\t\tjQuery.css( elem, \"display\" ) === \"none\";\n\t};\n\nvar swap = function( elem, options, callback, args ) {\n\tvar ret, name,\n\t\told = {};\n\n\t// Remember the old values, and insert the new ones\n\tfor ( name in options ) {\n\t\told[ name ] = elem.style[ name ];\n\t\telem.style[ name ] = options[ name ];\n\t}\n\n\tret = callback.apply( elem, args || [] );\n\n\t// Revert the old values\n\tfor ( name in options ) {\n\t\telem.style[ name ] = old[ name ];\n\t}\n\n\treturn ret;\n};\n\n\n\n\nfunction adjustCSS( elem, prop, valueParts, tween ) {\n\tvar adjusted, scale,\n\t\tmaxIterations = 20,\n\t\tcurrentValue = tween ?\n\t\t\tfunction() {\n\t\t\t\treturn tween.cur();\n\t\t\t} :\n\t\t\tfunction() {\n\t\t\t\treturn jQuery.css( elem, prop, \"\" );\n\t\t\t},\n\t\tinitial = currentValue(),\n\t\tunit = valueParts && valueParts[ 3 ] || ( jQuery.cssNumber[ prop ] ? \"\" : \"px\" ),\n\n\t\t// Starting value computation is required for potential unit mismatches\n\t\tinitialInUnit = elem.nodeType &&\n\t\t\t( jQuery.cssNumber[ prop ] || unit !== \"px\" && +initial ) &&\n\t\t\trcssNum.exec( jQuery.css( elem, prop ) );\n\n\tif ( initialInUnit && initialInUnit[ 3 ] !== unit ) {\n\n\t\t// Support: Firefox <=54\n\t\t// Halve the iteration target value to prevent interference from CSS upper bounds (gh-2144)\n\t\tinitial = initial / 2;\n\n\t\t// Trust units reported by jQuery.css\n\t\tunit = unit || initialInUnit[ 3 ];\n\n\t\t// Iteratively approximate from a nonzero starting point\n\t\tinitialInUnit = +initial || 1;\n\n\t\twhile ( maxIterations-- ) {\n\n\t\t\t// Evaluate and update our best guess (doubling guesses that zero out).\n\t\t\t// Finish if the scale equals or crosses 1 (making the old*new product non-positive).\n\t\t\tjQuery.style( elem, prop, initialInUnit + unit );\n\t\t\tif ( ( 1 - scale ) * ( 1 - ( scale = currentValue() / initial || 0.5 ) ) <= 0 ) {\n\t\t\t\tmaxIterations = 0;\n\t\t\t}\n\t\t\tinitialInUnit = initialInUnit / scale;\n\n\t\t}\n\n\t\tinitialInUnit = initialInUnit * 2;\n\t\tjQuery.style( elem, prop, initialInUnit + unit );\n\n\t\t// Make sure we update the tween properties later on\n\t\tvalueParts = valueParts || [];\n\t}\n\n\tif ( valueParts ) {\n\t\tinitialInUnit = +initialInUnit || +initial || 0;\n\n\t\t// Apply relative offset (+=/-=) if specified\n\t\tadjusted = valueParts[ 1 ] ?\n\t\t\tinitialInUnit + ( valueParts[ 1 ] + 1 ) * valueParts[ 2 ] :\n\t\t\t+valueParts[ 2 ];\n\t\tif ( tween ) {\n\t\t\ttween.unit = unit;\n\t\t\ttween.start = initialInUnit;\n\t\t\ttween.end = adjusted;\n\t\t}\n\t}\n\treturn adjusted;\n}\n\n\nvar defaultDisplayMap = {};\n\nfunction getDefaultDisplay( elem ) {\n\tvar temp,\n\t\tdoc = elem.ownerDocument,\n\t\tnodeName = elem.nodeName,\n\t\tdisplay = defaultDisplayMap[ nodeName ];\n\n\tif ( display ) {\n\t\treturn display;\n\t}\n\n\ttemp = doc.body.appendChild( doc.createElement( nodeName ) );\n\tdisplay = jQuery.css( temp, \"display\" );\n\n\ttemp.parentNode.removeChild( temp );\n\n\tif ( display === \"none\" ) {\n\t\tdisplay = \"block\";\n\t}\n\tdefaultDisplayMap[ nodeName ] = display;\n\n\treturn display;\n}\n\nfunction showHide( elements, show ) {\n\tvar display, elem,\n\t\tvalues = [],\n\t\tindex = 0,\n\t\tlength = elements.length;\n\n\t// Determine new display value for elements that need to change\n\tfor ( ; index < length; index++ ) {\n\t\telem = elements[ index ];\n\t\tif ( !elem.style ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tdisplay = elem.style.display;\n\t\tif ( show ) {\n\n\t\t\t// Since we force visibility upon cascade-hidden elements, an immediate (and slow)\n\t\t\t// check is required in this first loop unless we have a nonempty display value (either\n\t\t\t// inline or about-to-be-restored)\n\t\t\tif ( display === \"none\" ) {\n\t\t\t\tvalues[ index ] = dataPriv.get( elem, \"display\" ) || null;\n\t\t\t\tif ( !values[ index ] ) {\n\t\t\t\t\telem.style.display = \"\";\n\t\t\t\t}\n\t\t\t}\n\t\t\tif ( elem.style.display === \"\" && isHiddenWithinTree( elem ) ) {\n\t\t\t\tvalues[ index ] = getDefaultDisplay( elem );\n\t\t\t}\n\t\t} else {\n\t\t\tif ( display !== \"none\" ) {\n\t\t\t\tvalues[ index ] = \"none\";\n\n\t\t\t\t// Remember what we're overwriting\n\t\t\t\tdataPriv.set( elem, \"display\", display );\n\t\t\t}\n\t\t}\n\t}\n\n\t// Set the display of the elements in a second loop to avoid constant reflow\n\tfor ( index = 0; index < length; index++ ) {\n\t\tif ( values[ index ] != null ) {\n\t\t\telements[ index ].style.display = values[ index ];\n\t\t}\n\t}\n\n\treturn elements;\n}\n\njQuery.fn.extend( {\n\tshow: function() {\n\t\treturn showHide( this, true );\n\t},\n\thide: function() {\n\t\treturn showHide( this );\n\t},\n\ttoggle: function( state ) {\n\t\tif ( typeof state === \"boolean\" ) {\n\t\t\treturn state ? this.show() : this.hide();\n\t\t}\n\n\t\treturn this.each( function() {\n\t\t\tif ( isHiddenWithinTree( this ) ) {\n\t\t\t\tjQuery( this ).show();\n\t\t\t} else {\n\t\t\t\tjQuery( this ).hide();\n\t\t\t}\n\t\t} );\n\t}\n} );\nvar rcheckableType = ( /^(?:checkbox|radio)$/i );\n\nvar rtagName = ( /<([a-z][^\\/\\0>\\x20\\t\\r\\n\\f]*)/i );\n\nvar rscriptType = ( /^$|^module$|\\/(?:java|ecma)script/i );\n\n\n\n// We have to close these tags to support XHTML (#13200)\nvar wrapMap = {\n\n\t// Support: IE <=9 only\n\toption: [ 1, \"<select multiple='multiple'>\", \"</select>\" ],\n\n\t// XHTML parsers do not magically insert elements in the\n\t// same way that tag soup parsers do. So we cannot shorten\n\t// this by omitting <tbody> or other required elements.\n\tthead: [ 1, \"<table>\", \"</table>\" ],\n\tcol: [ 2, \"<table><colgroup>\", \"</colgroup></table>\" ],\n\ttr: [ 2, \"<table><tbody>\", \"</tbody></table>\" ],\n\ttd: [ 3, \"<table><tbody><tr>\", \"</tr></tbody></table>\" ],\n\n\t_default: [ 0, \"\", \"\" ]\n};\n\n// Support: IE <=9 only\nwrapMap.optgroup = wrapMap.option;\n\nwrapMap.tbody = wrapMap.tfoot = wrapMap.colgroup = wrapMap.caption = wrapMap.thead;\nwrapMap.th = wrapMap.td;\n\n\nfunction getAll( context, tag ) {\n\n\t// Support: IE <=9 - 11 only\n\t// Use typeof to avoid zero-argument method invocation on host objects (#15151)\n\tvar ret;\n\n\tif ( typeof context.getElementsByTagName !== \"undefined\" ) {\n\t\tret = context.getElementsByTagName( tag || \"*\" );\n\n\t} else if ( typeof context.querySelectorAll !== \"undefined\" ) {\n\t\tret = context.querySelectorAll( tag || \"*\" );\n\n\t} else {\n\t\tret = [];\n\t}\n\n\tif ( tag === undefined || tag && nodeName( context, tag ) ) {\n\t\treturn jQuery.merge( [ context ], ret );\n\t}\n\n\treturn ret;\n}\n\n\n// Mark scripts as having already been evaluated\nfunction setGlobalEval( elems, refElements ) {\n\tvar i = 0,\n\t\tl = elems.length;\n\n\tfor ( ; i < l; i++ ) {\n\t\tdataPriv.set(\n\t\t\telems[ i ],\n\t\t\t\"globalEval\",\n\t\t\t!refElements || dataPriv.get( refElements[ i ], \"globalEval\" )\n\t\t);\n\t}\n}\n\n\nvar rhtml = /<|&#?\\w+;/;\n\nfunction buildFragment( elems, context, scripts, selection, ignored ) {\n\tvar elem, tmp, tag, wrap, attached, j,\n\t\tfragment = context.createDocumentFragment(),\n\t\tnodes = [],\n\t\ti = 0,\n\t\tl = elems.length;\n\n\tfor ( ; i < l; i++ ) {\n\t\telem = elems[ i ];\n\n\t\tif ( elem || elem === 0 ) {\n\n\t\t\t// Add nodes directly\n\t\t\tif ( toType( elem ) === \"object\" ) {\n\n\t\t\t\t// Support: Android <=4.0 only, PhantomJS 1 only\n\t\t\t\t// push.apply(_, arraylike) throws on ancient WebKit\n\t\t\t\tjQuery.merge( nodes, elem.nodeType ? [ elem ] : elem );\n\n\t\t\t// Convert non-html into a text node\n\t\t\t} else if ( !rhtml.test( elem ) ) {\n\t\t\t\tnodes.push( context.createTextNode( elem ) );\n\n\t\t\t// Convert html into DOM nodes\n\t\t\t} else {\n\t\t\t\ttmp = tmp || fragment.appendChild( context.createElement( \"div\" ) );\n\n\t\t\t\t// Deserialize a standard representation\n\t\t\t\ttag = ( rtagName.exec( elem ) || [ \"\", \"\" ] )[ 1 ].toLowerCase();\n\t\t\t\twrap = wrapMap[ tag ] || wrapMap._default;\n\t\t\t\ttmp.innerHTML = wrap[ 1 ] + jQuery.htmlPrefilter( elem ) + wrap[ 2 ];\n\n\t\t\t\t// Descend through wrappers to the right content\n\t\t\t\tj = wrap[ 0 ];\n\t\t\t\twhile ( j-- ) {\n\t\t\t\t\ttmp = tmp.lastChild;\n\t\t\t\t}\n\n\t\t\t\t// Support: Android <=4.0 only, PhantomJS 1 only\n\t\t\t\t// push.apply(_, arraylike) throws on ancient WebKit\n\t\t\t\tjQuery.merge( nodes, tmp.childNodes );\n\n\t\t\t\t// Remember the top-level container\n\t\t\t\ttmp = fragment.firstChild;\n\n\t\t\t\t// Ensure the created nodes are orphaned (#12392)\n\t\t\t\ttmp.textContent = \"\";\n\t\t\t}\n\t\t}\n\t}\n\n\t// Remove wrapper from fragment\n\tfragment.textContent = \"\";\n\n\ti = 0;\n\twhile ( ( elem = nodes[ i++ ] ) ) {\n\n\t\t// Skip elements already in the context collection (trac-4087)\n\t\tif ( selection && jQuery.inArray( elem, selection ) > -1 ) {\n\t\t\tif ( ignored ) {\n\t\t\t\tignored.push( elem );\n\t\t\t}\n\t\t\tcontinue;\n\t\t}\n\n\t\tattached = isAttached( elem );\n\n\t\t// Append to fragment\n\t\ttmp = getAll( fragment.appendChild( elem ), \"script\" );\n\n\t\t// Preserve script evaluation history\n\t\tif ( attached ) {\n\t\t\tsetGlobalEval( tmp );\n\t\t}\n\n\t\t// Capture executables\n\t\tif ( scripts ) {\n\t\t\tj = 0;\n\t\t\twhile ( ( elem = tmp[ j++ ] ) ) {\n\t\t\t\tif ( rscriptType.test( elem.type || \"\" ) ) {\n\t\t\t\t\tscripts.push( elem );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\treturn fragment;\n}\n\n\n( function() {\n\tvar fragment = document.createDocumentFragment(),\n\t\tdiv = fragment.appendChild( document.createElement( \"div\" ) ),\n\t\tinput = document.createElement( \"input\" );\n\n\t// Support: Android 4.0 - 4.3 only\n\t// Check state lost if the name is set (#11217)\n\t// Support: Windows Web Apps (WWA)\n\t// `name` and `type` must use .setAttribute for WWA (#14901)\n\tinput.setAttribute( \"type\", \"radio\" );\n\tinput.setAttribute( \"checked\", \"checked\" );\n\tinput.setAttribute( \"name\", \"t\" );\n\n\tdiv.appendChild( input );\n\n\t// Support: Android <=4.1 only\n\t// Older WebKit doesn't clone checked state correctly in fragments\n\tsupport.checkClone = div.cloneNode( true ).cloneNode( true ).lastChild.checked;\n\n\t// Support: IE <=11 only\n\t// Make sure textarea (and checkbox) defaultValue is properly cloned\n\tdiv.innerHTML = \"<textarea>x</textarea>\";\n\tsupport.noCloneChecked = !!div.cloneNode( true ).lastChild.defaultValue;\n} )();\n\n\nvar\n\trkeyEvent = /^key/,\n\trmouseEvent = /^(?:mouse|pointer|contextmenu|drag|drop)|click/,\n\trtypenamespace = /^([^.]*)(?:\\.(.+)|)/;\n\nfunction returnTrue() {\n\treturn true;\n}\n\nfunction returnFalse() {\n\treturn false;\n}\n\n// Support: IE <=9 - 11+\n// focus() and blur() are asynchronous, except when they are no-op.\n// So expect focus to be synchronous when the element is already active,\n// and blur to be synchronous when the element is not already active.\n// (focus and blur are always synchronous in other supported browsers,\n// this just defines when we can count on it).\nfunction expectSync( elem, type ) {\n\treturn ( elem === safeActiveElement() ) === ( type === \"focus\" );\n}\n\n// Support: IE <=9 only\n// Accessing document.activeElement can throw unexpectedly\n// https://bugs.jquery.com/ticket/13393\nfunction safeActiveElement() {\n\ttry {\n\t\treturn document.activeElement;\n\t} catch ( err ) { }\n}\n\nfunction on( elem, types, selector, data, fn, one ) {\n\tvar origFn, type;\n\n\t// Types can be a map of types/handlers\n\tif ( typeof types === \"object\" ) {\n\n\t\t// ( types-Object, selector, data )\n\t\tif ( typeof selector !== \"string\" ) {\n\n\t\t\t// ( types-Object, data )\n\t\t\tdata = data || selector;\n\t\t\tselector = undefined;\n\t\t}\n\t\tfor ( type in types ) {\n\t\t\ton( elem, type, selector, data, types[ type ], one );\n\t\t}\n\t\treturn elem;\n\t}\n\n\tif ( data == null && fn == null ) {\n\n\t\t// ( types, fn )\n\t\tfn = selector;\n\t\tdata = selector = undefined;\n\t} else if ( fn == null ) {\n\t\tif ( typeof selector === \"string\" ) {\n\n\t\t\t// ( types, selector, fn )\n\t\t\tfn = data;\n\t\t\tdata = undefined;\n\t\t} else {\n\n\t\t\t// ( types, data, fn )\n\t\t\tfn = data;\n\t\t\tdata = selector;\n\t\t\tselector = undefined;\n\t\t}\n\t}\n\tif ( fn === false ) {\n\t\tfn = returnFalse;\n\t} else if ( !fn ) {\n\t\treturn elem;\n\t}\n\n\tif ( one === 1 ) {\n\t\torigFn = fn;\n\t\tfn = function( event ) {\n\n\t\t\t// Can use an empty set, since event contains the info\n\t\t\tjQuery().off( event );\n\t\t\treturn origFn.apply( this, arguments );\n\t\t};\n\n\t\t// Use same guid so caller can remove using origFn\n\t\tfn.guid = origFn.guid || ( origFn.guid = jQuery.guid++ );\n\t}\n\treturn elem.each( function() {\n\t\tjQuery.event.add( this, types, fn, data, selector );\n\t} );\n}\n\n/*\n * Helper functions for managing events -- not part of the public interface.\n * Props to Dean Edwards' addEvent library for many of the ideas.\n */\njQuery.event = {\n\n\tglobal: {},\n\n\tadd: function( elem, types, handler, data, selector ) {\n\n\t\tvar handleObjIn, eventHandle, tmp,\n\t\t\tevents, t, handleObj,\n\t\t\tspecial, handlers, type, namespaces, origType,\n\t\t\telemData = dataPriv.get( elem );\n\n\t\t// Don't attach events to noData or text/comment nodes (but allow plain objects)\n\t\tif ( !elemData ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Caller can pass in an object of custom data in lieu of the handler\n\t\tif ( handler.handler ) {\n\t\t\thandleObjIn = handler;\n\t\t\thandler = handleObjIn.handler;\n\t\t\tselector = handleObjIn.selector;\n\t\t}\n\n\t\t// Ensure that invalid selectors throw exceptions at attach time\n\t\t// Evaluate against documentElement in case elem is a non-element node (e.g., document)\n\t\tif ( selector ) {\n\t\t\tjQuery.find.matchesSelector( documentElement, selector );\n\t\t}\n\n\t\t// Make sure that the handler has a unique ID, used to find/remove it later\n\t\tif ( !handler.guid ) {\n\t\t\thandler.guid = jQuery.guid++;\n\t\t}\n\n\t\t// Init the element's event structure and main handler, if this is the first\n\t\tif ( !( events = elemData.events ) ) {\n\t\t\tevents = elemData.events = {};\n\t\t}\n\t\tif ( !( eventHandle = elemData.handle ) ) {\n\t\t\teventHandle = elemData.handle = function( e ) {\n\n\t\t\t\t// Discard the second event of a jQuery.event.trigger() and\n\t\t\t\t// when an event is called after a page has unloaded\n\t\t\t\treturn typeof jQuery !== \"undefined\" && jQuery.event.triggered !== e.type ?\n\t\t\t\t\tjQuery.event.dispatch.apply( elem, arguments ) : undefined;\n\t\t\t};\n\t\t}\n\n\t\t// Handle multiple events separated by a space\n\t\ttypes = ( types || \"\" ).match( rnothtmlwhite ) || [ \"\" ];\n\t\tt = types.length;\n\t\twhile ( t-- ) {\n\t\t\ttmp = rtypenamespace.exec( types[ t ] ) || [];\n\t\t\ttype = origType = tmp[ 1 ];\n\t\t\tnamespaces = ( tmp[ 2 ] || \"\" ).split( \".\" ).sort();\n\n\t\t\t// There *must* be a type, no attaching namespace-only handlers\n\t\t\tif ( !type ) {\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\t// If event changes its type, use the special event handlers for the changed type\n\t\t\tspecial = jQuery.event.special[ type ] || {};\n\n\t\t\t// If selector defined, determine special event api type, otherwise given type\n\t\t\ttype = ( selector ? special.delegateType : special.bindType ) || type;\n\n\t\t\t// Update special based on newly reset type\n\t\t\tspecial = jQuery.event.special[ type ] || {};\n\n\t\t\t// handleObj is passed to all event handlers\n\t\t\thandleObj = jQuery.extend( {\n\t\t\t\ttype: type,\n\t\t\t\torigType: origType,\n\t\t\t\tdata: data,\n\t\t\t\thandler: handler,\n\t\t\t\tguid: handler.guid,\n\t\t\t\tselector: selector,\n\t\t\t\tneedsContext: selector && jQuery.expr.match.needsContext.test( selector ),\n\t\t\t\tnamespace: namespaces.join( \".\" )\n\t\t\t}, handleObjIn );\n\n\t\t\t// Init the event handler queue if we're the first\n\t\t\tif ( !( handlers = events[ type ] ) ) {\n\t\t\t\thandlers = events[ type ] = [];\n\t\t\t\thandlers.delegateCount = 0;\n\n\t\t\t\t// Only use addEventListener if the special events handler returns false\n\t\t\t\tif ( !special.setup ||\n\t\t\t\t\tspecial.setup.call( elem, data, namespaces, eventHandle ) === false ) {\n\n\t\t\t\t\tif ( elem.addEventListener ) {\n\t\t\t\t\t\telem.addEventListener( type, eventHandle );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( special.add ) {\n\t\t\t\tspecial.add.call( elem, handleObj );\n\n\t\t\t\tif ( !handleObj.handler.guid ) {\n\t\t\t\t\thandleObj.handler.guid = handler.guid;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Add to the element's handler list, delegates in front\n\t\t\tif ( selector ) {\n\t\t\t\thandlers.splice( handlers.delegateCount++, 0, handleObj );\n\t\t\t} else {\n\t\t\t\thandlers.push( handleObj );\n\t\t\t}\n\n\t\t\t// Keep track of which events have ever been used, for event optimization\n\t\t\tjQuery.event.global[ type ] = true;\n\t\t}\n\n\t},\n\n\t// Detach an event or set of events from an element\n\tremove: function( elem, types, handler, selector, mappedTypes ) {\n\n\t\tvar j, origCount, tmp,\n\t\t\tevents, t, handleObj,\n\t\t\tspecial, handlers, type, namespaces, origType,\n\t\t\telemData = dataPriv.hasData( elem ) && dataPriv.get( elem );\n\n\t\tif ( !elemData || !( events = elemData.events ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Once for each type.namespace in types; type may be omitted\n\t\ttypes = ( types || \"\" ).match( rnothtmlwhite ) || [ \"\" ];\n\t\tt = types.length;\n\t\twhile ( t-- ) {\n\t\t\ttmp = rtypenamespace.exec( types[ t ] ) || [];\n\t\t\ttype = origType = tmp[ 1 ];\n\t\t\tnamespaces = ( tmp[ 2 ] || \"\" ).split( \".\" ).sort();\n\n\t\t\t// Unbind all events (on this namespace, if provided) for the element\n\t\t\tif ( !type ) {\n\t\t\t\tfor ( type in events ) {\n\t\t\t\t\tjQuery.event.remove( elem, type + types[ t ], handler, selector, true );\n\t\t\t\t}\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\tspecial = jQuery.event.special[ type ] || {};\n\t\t\ttype = ( selector ? special.delegateType : special.bindType ) || type;\n\t\t\thandlers = events[ type ] || [];\n\t\t\ttmp = tmp[ 2 ] &&\n\t\t\t\tnew RegExp( \"(^|\\\\.)\" + namespaces.join( \"\\\\.(?:.*\\\\.|)\" ) + \"(\\\\.|$)\" );\n\n\t\t\t// Remove matching events\n\t\t\torigCount = j = handlers.length;\n\t\t\twhile ( j-- ) {\n\t\t\t\thandleObj = handlers[ j ];\n\n\t\t\t\tif ( ( mappedTypes || origType === handleObj.origType ) &&\n\t\t\t\t\t( !handler || handler.guid === handleObj.guid ) &&\n\t\t\t\t\t( !tmp || tmp.test( handleObj.namespace ) ) &&\n\t\t\t\t\t( !selector || selector === handleObj.selector ||\n\t\t\t\t\t\tselector === \"**\" && handleObj.selector ) ) {\n\t\t\t\t\thandlers.splice( j, 1 );\n\n\t\t\t\t\tif ( handleObj.selector ) {\n\t\t\t\t\t\thandlers.delegateCount--;\n\t\t\t\t\t}\n\t\t\t\t\tif ( special.remove ) {\n\t\t\t\t\t\tspecial.remove.call( elem, handleObj );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Remove generic event handler if we removed something and no more handlers exist\n\t\t\t// (avoids potential for endless recursion during removal of special event handlers)\n\t\t\tif ( origCount && !handlers.length ) {\n\t\t\t\tif ( !special.teardown ||\n\t\t\t\t\tspecial.teardown.call( elem, namespaces, elemData.handle ) === false ) {\n\n\t\t\t\t\tjQuery.removeEvent( elem, type, elemData.handle );\n\t\t\t\t}\n\n\t\t\t\tdelete events[ type ];\n\t\t\t}\n\t\t}\n\n\t\t// Remove data and the expando if it's no longer used\n\t\tif ( jQuery.isEmptyObject( events ) ) {\n\t\t\tdataPriv.remove( elem, \"handle events\" );\n\t\t}\n\t},\n\n\tdispatch: function( nativeEvent ) {\n\n\t\t// Make a writable jQuery.Event from the native event object\n\t\tvar event = jQuery.event.fix( nativeEvent );\n\n\t\tvar i, j, ret, matched, handleObj, handlerQueue,\n\t\t\targs = new Array( arguments.length ),\n\t\t\thandlers = ( dataPriv.get( this, \"events\" ) || {} )[ event.type ] || [],\n\t\t\tspecial = jQuery.event.special[ event.type ] || {};\n\n\t\t// Use the fix-ed jQuery.Event rather than the (read-only) native event\n\t\targs[ 0 ] = event;\n\n\t\tfor ( i = 1; i < arguments.length; i++ ) {\n\t\t\targs[ i ] = arguments[ i ];\n\t\t}\n\n\t\tevent.delegateTarget = this;\n\n\t\t// Call the preDispatch hook for the mapped type, and let it bail if desired\n\t\tif ( special.preDispatch && special.preDispatch.call( this, event ) === false ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Determine handlers\n\t\thandlerQueue = jQuery.event.handlers.call( this, event, handlers );\n\n\t\t// Run delegates first; they may want to stop propagation beneath us\n\t\ti = 0;\n\t\twhile ( ( matched = handlerQueue[ i++ ] ) && !event.isPropagationStopped() ) {\n\t\t\tevent.currentTarget = matched.elem;\n\n\t\t\tj = 0;\n\t\t\twhile ( ( handleObj = matched.handlers[ j++ ] ) &&\n\t\t\t\t!event.isImmediatePropagationStopped() ) {\n\n\t\t\t\t// If the event is namespaced, then each handler is only invoked if it is\n\t\t\t\t// specially universal or its namespaces are a superset of the event's.\n\t\t\t\tif ( !event.rnamespace || handleObj.namespace === false ||\n\t\t\t\t\tevent.rnamespace.test( handleObj.namespace ) ) {\n\n\t\t\t\t\tevent.handleObj = handleObj;\n\t\t\t\t\tevent.data = handleObj.data;\n\n\t\t\t\t\tret = ( ( jQuery.event.special[ handleObj.origType ] || {} ).handle ||\n\t\t\t\t\t\thandleObj.handler ).apply( matched.elem, args );\n\n\t\t\t\t\tif ( ret !== undefined ) {\n\t\t\t\t\t\tif ( ( event.result = ret ) === false ) {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Call the postDispatch hook for the mapped type\n\t\tif ( special.postDispatch ) {\n\t\t\tspecial.postDispatch.call( this, event );\n\t\t}\n\n\t\treturn event.result;\n\t},\n\n\thandlers: function( event, handlers ) {\n\t\tvar i, handleObj, sel, matchedHandlers, matchedSelectors,\n\t\t\thandlerQueue = [],\n\t\t\tdelegateCount = handlers.delegateCount,\n\t\t\tcur = event.target;\n\n\t\t// Find delegate handlers\n\t\tif ( delegateCount &&\n\n\t\t\t// Support: IE <=9\n\t\t\t// Black-hole SVG <use> instance trees (trac-13180)\n\t\t\tcur.nodeType &&\n\n\t\t\t// Support: Firefox <=42\n\t\t\t// Suppress spec-violating clicks indicating a non-primary pointer button (trac-3861)\n\t\t\t// https://www.w3.org/TR/DOM-Level-3-Events/#event-type-click\n\t\t\t// Support: IE 11 only\n\t\t\t// ...but not arrow key \"clicks\" of radio inputs, which can have `button` -1 (gh-2343)\n\t\t\t!( event.type === \"click\" && event.button >= 1 ) ) {\n\n\t\t\tfor ( ; cur !== this; cur = cur.parentNode || this ) {\n\n\t\t\t\t// Don't check non-elements (#13208)\n\t\t\t\t// Don't process clicks on disabled elements (#6911, #8165, #11382, #11764)\n\t\t\t\tif ( cur.nodeType === 1 && !( event.type === \"click\" && cur.disabled === true ) ) {\n\t\t\t\t\tmatchedHandlers = [];\n\t\t\t\t\tmatchedSelectors = {};\n\t\t\t\t\tfor ( i = 0; i < delegateCount; i++ ) {\n\t\t\t\t\t\thandleObj = handlers[ i ];\n\n\t\t\t\t\t\t// Don't conflict with Object.prototype properties (#13203)\n\t\t\t\t\t\tsel = handleObj.selector + \" \";\n\n\t\t\t\t\t\tif ( matchedSelectors[ sel ] === undefined ) {\n\t\t\t\t\t\t\tmatchedSelectors[ sel ] = handleObj.needsContext ?\n\t\t\t\t\t\t\t\tjQuery( sel, this ).index( cur ) > -1 :\n\t\t\t\t\t\t\t\tjQuery.find( sel, this, null, [ cur ] ).length;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif ( matchedSelectors[ sel ] ) {\n\t\t\t\t\t\t\tmatchedHandlers.push( handleObj );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tif ( matchedHandlers.length ) {\n\t\t\t\t\t\thandlerQueue.push( { elem: cur, handlers: matchedHandlers } );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Add the remaining (directly-bound) handlers\n\t\tcur = this;\n\t\tif ( delegateCount < handlers.length ) {\n\t\t\thandlerQueue.push( { elem: cur, handlers: handlers.slice( delegateCount ) } );\n\t\t}\n\n\t\treturn handlerQueue;\n\t},\n\n\taddProp: function( name, hook ) {\n\t\tObject.defineProperty( jQuery.Event.prototype, name, {\n\t\t\tenumerable: true,\n\t\t\tconfigurable: true,\n\n\t\t\tget: isFunction( hook ) ?\n\t\t\t\tfunction() {\n\t\t\t\t\tif ( this.originalEvent ) {\n\t\t\t\t\t\t\treturn hook( this.originalEvent );\n\t\t\t\t\t}\n\t\t\t\t} :\n\t\t\t\tfunction() {\n\t\t\t\t\tif ( this.originalEvent ) {\n\t\t\t\t\t\t\treturn this.originalEvent[ name ];\n\t\t\t\t\t}\n\t\t\t\t},\n\n\t\t\tset: function( value ) {\n\t\t\t\tObject.defineProperty( this, name, {\n\t\t\t\t\tenumerable: true,\n\t\t\t\t\tconfigurable: true,\n\t\t\t\t\twritable: true,\n\t\t\t\t\tvalue: value\n\t\t\t\t} );\n\t\t\t}\n\t\t} );\n\t},\n\n\tfix: function( originalEvent ) {\n\t\treturn originalEvent[ jQuery.expando ] ?\n\t\t\toriginalEvent :\n\t\t\tnew jQuery.Event( originalEvent );\n\t},\n\n\tspecial: {\n\t\tload: {\n\n\t\t\t// Prevent triggered image.load events from bubbling to window.load\n\t\t\tnoBubble: true\n\t\t},\n\t\tclick: {\n\n\t\t\t// Utilize native event to ensure correct state for checkable inputs\n\t\t\tsetup: function( data ) {\n\n\t\t\t\t// For mutual compressibility with _default, replace `this` access with a local var.\n\t\t\t\t// `|| data` is dead code meant only to preserve the variable through minification.\n\t\t\t\tvar el = this || data;\n\n\t\t\t\t// Claim the first handler\n\t\t\t\tif ( rcheckableType.test( el.type ) &&\n\t\t\t\t\tel.click && nodeName( el, \"input\" ) &&\n\t\t\t\t\tdataPriv.get( el, \"click\" ) === undefined ) {\n\n\t\t\t\t\t// dataPriv.set( el, \"click\", ... )\n\t\t\t\t\tleverageNative( el, \"click\", returnTrue );\n\t\t\t\t}\n\n\t\t\t\t// Return false to allow normal processing in the caller\n\t\t\t\treturn false;\n\t\t\t},\n\t\t\ttrigger: function( data ) {\n\n\t\t\t\t// For mutual compressibility with _default, replace `this` access with a local var.\n\t\t\t\t// `|| data` is dead code meant only to preserve the variable through minification.\n\t\t\t\tvar el = this || data;\n\n\t\t\t\t// Force setup before triggering a click\n\t\t\t\tif ( rcheckableType.test( el.type ) &&\n\t\t\t\t\tel.click && nodeName( el, \"input\" ) &&\n\t\t\t\t\tdataPriv.get( el, \"click\" ) === undefined ) {\n\n\t\t\t\t\tleverageNative( el, \"click\" );\n\t\t\t\t}\n\n\t\t\t\t// Return non-false to allow normal event-path propagation\n\t\t\t\treturn true;\n\t\t\t},\n\n\t\t\t// For cross-browser consistency, suppress native .click() on links\n\t\t\t// Also prevent it if we're currently inside a leveraged native-event stack\n\t\t\t_default: function( event ) {\n\t\t\t\tvar target = event.target;\n\t\t\t\treturn rcheckableType.test( target.type ) &&\n\t\t\t\t\ttarget.click && nodeName( target, \"input\" ) &&\n\t\t\t\t\tdataPriv.get( target, \"click\" ) ||\n\t\t\t\t\tnodeName( target, \"a\" );\n\t\t\t}\n\t\t},\n\n\t\tbeforeunload: {\n\t\t\tpostDispatch: function( event ) {\n\n\t\t\t\t// Support: Firefox 20+\n\t\t\t\t// Firefox doesn't alert if the returnValue field is not set.\n\t\t\t\tif ( event.result !== undefined && event.originalEvent ) {\n\t\t\t\t\tevent.originalEvent.returnValue = event.result;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n};\n\n// Ensure the presence of an event listener that handles manually-triggered\n// synthetic events by interrupting progress until reinvoked in response to\n// *native* events that it fires directly, ensuring that state changes have\n// already occurred before other listeners are invoked.\nfunction leverageNative( el, type, expectSync ) {\n\n\t// Missing expectSync indicates a trigger call, which must force setup through jQuery.event.add\n\tif ( !expectSync ) {\n\t\tjQuery.event.add( el, type, returnTrue );\n\t\treturn;\n\t}\n\n\t// Register the controller as a special universal handler for all event namespaces\n\tdataPriv.set( el, type, false );\n\tjQuery.event.add( el, type, {\n\t\tnamespace: false,\n\t\thandler: function( event ) {\n\t\t\tvar notAsync, result,\n\t\t\t\tsaved = dataPriv.get( this, type );\n\n\t\t\tif ( ( event.isTrigger & 1 ) && this[ type ] ) {\n\n\t\t\t\t// Interrupt processing of the outer synthetic .trigger()ed event\n\t\t\t\tif ( !saved ) {\n\n\t\t\t\t\t// Store arguments for use when handling the inner native event\n\t\t\t\t\tsaved = slice.call( arguments );\n\t\t\t\t\tdataPriv.set( this, type, saved );\n\n\t\t\t\t\t// Trigger the native event and capture its result\n\t\t\t\t\t// Support: IE <=9 - 11+\n\t\t\t\t\t// focus() and blur() are asynchronous\n\t\t\t\t\tnotAsync = expectSync( this, type );\n\t\t\t\t\tthis[ type ]();\n\t\t\t\t\tresult = dataPriv.get( this, type );\n\t\t\t\t\tif ( saved !== result || notAsync ) {\n\t\t\t\t\t\tdataPriv.set( this, type, false );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tresult = undefined;\n\t\t\t\t\t}\n\t\t\t\t\tif ( saved !== result ) {\n\n\t\t\t\t\t\t// Cancel the outer synthetic event\n\t\t\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\treturn result;\n\t\t\t\t\t}\n\n\t\t\t\t// If this is an inner synthetic event for an event with a bubbling surrogate\n\t\t\t\t// (focus or blur), assume that the surrogate already propagated from triggering the\n\t\t\t\t// native event and prevent that from happening again here.\n\t\t\t\t// This technically gets the ordering wrong w.r.t. to `.trigger()` (in which the\n\t\t\t\t// bubbling surrogate propagates *after* the non-bubbling base), but that seems\n\t\t\t\t// less bad than duplication.\n\t\t\t\t} else if ( ( jQuery.event.special[ type ] || {} ).delegateType ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t}\n\n\t\t\t// If this is a native event triggered above, everything is now in order\n\t\t\t// Fire an inner synthetic event with the original arguments\n\t\t\t} else if ( saved ) {\n\n\t\t\t\t// ...and capture the result\n\t\t\t\tdataPriv.set( this, type, jQuery.event.trigger(\n\n\t\t\t\t\t// Support: IE <=9 - 11+\n\t\t\t\t\t// Extend with the prototype to reset the above stopImmediatePropagation()\n\t\t\t\t\tjQuery.extend( saved.shift(), jQuery.Event.prototype ),\n\t\t\t\t\tsaved,\n\t\t\t\t\tthis\n\t\t\t\t) );\n\n\t\t\t\t// Abort handling of the native event\n\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t}\n\t\t}\n\t} );\n}\n\njQuery.removeEvent = function( elem, type, handle ) {\n\n\t// This \"if\" is needed for plain objects\n\tif ( elem.removeEventListener ) {\n\t\telem.removeEventListener( type, handle );\n\t}\n};\n\njQuery.Event = function( src, props ) {\n\n\t// Allow instantiation without the 'new' keyword\n\tif ( !( this instanceof jQuery.Event ) ) {\n\t\treturn new jQuery.Event( src, props );\n\t}\n\n\t// Event object\n\tif ( src && src.type ) {\n\t\tthis.originalEvent = src;\n\t\tthis.type = src.type;\n\n\t\t// Events bubbling up the document may have been marked as prevented\n\t\t// by a handler lower down the tree; reflect the correct value.\n\t\tthis.isDefaultPrevented = src.defaultPrevented ||\n\t\t\t\tsrc.defaultPrevented === undefined &&\n\n\t\t\t\t// Support: Android <=2.3 only\n\t\t\t\tsrc.returnValue === false ?\n\t\t\treturnTrue :\n\t\t\treturnFalse;\n\n\t\t// Create target properties\n\t\t// Support: Safari <=6 - 7 only\n\t\t// Target should not be a text node (#504, #13143)\n\t\tthis.target = ( src.target && src.target.nodeType === 3 ) ?\n\t\t\tsrc.target.parentNode :\n\t\t\tsrc.target;\n\n\t\tthis.currentTarget = src.currentTarget;\n\t\tthis.relatedTarget = src.relatedTarget;\n\n\t// Event type\n\t} else {\n\t\tthis.type = src;\n\t}\n\n\t// Put explicitly provided properties onto the event object\n\tif ( props ) {\n\t\tjQuery.extend( this, props );\n\t}\n\n\t// Create a timestamp if incoming event doesn't have one\n\tthis.timeStamp = src && src.timeStamp || Date.now();\n\n\t// Mark it as fixed\n\tthis[ jQuery.expando ] = true;\n};\n\n// jQuery.Event is based on DOM3 Events as specified by the ECMAScript Language Binding\n// https://www.w3.org/TR/2003/WD-DOM-Level-3-Events-20030331/ecma-script-binding.html\njQuery.Event.prototype = {\n\tconstructor: jQuery.Event,\n\tisDefaultPrevented: returnFalse,\n\tisPropagationStopped: returnFalse,\n\tisImmediatePropagationStopped: returnFalse,\n\tisSimulated: false,\n\n\tpreventDefault: function() {\n\t\tvar e = this.originalEvent;\n\n\t\tthis.isDefaultPrevented = returnTrue;\n\n\t\tif ( e && !this.isSimulated ) {\n\t\t\te.preventDefault();\n\t\t}\n\t},\n\tstopPropagation: function() {\n\t\tvar e = this.originalEvent;\n\n\t\tthis.isPropagationStopped = returnTrue;\n\n\t\tif ( e && !this.isSimulated ) {\n\t\t\te.stopPropagation();\n\t\t}\n\t},\n\tstopImmediatePropagation: function() {\n\t\tvar e = this.originalEvent;\n\n\t\tthis.isImmediatePropagationStopped = returnTrue;\n\n\t\tif ( e && !this.isSimulated ) {\n\t\t\te.stopImmediatePropagation();\n\t\t}\n\n\t\tthis.stopPropagation();\n\t}\n};\n\n// Includes all common event props including KeyEvent and MouseEvent specific props\njQuery.each( {\n\taltKey: true,\n\tbubbles: true,\n\tcancelable: true,\n\tchangedTouches: true,\n\tctrlKey: true,\n\tdetail: true,\n\teventPhase: true,\n\tmetaKey: true,\n\tpageX: true,\n\tpageY: true,\n\tshiftKey: true,\n\tview: true,\n\t\"char\": true,\n\tcode: true,\n\tcharCode: true,\n\tkey: true,\n\tkeyCode: true,\n\tbutton: true,\n\tbuttons: true,\n\tclientX: true,\n\tclientY: true,\n\toffsetX: true,\n\toffsetY: true,\n\tpointerId: true,\n\tpointerType: true,\n\tscreenX: true,\n\tscreenY: true,\n\ttargetTouches: true,\n\ttoElement: true,\n\ttouches: true,\n\n\twhich: function( event ) {\n\t\tvar button = event.button;\n\n\t\t// Add which for key events\n\t\tif ( event.which == null && rkeyEvent.test( event.type ) ) {\n\t\t\treturn event.charCode != null ? event.charCode : event.keyCode;\n\t\t}\n\n\t\t// Add which for click: 1 === left; 2 === middle; 3 === right\n\t\tif ( !event.which && button !== undefined && rmouseEvent.test( event.type ) ) {\n\t\t\tif ( button & 1 ) {\n\t\t\t\treturn 1;\n\t\t\t}\n\n\t\t\tif ( button & 2 ) {\n\t\t\t\treturn 3;\n\t\t\t}\n\n\t\t\tif ( button & 4 ) {\n\t\t\t\treturn 2;\n\t\t\t}\n\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn event.which;\n\t}\n}, jQuery.event.addProp );\n\njQuery.each( { focus: \"focusin\", blur: \"focusout\" }, function( type, delegateType ) {\n\tjQuery.event.special[ type ] = {\n\n\t\t// Utilize native event if possible so blur/focus sequence is correct\n\t\tsetup: function() {\n\n\t\t\t// Claim the first handler\n\t\t\t// dataPriv.set( this, \"focus\", ... )\n\t\t\t// dataPriv.set( this, \"blur\", ... )\n\t\t\tleverageNative( this, type, expectSync );\n\n\t\t\t// Return false to allow normal processing in the caller\n\t\t\treturn false;\n\t\t},\n\t\ttrigger: function() {\n\n\t\t\t// Force setup before trigger\n\t\t\tleverageNative( this, type );\n\n\t\t\t// Return non-false to allow normal event-path propagation\n\t\t\treturn true;\n\t\t},\n\n\t\tdelegateType: delegateType\n\t};\n} );\n\n// Create mouseenter/leave events using mouseover/out and event-time checks\n// so that event delegation works in jQuery.\n// Do the same for pointerenter/pointerleave and pointerover/pointerout\n//\n// Support: Safari 7 only\n// Safari sends mouseenter too often; see:\n// https://bugs.chromium.org/p/chromium/issues/detail?id=470258\n// for the description of the bug (it existed in older Chrome versions as well).\njQuery.each( {\n\tmouseenter: \"mouseover\",\n\tmouseleave: \"mouseout\",\n\tpointerenter: \"pointerover\",\n\tpointerleave: \"pointerout\"\n}, function( orig, fix ) {\n\tjQuery.event.special[ orig ] = {\n\t\tdelegateType: fix,\n\t\tbindType: fix,\n\n\t\thandle: function( event ) {\n\t\t\tvar ret,\n\t\t\t\ttarget = this,\n\t\t\t\trelated = event.relatedTarget,\n\t\t\t\thandleObj = event.handleObj;\n\n\t\t\t// For mouseenter/leave call the handler if related is outside the target.\n\t\t\t// NB: No relatedTarget if the mouse left/entered the browser window\n\t\t\tif ( !related || ( related !== target && !jQuery.contains( target, related ) ) ) {\n\t\t\t\tevent.type = handleObj.origType;\n\t\t\t\tret = handleObj.handler.apply( this, arguments );\n\t\t\t\tevent.type = fix;\n\t\t\t}\n\t\t\treturn ret;\n\t\t}\n\t};\n} );\n\njQuery.fn.extend( {\n\n\ton: function( types, selector, data, fn ) {\n\t\treturn on( this, types, selector, data, fn );\n\t},\n\tone: function( types, selector, data, fn ) {\n\t\treturn on( this, types, selector, data, fn, 1 );\n\t},\n\toff: function( types, selector, fn ) {\n\t\tvar handleObj, type;\n\t\tif ( types && types.preventDefault && types.handleObj ) {\n\n\t\t\t// ( event )  dispatched jQuery.Event\n\t\t\thandleObj = types.handleObj;\n\t\t\tjQuery( types.delegateTarget ).off(\n\t\t\t\thandleObj.namespace ?\n\t\t\t\t\thandleObj.origType + \".\" + handleObj.namespace :\n\t\t\t\t\thandleObj.origType,\n\t\t\t\thandleObj.selector,\n\t\t\t\thandleObj.handler\n\t\t\t);\n\t\t\treturn this;\n\t\t}\n\t\tif ( typeof types === \"object\" ) {\n\n\t\t\t// ( types-object [, selector] )\n\t\t\tfor ( type in types ) {\n\t\t\t\tthis.off( type, selector, types[ type ] );\n\t\t\t}\n\t\t\treturn this;\n\t\t}\n\t\tif ( selector === false || typeof selector === \"function\" ) {\n\n\t\t\t// ( types [, fn] )\n\t\t\tfn = selector;\n\t\t\tselector = undefined;\n\t\t}\n\t\tif ( fn === false ) {\n\t\t\tfn = returnFalse;\n\t\t}\n\t\treturn this.each( function() {\n\t\t\tjQuery.event.remove( this, types, fn, selector );\n\t\t} );\n\t}\n} );\n\n\nvar\n\n\t/* eslint-disable max-len */\n\n\t// See https://github.com/eslint/eslint/issues/3229\n\trxhtmlTag = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([a-z][^\\/\\0>\\x20\\t\\r\\n\\f]*)[^>]*)\\/>/gi,\n\n\t/* eslint-enable */\n\n\t// Support: IE <=10 - 11, Edge 12 - 13 only\n\t// In IE/Edge using regex groups here causes severe slowdowns.\n\t// See https://connect.microsoft.com/IE/feedback/details/1736512/\n\trnoInnerhtml = /<script|<style|<link/i,\n\n\t// checked=\"checked\" or checked\n\trchecked = /checked\\s*(?:[^=]|=\\s*.checked.)/i,\n\trcleanScript = /^\\s*<!(?:\\[CDATA\\[|--)|(?:\\]\\]|--)>\\s*$/g;\n\n// Prefer a tbody over its parent table for containing new rows\nfunction manipulationTarget( elem, content ) {\n\tif ( nodeName( elem, \"table\" ) &&\n\t\tnodeName( content.nodeType !== 11 ? content : content.firstChild, \"tr\" ) ) {\n\n\t\treturn jQuery( elem ).children( \"tbody\" )[ 0 ] || elem;\n\t}\n\n\treturn elem;\n}\n\n// Replace/restore the type attribute of script elements for safe DOM manipulation\nfunction disableScript( elem ) {\n\telem.type = ( elem.getAttribute( \"type\" ) !== null ) + \"/\" + elem.type;\n\treturn elem;\n}\nfunction restoreScript( elem ) {\n\tif ( ( elem.type || \"\" ).slice( 0, 5 ) === \"true/\" ) {\n\t\telem.type = elem.type.slice( 5 );\n\t} else {\n\t\telem.removeAttribute( \"type\" );\n\t}\n\n\treturn elem;\n}\n\nfunction cloneCopyEvent( src, dest ) {\n\tvar i, l, type, pdataOld, pdataCur, udataOld, udataCur, events;\n\n\tif ( dest.nodeType !== 1 ) {\n\t\treturn;\n\t}\n\n\t// 1. Copy private data: events, handlers, etc.\n\tif ( dataPriv.hasData( src ) ) {\n\t\tpdataOld = dataPriv.access( src );\n\t\tpdataCur = dataPriv.set( dest, pdataOld );\n\t\tevents = pdataOld.events;\n\n\t\tif ( events ) {\n\t\t\tdelete pdataCur.handle;\n\t\t\tpdataCur.events = {};\n\n\t\t\tfor ( type in events ) {\n\t\t\t\tfor ( i = 0, l = events[ type ].length; i < l; i++ ) {\n\t\t\t\t\tjQuery.event.add( dest, type, events[ type ][ i ] );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// 2. Copy user data\n\tif ( dataUser.hasData( src ) ) {\n\t\tudataOld = dataUser.access( src );\n\t\tudataCur = jQuery.extend( {}, udataOld );\n\n\t\tdataUser.set( dest, udataCur );\n\t}\n}\n\n// Fix IE bugs, see support tests\nfunction fixInput( src, dest ) {\n\tvar nodeName = dest.nodeName.toLowerCase();\n\n\t// Fails to persist the checked state of a cloned checkbox or radio button.\n\tif ( nodeName === \"input\" && rcheckableType.test( src.type ) ) {\n\t\tdest.checked = src.checked;\n\n\t// Fails to return the selected option to the default selected state when cloning options\n\t} else if ( nodeName === \"input\" || nodeName === \"textarea\" ) {\n\t\tdest.defaultValue = src.defaultValue;\n\t}\n}\n\nfunction domManip( collection, args, callback, ignored ) {\n\n\t// Flatten any nested arrays\n\targs = concat.apply( [], args );\n\n\tvar fragment, first, scripts, hasScripts, node, doc,\n\t\ti = 0,\n\t\tl = collection.length,\n\t\tiNoClone = l - 1,\n\t\tvalue = args[ 0 ],\n\t\tvalueIsFunction = isFunction( value );\n\n\t// We can't cloneNode fragments that contain checked, in WebKit\n\tif ( valueIsFunction ||\n\t\t\t( l > 1 && typeof value === \"string\" &&\n\t\t\t\t!support.checkClone && rchecked.test( value ) ) ) {\n\t\treturn collection.each( function( index ) {\n\t\t\tvar self = collection.eq( index );\n\t\t\tif ( valueIsFunction ) {\n\t\t\t\targs[ 0 ] = value.call( this, index, self.html() );\n\t\t\t}\n\t\t\tdomManip( self, args, callback, ignored );\n\t\t} );\n\t}\n\n\tif ( l ) {\n\t\tfragment = buildFragment( args, collection[ 0 ].ownerDocument, false, collection, ignored );\n\t\tfirst = fragment.firstChild;\n\n\t\tif ( fragment.childNodes.length === 1 ) {\n\t\t\tfragment = first;\n\t\t}\n\n\t\t// Require either new content or an interest in ignored elements to invoke the callback\n\t\tif ( first || ignored ) {\n\t\t\tscripts = jQuery.map( getAll( fragment, \"script\" ), disableScript );\n\t\t\thasScripts = scripts.length;\n\n\t\t\t// Use the original fragment for the last item\n\t\t\t// instead of the first because it can end up\n\t\t\t// being emptied incorrectly in certain situations (#8070).\n\t\t\tfor ( ; i < l; i++ ) {\n\t\t\t\tnode = fragment;\n\n\t\t\t\tif ( i !== iNoClone ) {\n\t\t\t\t\tnode = jQuery.clone( node, true, true );\n\n\t\t\t\t\t// Keep references to cloned scripts for later restoration\n\t\t\t\t\tif ( hasScripts ) {\n\n\t\t\t\t\t\t// Support: Android <=4.0 only, PhantomJS 1 only\n\t\t\t\t\t\t// push.apply(_, arraylike) throws on ancient WebKit\n\t\t\t\t\t\tjQuery.merge( scripts, getAll( node, \"script\" ) );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tcallback.call( collection[ i ], node, i );\n\t\t\t}\n\n\t\t\tif ( hasScripts ) {\n\t\t\t\tdoc = scripts[ scripts.length - 1 ].ownerDocument;\n\n\t\t\t\t// Reenable scripts\n\t\t\t\tjQuery.map( scripts, restoreScript );\n\n\t\t\t\t// Evaluate executable scripts on first document insertion\n\t\t\t\tfor ( i = 0; i < hasScripts; i++ ) {\n\t\t\t\t\tnode = scripts[ i ];\n\t\t\t\t\tif ( rscriptType.test( node.type || \"\" ) &&\n\t\t\t\t\t\t!dataPriv.access( node, \"globalEval\" ) &&\n\t\t\t\t\t\tjQuery.contains( doc, node ) ) {\n\n\t\t\t\t\t\tif ( node.src && ( node.type || \"\" ).toLowerCase()  !== \"module\" ) {\n\n\t\t\t\t\t\t\t// Optional AJAX dependency, but won't run scripts if not present\n\t\t\t\t\t\t\tif ( jQuery._evalUrl && !node.noModule ) {\n\t\t\t\t\t\t\t\tjQuery._evalUrl( node.src, {\n\t\t\t\t\t\t\t\t\tnonce: node.nonce || node.getAttribute( \"nonce\" )\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tDOMEval( node.textContent.replace( rcleanScript, \"\" ), node, doc );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\treturn collection;\n}\n\nfunction remove( elem, selector, keepData ) {\n\tvar node,\n\t\tnodes = selector ? jQuery.filter( selector, elem ) : elem,\n\t\ti = 0;\n\n\tfor ( ; ( node = nodes[ i ] ) != null; i++ ) {\n\t\tif ( !keepData && node.nodeType === 1 ) {\n\t\t\tjQuery.cleanData( getAll( node ) );\n\t\t}\n\n\t\tif ( node.parentNode ) {\n\t\t\tif ( keepData && isAttached( node ) ) {\n\t\t\t\tsetGlobalEval( getAll( node, \"script\" ) );\n\t\t\t}\n\t\t\tnode.parentNode.removeChild( node );\n\t\t}\n\t}\n\n\treturn elem;\n}\n\njQuery.extend( {\n\thtmlPrefilter: function( html ) {\n\t\treturn html.replace( rxhtmlTag, \"<$1></$2>\" );\n\t},\n\n\tclone: function( elem, dataAndEvents, deepDataAndEvents ) {\n\t\tvar i, l, srcElements, destElements,\n\t\t\tclone = elem.cloneNode( true ),\n\t\t\tinPage = isAttached( elem );\n\n\t\t// Fix IE cloning issues\n\t\tif ( !support.noCloneChecked && ( elem.nodeType === 1 || elem.nodeType === 11 ) &&\n\t\t\t\t!jQuery.isXMLDoc( elem ) ) {\n\n\t\t\t// We eschew Sizzle here for performance reasons: https://jsperf.com/getall-vs-sizzle/2\n\t\t\tdestElements = getAll( clone );\n\t\t\tsrcElements = getAll( elem );\n\n\t\t\tfor ( i = 0, l = srcElements.length; i < l; i++ ) {\n\t\t\t\tfixInput( srcElements[ i ], destElements[ i ] );\n\t\t\t}\n\t\t}\n\n\t\t// Copy the events from the original to the clone\n\t\tif ( dataAndEvents ) {\n\t\t\tif ( deepDataAndEvents ) {\n\t\t\t\tsrcElements = srcElements || getAll( elem );\n\t\t\t\tdestElements = destElements || getAll( clone );\n\n\t\t\t\tfor ( i = 0, l = srcElements.length; i < l; i++ ) {\n\t\t\t\t\tcloneCopyEvent( srcElements[ i ], destElements[ i ] );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tcloneCopyEvent( elem, clone );\n\t\t\t}\n\t\t}\n\n\t\t// Preserve script evaluation history\n\t\tdestElements = getAll( clone, \"script\" );\n\t\tif ( destElements.length > 0 ) {\n\t\t\tsetGlobalEval( destElements, !inPage && getAll( elem, \"script\" ) );\n\t\t}\n\n\t\t// Return the cloned set\n\t\treturn clone;\n\t},\n\n\tcleanData: function( elems ) {\n\t\tvar data, elem, type,\n\t\t\tspecial = jQuery.event.special,\n\t\t\ti = 0;\n\n\t\tfor ( ; ( elem = elems[ i ] ) !== undefined; i++ ) {\n\t\t\tif ( acceptData( elem ) ) {\n\t\t\t\tif ( ( data = elem[ dataPriv.expando ] ) ) {\n\t\t\t\t\tif ( data.events ) {\n\t\t\t\t\t\tfor ( type in data.events ) {\n\t\t\t\t\t\t\tif ( special[ type ] ) {\n\t\t\t\t\t\t\t\tjQuery.event.remove( elem, type );\n\n\t\t\t\t\t\t\t// This is a shortcut to avoid jQuery.event.remove's overhead\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tjQuery.removeEvent( elem, type, data.handle );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Support: Chrome <=35 - 45+\n\t\t\t\t\t// Assign undefined instead of using delete, see Data#remove\n\t\t\t\t\telem[ dataPriv.expando ] = undefined;\n\t\t\t\t}\n\t\t\t\tif ( elem[ dataUser.expando ] ) {\n\n\t\t\t\t\t// Support: Chrome <=35 - 45+\n\t\t\t\t\t// Assign undefined instead of using delete, see Data#remove\n\t\t\t\t\telem[ dataUser.expando ] = undefined;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n} );\n\njQuery.fn.extend( {\n\tdetach: function( selector ) {\n\t\treturn remove( this, selector, true );\n\t},\n\n\tremove: function( selector ) {\n\t\treturn remove( this, selector );\n\t},\n\n\ttext: function( value ) {\n\t\treturn access( this, function( value ) {\n\t\t\treturn value === undefined ?\n\t\t\t\tjQuery.text( this ) :\n\t\t\t\tthis.empty().each( function() {\n\t\t\t\t\tif ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {\n\t\t\t\t\t\tthis.textContent = value;\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t}, null, value, arguments.length );\n\t},\n\n\tappend: function() {\n\t\treturn domManip( this, arguments, function( elem ) {\n\t\t\tif ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {\n\t\t\t\tvar target = manipulationTarget( this, elem );\n\t\t\t\ttarget.appendChild( elem );\n\t\t\t}\n\t\t} );\n\t},\n\n\tprepend: function() {\n\t\treturn domManip( this, arguments, function( elem ) {\n\t\t\tif ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {\n\t\t\t\tvar target = manipulationTarget( this, elem );\n\t\t\t\ttarget.insertBefore( elem, target.firstChild );\n\t\t\t}\n\t\t} );\n\t},\n\n\tbefore: function() {\n\t\treturn domManip( this, arguments, function( elem ) {\n\t\t\tif ( this.parentNode ) {\n\t\t\t\tthis.parentNode.insertBefore( elem, this );\n\t\t\t}\n\t\t} );\n\t},\n\n\tafter: function() {\n\t\treturn domManip( this, arguments, function( elem ) {\n\t\t\tif ( this.parentNode ) {\n\t\t\t\tthis.parentNode.insertBefore( elem, this.nextSibling );\n\t\t\t}\n\t\t} );\n\t},\n\n\tempty: function() {\n\t\tvar elem,\n\t\t\ti = 0;\n\n\t\tfor ( ; ( elem = this[ i ] ) != null; i++ ) {\n\t\t\tif ( elem.nodeType === 1 ) {\n\n\t\t\t\t// Prevent memory leaks\n\t\t\t\tjQuery.cleanData( getAll( elem, false ) );\n\n\t\t\t\t// Remove any remaining nodes\n\t\t\t\telem.textContent = \"\";\n\t\t\t}\n\t\t}\n\n\t\treturn this;\n\t},\n\n\tclone: function( dataAndEvents, deepDataAndEvents ) {\n\t\tdataAndEvents = dataAndEvents == null ? false : dataAndEvents;\n\t\tdeepDataAndEvents = deepDataAndEvents == null ? dataAndEvents : deepDataAndEvents;\n\n\t\treturn this.map( function() {\n\t\t\treturn jQuery.clone( this, dataAndEvents, deepDataAndEvents );\n\t\t} );\n\t},\n\n\thtml: function( value ) {\n\t\treturn access( this, function( value ) {\n\t\t\tvar elem = this[ 0 ] || {},\n\t\t\t\ti = 0,\n\t\t\t\tl = this.length;\n\n\t\t\tif ( value === undefined && elem.nodeType === 1 ) {\n\t\t\t\treturn elem.innerHTML;\n\t\t\t}\n\n\t\t\t// See if we can take a shortcut and just use innerHTML\n\t\t\tif ( typeof value === \"string\" && !rnoInnerhtml.test( value ) &&\n\t\t\t\t!wrapMap[ ( rtagName.exec( value ) || [ \"\", \"\" ] )[ 1 ].toLowerCase() ] ) {\n\n\t\t\t\tvalue = jQuery.htmlPrefilter( value );\n\n\t\t\t\ttry {\n\t\t\t\t\tfor ( ; i < l; i++ ) {\n\t\t\t\t\t\telem = this[ i ] || {};\n\n\t\t\t\t\t\t// Remove element nodes and prevent memory leaks\n\t\t\t\t\t\tif ( elem.nodeType === 1 ) {\n\t\t\t\t\t\t\tjQuery.cleanData( getAll( elem, false ) );\n\t\t\t\t\t\t\telem.innerHTML = value;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\telem = 0;\n\n\t\t\t\t// If using innerHTML throws an exception, use the fallback method\n\t\t\t\t} catch ( e ) {}\n\t\t\t}\n\n\t\t\tif ( elem ) {\n\t\t\t\tthis.empty().append( value );\n\t\t\t}\n\t\t}, null, value, arguments.length );\n\t},\n\n\treplaceWith: function() {\n\t\tvar ignored = [];\n\n\t\t// Make the changes, replacing each non-ignored context element with the new content\n\t\treturn domManip( this, arguments, function( elem ) {\n\t\t\tvar parent = this.parentNode;\n\n\t\t\tif ( jQuery.inArray( this, ignored ) < 0 ) {\n\t\t\t\tjQuery.cleanData( getAll( this ) );\n\t\t\t\tif ( parent ) {\n\t\t\t\t\tparent.replaceChild( elem, this );\n\t\t\t\t}\n\t\t\t}\n\n\t\t// Force callback invocation\n\t\t}, ignored );\n\t}\n} );\n\njQuery.each( {\n\tappendTo: \"append\",\n\tprependTo: \"prepend\",\n\tinsertBefore: \"before\",\n\tinsertAfter: \"after\",\n\treplaceAll: \"replaceWith\"\n}, function( name, original ) {\n\tjQuery.fn[ name ] = function( selector ) {\n\t\tvar elems,\n\t\t\tret = [],\n\t\t\tinsert = jQuery( selector ),\n\t\t\tlast = insert.length - 1,\n\t\t\ti = 0;\n\n\t\tfor ( ; i <= last; i++ ) {\n\t\t\telems = i === last ? this : this.clone( true );\n\t\t\tjQuery( insert[ i ] )[ original ]( elems );\n\n\t\t\t// Support: Android <=4.0 only, PhantomJS 1 only\n\t\t\t// .get() because push.apply(_, arraylike) throws on ancient WebKit\n\t\t\tpush.apply( ret, elems.get() );\n\t\t}\n\n\t\treturn this.pushStack( ret );\n\t};\n} );\nvar rnumnonpx = new RegExp( \"^(\" + pnum + \")(?!px)[a-z%]+$\", \"i\" );\n\nvar getStyles = function( elem ) {\n\n\t\t// Support: IE <=11 only, Firefox <=30 (#15098, #14150)\n\t\t// IE throws on elements created in popups\n\t\t// FF meanwhile throws on frame elements through \"defaultView.getComputedStyle\"\n\t\tvar view = elem.ownerDocument.defaultView;\n\n\t\tif ( !view || !view.opener ) {\n\t\t\tview = window;\n\t\t}\n\n\t\treturn view.getComputedStyle( elem );\n\t};\n\nvar rboxStyle = new RegExp( cssExpand.join( \"|\" ), \"i\" );\n\n\n\n( function() {\n\n\t// Executing both pixelPosition & boxSizingReliable tests require only one layout\n\t// so they're executed at the same time to save the second computation.\n\tfunction computeStyleTests() {\n\n\t\t// This is a singleton, we need to execute it only once\n\t\tif ( !div ) {\n\t\t\treturn;\n\t\t}\n\n\t\tcontainer.style.cssText = \"position:absolute;left:-11111px;width:60px;\" +\n\t\t\t\"margin-top:1px;padding:0;border:0\";\n\t\tdiv.style.cssText =\n\t\t\t\"position:relative;display:block;box-sizing:border-box;overflow:scroll;\" +\n\t\t\t\"margin:auto;border:1px;padding:1px;\" +\n\t\t\t\"width:60%;top:1%\";\n\t\tdocumentElement.appendChild( container ).appendChild( div );\n\n\t\tvar divStyle = window.getComputedStyle( div );\n\t\tpixelPositionVal = divStyle.top !== \"1%\";\n\n\t\t// Support: Android 4.0 - 4.3 only, Firefox <=3 - 44\n\t\treliableMarginLeftVal = roundPixelMeasures( divStyle.marginLeft ) === 12;\n\n\t\t// Support: Android 4.0 - 4.3 only, Safari <=9.1 - 10.1, iOS <=7.0 - 9.3\n\t\t// Some styles come back with percentage values, even though they shouldn't\n\t\tdiv.style.right = \"60%\";\n\t\tpixelBoxStylesVal = roundPixelMeasures( divStyle.right ) === 36;\n\n\t\t// Support: IE 9 - 11 only\n\t\t// Detect misreporting of content dimensions for box-sizing:border-box elements\n\t\tboxSizingReliableVal = roundPixelMeasures( divStyle.width ) === 36;\n\n\t\t// Support: IE 9 only\n\t\t// Detect overflow:scroll screwiness (gh-3699)\n\t\t// Support: Chrome <=64\n\t\t// Don't get tricked when zoom affects offsetWidth (gh-4029)\n\t\tdiv.style.position = \"absolute\";\n\t\tscrollboxSizeVal = roundPixelMeasures( div.offsetWidth / 3 ) === 12;\n\n\t\tdocumentElement.removeChild( container );\n\n\t\t// Nullify the div so it wouldn't be stored in the memory and\n\t\t// it will also be a sign that checks already performed\n\t\tdiv = null;\n\t}\n\n\tfunction roundPixelMeasures( measure ) {\n\t\treturn Math.round( parseFloat( measure ) );\n\t}\n\n\tvar pixelPositionVal, boxSizingReliableVal, scrollboxSizeVal, pixelBoxStylesVal,\n\t\treliableMarginLeftVal,\n\t\tcontainer = document.createElement( \"div\" ),\n\t\tdiv = document.createElement( \"div\" );\n\n\t// Finish early in limited (non-browser) environments\n\tif ( !div.style ) {\n\t\treturn;\n\t}\n\n\t// Support: IE <=9 - 11 only\n\t// Style of cloned element affects source element cloned (#8908)\n\tdiv.style.backgroundClip = \"content-box\";\n\tdiv.cloneNode( true ).style.backgroundClip = \"\";\n\tsupport.clearCloneStyle = div.style.backgroundClip === \"content-box\";\n\n\tjQuery.extend( support, {\n\t\tboxSizingReliable: function() {\n\t\t\tcomputeStyleTests();\n\t\t\treturn boxSizingReliableVal;\n\t\t},\n\t\tpixelBoxStyles: function() {\n\t\t\tcomputeStyleTests();\n\t\t\treturn pixelBoxStylesVal;\n\t\t},\n\t\tpixelPosition: function() {\n\t\t\tcomputeStyleTests();\n\t\t\treturn pixelPositionVal;\n\t\t},\n\t\treliableMarginLeft: function() {\n\t\t\tcomputeStyleTests();\n\t\t\treturn reliableMarginLeftVal;\n\t\t},\n\t\tscrollboxSize: function() {\n\t\t\tcomputeStyleTests();\n\t\t\treturn scrollboxSizeVal;\n\t\t}\n\t} );\n} )();\n\n\nfunction curCSS( elem, name, computed ) {\n\tvar width, minWidth, maxWidth, ret,\n\n\t\t// Support: Firefox 51+\n\t\t// Retrieving style before computed somehow\n\t\t// fixes an issue with getting wrong values\n\t\t// on detached elements\n\t\tstyle = elem.style;\n\n\tcomputed = computed || getStyles( elem );\n\n\t// getPropertyValue is needed for:\n\t//   .css('filter') (IE 9 only, #12537)\n\t//   .css('--customProperty) (#3144)\n\tif ( computed ) {\n\t\tret = computed.getPropertyValue( name ) || computed[ name ];\n\n\t\tif ( ret === \"\" && !isAttached( elem ) ) {\n\t\t\tret = jQuery.style( elem, name );\n\t\t}\n\n\t\t// A tribute to the \"awesome hack by Dean Edwards\"\n\t\t// Android Browser returns percentage for some values,\n\t\t// but width seems to be reliably pixels.\n\t\t// This is against the CSSOM draft spec:\n\t\t// https://drafts.csswg.org/cssom/#resolved-values\n\t\tif ( !support.pixelBoxStyles() && rnumnonpx.test( ret ) && rboxStyle.test( name ) ) {\n\n\t\t\t// Remember the original values\n\t\t\twidth = style.width;\n\t\t\tminWidth = style.minWidth;\n\t\t\tmaxWidth = style.maxWidth;\n\n\t\t\t// Put in the new values to get a computed value out\n\t\t\tstyle.minWidth = style.maxWidth = style.width = ret;\n\t\t\tret = computed.width;\n\n\t\t\t// Revert the changed values\n\t\t\tstyle.width = width;\n\t\t\tstyle.minWidth = minWidth;\n\t\t\tstyle.maxWidth = maxWidth;\n\t\t}\n\t}\n\n\treturn ret !== undefined ?\n\n\t\t// Support: IE <=9 - 11 only\n\t\t// IE returns zIndex value as an integer.\n\t\tret + \"\" :\n\t\tret;\n}\n\n\nfunction addGetHookIf( conditionFn, hookFn ) {\n\n\t// Define the hook, we'll check on the first run if it's really needed.\n\treturn {\n\t\tget: function() {\n\t\t\tif ( conditionFn() ) {\n\n\t\t\t\t// Hook not needed (or it's not possible to use it due\n\t\t\t\t// to missing dependency), remove it.\n\t\t\t\tdelete this.get;\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Hook needed; redefine it so that the support test is not executed again.\n\t\t\treturn ( this.get = hookFn ).apply( this, arguments );\n\t\t}\n\t};\n}\n\n\nvar cssPrefixes = [ \"Webkit\", \"Moz\", \"ms\" ],\n\temptyStyle = document.createElement( \"div\" ).style,\n\tvendorProps = {};\n\n// Return a vendor-prefixed property or undefined\nfunction vendorPropName( name ) {\n\n\t// Check for vendor prefixed names\n\tvar capName = name[ 0 ].toUpperCase() + name.slice( 1 ),\n\t\ti = cssPrefixes.length;\n\n\twhile ( i-- ) {\n\t\tname = cssPrefixes[ i ] + capName;\n\t\tif ( name in emptyStyle ) {\n\t\t\treturn name;\n\t\t}\n\t}\n}\n\n// Return a potentially-mapped jQuery.cssProps or vendor prefixed property\nfunction finalPropName( name ) {\n\tvar final = jQuery.cssProps[ name ] || vendorProps[ name ];\n\n\tif ( final ) {\n\t\treturn final;\n\t}\n\tif ( name in emptyStyle ) {\n\t\treturn name;\n\t}\n\treturn vendorProps[ name ] = vendorPropName( name ) || name;\n}\n\n\nvar\n\n\t// Swappable if display is none or starts with table\n\t// except \"table\", \"table-cell\", or \"table-caption\"\n\t// See here for display values: https://developer.mozilla.org/en-US/docs/CSS/display\n\trdisplayswap = /^(none|table(?!-c[ea]).+)/,\n\trcustomProp = /^--/,\n\tcssShow = { position: \"absolute\", visibility: \"hidden\", display: \"block\" },\n\tcssNormalTransform = {\n\t\tletterSpacing: \"0\",\n\t\tfontWeight: \"400\"\n\t};\n\nfunction setPositiveNumber( elem, value, subtract ) {\n\n\t// Any relative (+/-) values have already been\n\t// normalized at this point\n\tvar matches = rcssNum.exec( value );\n\treturn matches ?\n\n\t\t// Guard against undefined \"subtract\", e.g., when used as in cssHooks\n\t\tMath.max( 0, matches[ 2 ] - ( subtract || 0 ) ) + ( matches[ 3 ] || \"px\" ) :\n\t\tvalue;\n}\n\nfunction boxModelAdjustment( elem, dimension, box, isBorderBox, styles, computedVal ) {\n\tvar i = dimension === \"width\" ? 1 : 0,\n\t\textra = 0,\n\t\tdelta = 0;\n\n\t// Adjustment may not be necessary\n\tif ( box === ( isBorderBox ? \"border\" : \"content\" ) ) {\n\t\treturn 0;\n\t}\n\n\tfor ( ; i < 4; i += 2 ) {\n\n\t\t// Both box models exclude margin\n\t\tif ( box === \"margin\" ) {\n\t\t\tdelta += jQuery.css( elem, box + cssExpand[ i ], true, styles );\n\t\t}\n\n\t\t// If we get here with a content-box, we're seeking \"padding\" or \"border\" or \"margin\"\n\t\tif ( !isBorderBox ) {\n\n\t\t\t// Add padding\n\t\t\tdelta += jQuery.css( elem, \"padding\" + cssExpand[ i ], true, styles );\n\n\t\t\t// For \"border\" or \"margin\", add border\n\t\t\tif ( box !== \"padding\" ) {\n\t\t\t\tdelta += jQuery.css( elem, \"border\" + cssExpand[ i ] + \"Width\", true, styles );\n\n\t\t\t// But still keep track of it otherwise\n\t\t\t} else {\n\t\t\t\textra += jQuery.css( elem, \"border\" + cssExpand[ i ] + \"Width\", true, styles );\n\t\t\t}\n\n\t\t// If we get here with a border-box (content + padding + border), we're seeking \"content\" or\n\t\t// \"padding\" or \"margin\"\n\t\t} else {\n\n\t\t\t// For \"content\", subtract padding\n\t\t\tif ( box === \"content\" ) {\n\t\t\t\tdelta -= jQuery.css( elem, \"padding\" + cssExpand[ i ], true, styles );\n\t\t\t}\n\n\t\t\t// For \"content\" or \"padding\", subtract border\n\t\t\tif ( box !== \"margin\" ) {\n\t\t\t\tdelta -= jQuery.css( elem, \"border\" + cssExpand[ i ] + \"Width\", true, styles );\n\t\t\t}\n\t\t}\n\t}\n\n\t// Account for positive content-box scroll gutter when requested by providing computedVal\n\tif ( !isBorderBox && computedVal >= 0 ) {\n\n\t\t// offsetWidth/offsetHeight is a rounded sum of content, padding, scroll gutter, and border\n\t\t// Assuming integer scroll gutter, subtract the rest and round down\n\t\tdelta += Math.max( 0, Math.ceil(\n\t\t\telem[ \"offset\" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] -\n\t\t\tcomputedVal -\n\t\t\tdelta -\n\t\t\textra -\n\t\t\t0.5\n\n\t\t// If offsetWidth/offsetHeight is unknown, then we can't determine content-box scroll gutter\n\t\t// Use an explicit zero to avoid NaN (gh-3964)\n\t\t) ) || 0;\n\t}\n\n\treturn delta;\n}\n\nfunction getWidthOrHeight( elem, dimension, extra ) {\n\n\t// Start with computed style\n\tvar styles = getStyles( elem ),\n\n\t\t// To avoid forcing a reflow, only fetch boxSizing if we need it (gh-4322).\n\t\t// Fake content-box until we know it's needed to know the true value.\n\t\tboxSizingNeeded = !support.boxSizingReliable() || extra,\n\t\tisBorderBox = boxSizingNeeded &&\n\t\t\tjQuery.css( elem, \"boxSizing\", false, styles ) === \"border-box\",\n\t\tvalueIsBorderBox = isBorderBox,\n\n\t\tval = curCSS( elem, dimension, styles ),\n\t\toffsetProp = \"offset\" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 );\n\n\t// Support: Firefox <=54\n\t// Return a confounding non-pixel value or feign ignorance, as appropriate.\n\tif ( rnumnonpx.test( val ) ) {\n\t\tif ( !extra ) {\n\t\t\treturn val;\n\t\t}\n\t\tval = \"auto\";\n\t}\n\n\n\t// Fall back to offsetWidth/offsetHeight when value is \"auto\"\n\t// This happens for inline elements with no explicit setting (gh-3571)\n\t// Support: Android <=4.1 - 4.3 only\n\t// Also use offsetWidth/offsetHeight for misreported inline dimensions (gh-3602)\n\t// Support: IE 9-11 only\n\t// Also use offsetWidth/offsetHeight for when box sizing is unreliable\n\t// We use getClientRects() to check for hidden/disconnected.\n\t// In those cases, the computed value can be trusted to be border-box\n\tif ( ( !support.boxSizingReliable() && isBorderBox ||\n\t\tval === \"auto\" ||\n\t\t!parseFloat( val ) && jQuery.css( elem, \"display\", false, styles ) === \"inline\" ) &&\n\t\telem.getClientRects().length ) {\n\n\t\tisBorderBox = jQuery.css( elem, \"boxSizing\", false, styles ) === \"border-box\";\n\n\t\t// Where available, offsetWidth/offsetHeight approximate border box dimensions.\n\t\t// Where not available (e.g., SVG), assume unreliable box-sizing and interpret the\n\t\t// retrieved value as a content box dimension.\n\t\tvalueIsBorderBox = offsetProp in elem;\n\t\tif ( valueIsBorderBox ) {\n\t\t\tval = elem[ offsetProp ];\n\t\t}\n\t}\n\n\t// Normalize \"\" and auto\n\tval = parseFloat( val ) || 0;\n\n\t// Adjust for the element's box model\n\treturn ( val +\n\t\tboxModelAdjustment(\n\t\t\telem,\n\t\t\tdimension,\n\t\t\textra || ( isBorderBox ? \"border\" : \"content\" ),\n\t\t\tvalueIsBorderBox,\n\t\t\tstyles,\n\n\t\t\t// Provide the current computed size to request scroll gutter calculation (gh-3589)\n\t\t\tval\n\t\t)\n\t) + \"px\";\n}\n\njQuery.extend( {\n\n\t// Add in style property hooks for overriding the default\n\t// behavior of getting and setting a style property\n\tcssHooks: {\n\t\topacity: {\n\t\t\tget: function( elem, computed ) {\n\t\t\t\tif ( computed ) {\n\n\t\t\t\t\t// We should always get a number back from opacity\n\t\t\t\t\tvar ret = curCSS( elem, \"opacity\" );\n\t\t\t\t\treturn ret === \"\" ? \"1\" : ret;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t},\n\n\t// Don't automatically add \"px\" to these possibly-unitless properties\n\tcssNumber: {\n\t\t\"animationIterationCount\": true,\n\t\t\"columnCount\": true,\n\t\t\"fillOpacity\": true,\n\t\t\"flexGrow\": true,\n\t\t\"flexShrink\": true,\n\t\t\"fontWeight\": true,\n\t\t\"gridArea\": true,\n\t\t\"gridColumn\": true,\n\t\t\"gridColumnEnd\": true,\n\t\t\"gridColumnStart\": true,\n\t\t\"gridRow\": true,\n\t\t\"gridRowEnd\": true,\n\t\t\"gridRowStart\": true,\n\t\t\"lineHeight\": true,\n\t\t\"opacity\": true,\n\t\t\"order\": true,\n\t\t\"orphans\": true,\n\t\t\"widows\": true,\n\t\t\"zIndex\": true,\n\t\t\"zoom\": true\n\t},\n\n\t// Add in properties whose names you wish to fix before\n\t// setting or getting the value\n\tcssProps: {},\n\n\t// Get and set the style property on a DOM Node\n\tstyle: function( elem, name, value, extra ) {\n\n\t\t// Don't set styles on text and comment nodes\n\t\tif ( !elem || elem.nodeType === 3 || elem.nodeType === 8 || !elem.style ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Make sure that we're working with the right name\n\t\tvar ret, type, hooks,\n\t\t\torigName = camelCase( name ),\n\t\t\tisCustomProp = rcustomProp.test( name ),\n\t\t\tstyle = elem.style;\n\n\t\t// Make sure that we're working with the right name. We don't\n\t\t// want to query the value if it is a CSS custom property\n\t\t// since they are user-defined.\n\t\tif ( !isCustomProp ) {\n\t\t\tname = finalPropName( origName );\n\t\t}\n\n\t\t// Gets hook for the prefixed version, then unprefixed version\n\t\thooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ];\n\n\t\t// Check if we're setting a value\n\t\tif ( value !== undefined ) {\n\t\t\ttype = typeof value;\n\n\t\t\t// Convert \"+=\" or \"-=\" to relative numbers (#7345)\n\t\t\tif ( type === \"string\" && ( ret = rcssNum.exec( value ) ) && ret[ 1 ] ) {\n\t\t\t\tvalue = adjustCSS( elem, name, ret );\n\n\t\t\t\t// Fixes bug #9237\n\t\t\t\ttype = \"number\";\n\t\t\t}\n\n\t\t\t// Make sure that null and NaN values aren't set (#7116)\n\t\t\tif ( value == null || value !== value ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// If a number was passed in, add the unit (except for certain CSS properties)\n\t\t\t// The isCustomProp check can be removed in jQuery 4.0 when we only auto-append\n\t\t\t// \"px\" to a few hardcoded values.\n\t\t\tif ( type === \"number\" && !isCustomProp ) {\n\t\t\t\tvalue += ret && ret[ 3 ] || ( jQuery.cssNumber[ origName ] ? \"\" : \"px\" );\n\t\t\t}\n\n\t\t\t// background-* props affect original clone's values\n\t\t\tif ( !support.clearCloneStyle && value === \"\" && name.indexOf( \"background\" ) === 0 ) {\n\t\t\t\tstyle[ name ] = \"inherit\";\n\t\t\t}\n\n\t\t\t// If a hook was provided, use that value, otherwise just set the specified value\n\t\t\tif ( !hooks || !( \"set\" in hooks ) ||\n\t\t\t\t( value = hooks.set( elem, value, extra ) ) !== undefined ) {\n\n\t\t\t\tif ( isCustomProp ) {\n\t\t\t\t\tstyle.setProperty( name, value );\n\t\t\t\t} else {\n\t\t\t\t\tstyle[ name ] = value;\n\t\t\t\t}\n\t\t\t}\n\n\t\t} else {\n\n\t\t\t// If a hook was provided get the non-computed value from there\n\t\t\tif ( hooks && \"get\" in hooks &&\n\t\t\t\t( ret = hooks.get( elem, false, extra ) ) !== undefined ) {\n\n\t\t\t\treturn ret;\n\t\t\t}\n\n\t\t\t// Otherwise just get the value from the style object\n\t\t\treturn style[ name ];\n\t\t}\n\t},\n\n\tcss: function( elem, name, extra, styles ) {\n\t\tvar val, num, hooks,\n\t\t\torigName = camelCase( name ),\n\t\t\tisCustomProp = rcustomProp.test( name );\n\n\t\t// Make sure that we're working with the right name. We don't\n\t\t// want to modify the value if it is a CSS custom property\n\t\t// since they are user-defined.\n\t\tif ( !isCustomProp ) {\n\t\t\tname = finalPropName( origName );\n\t\t}\n\n\t\t// Try prefixed name followed by the unprefixed name\n\t\thooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ];\n\n\t\t// If a hook was provided get the computed value from there\n\t\tif ( hooks && \"get\" in hooks ) {\n\t\t\tval = hooks.get( elem, true, extra );\n\t\t}\n\n\t\t// Otherwise, if a way to get the computed value exists, use that\n\t\tif ( val === undefined ) {\n\t\t\tval = curCSS( elem, name, styles );\n\t\t}\n\n\t\t// Convert \"normal\" to computed value\n\t\tif ( val === \"normal\" && name in cssNormalTransform ) {\n\t\t\tval = cssNormalTransform[ name ];\n\t\t}\n\n\t\t// Make numeric if forced or a qualifier was provided and val looks numeric\n\t\tif ( extra === \"\" || extra ) {\n\t\t\tnum = parseFloat( val );\n\t\t\treturn extra === true || isFinite( num ) ? num || 0 : val;\n\t\t}\n\n\t\treturn val;\n\t}\n} );\n\njQuery.each( [ \"height\", \"width\" ], function( i, dimension ) {\n\tjQuery.cssHooks[ dimension ] = {\n\t\tget: function( elem, computed, extra ) {\n\t\t\tif ( computed ) {\n\n\t\t\t\t// Certain elements can have dimension info if we invisibly show them\n\t\t\t\t// but it must have a current display style that would benefit\n\t\t\t\treturn rdisplayswap.test( jQuery.css( elem, \"display\" ) ) &&\n\n\t\t\t\t\t// Support: Safari 8+\n\t\t\t\t\t// Table columns in Safari have non-zero offsetWidth & zero\n\t\t\t\t\t// getBoundingClientRect().width unless display is changed.\n\t\t\t\t\t// Support: IE <=11 only\n\t\t\t\t\t// Running getBoundingClientRect on a disconnected node\n\t\t\t\t\t// in IE throws an error.\n\t\t\t\t\t( !elem.getClientRects().length || !elem.getBoundingClientRect().width ) ?\n\t\t\t\t\t\tswap( elem, cssShow, function() {\n\t\t\t\t\t\t\treturn getWidthOrHeight( elem, dimension, extra );\n\t\t\t\t\t\t} ) :\n\t\t\t\t\t\tgetWidthOrHeight( elem, dimension, extra );\n\t\t\t}\n\t\t},\n\n\t\tset: function( elem, value, extra ) {\n\t\t\tvar matches,\n\t\t\t\tstyles = getStyles( elem ),\n\n\t\t\t\t// Only read styles.position if the test has a chance to fail\n\t\t\t\t// to avoid forcing a reflow.\n\t\t\t\tscrollboxSizeBuggy = !support.scrollboxSize() &&\n\t\t\t\t\tstyles.position === \"absolute\",\n\n\t\t\t\t// To avoid forcing a reflow, only fetch boxSizing if we need it (gh-3991)\n\t\t\t\tboxSizingNeeded = scrollboxSizeBuggy || extra,\n\t\t\t\tisBorderBox = boxSizingNeeded &&\n\t\t\t\t\tjQuery.css( elem, \"boxSizing\", false, styles ) === \"border-box\",\n\t\t\t\tsubtract = extra ?\n\t\t\t\t\tboxModelAdjustment(\n\t\t\t\t\t\telem,\n\t\t\t\t\t\tdimension,\n\t\t\t\t\t\textra,\n\t\t\t\t\t\tisBorderBox,\n\t\t\t\t\t\tstyles\n\t\t\t\t\t) :\n\t\t\t\t\t0;\n\n\t\t\t// Account for unreliable border-box dimensions by comparing offset* to computed and\n\t\t\t// faking a content-box to get border and padding (gh-3699)\n\t\t\tif ( isBorderBox && scrollboxSizeBuggy ) {\n\t\t\t\tsubtract -= Math.ceil(\n\t\t\t\t\telem[ \"offset\" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] -\n\t\t\t\t\tparseFloat( styles[ dimension ] ) -\n\t\t\t\t\tboxModelAdjustment( elem, dimension, \"border\", false, styles ) -\n\t\t\t\t\t0.5\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t// Convert to pixels if value adjustment is needed\n\t\t\tif ( subtract && ( matches = rcssNum.exec( value ) ) &&\n\t\t\t\t( matches[ 3 ] || \"px\" ) !== \"px\" ) {\n\n\t\t\t\telem.style[ dimension ] = value;\n\t\t\t\tvalue = jQuery.css( elem, dimension );\n\t\t\t}\n\n\t\t\treturn setPositiveNumber( elem, value, subtract );\n\t\t}\n\t};\n} );\n\njQuery.cssHooks.marginLeft = addGetHookIf( support.reliableMarginLeft,\n\tfunction( elem, computed ) {\n\t\tif ( computed ) {\n\t\t\treturn ( parseFloat( curCSS( elem, \"marginLeft\" ) ) ||\n\t\t\t\telem.getBoundingClientRect().left -\n\t\t\t\t\tswap( elem, { marginLeft: 0 }, function() {\n\t\t\t\t\t\treturn elem.getBoundingClientRect().left;\n\t\t\t\t\t} )\n\t\t\t\t) + \"px\";\n\t\t}\n\t}\n);\n\n// These hooks are used by animate to expand properties\njQuery.each( {\n\tmargin: \"\",\n\tpadding: \"\",\n\tborder: \"Width\"\n}, function( prefix, suffix ) {\n\tjQuery.cssHooks[ prefix + suffix ] = {\n\t\texpand: function( value ) {\n\t\t\tvar i = 0,\n\t\t\t\texpanded = {},\n\n\t\t\t\t// Assumes a single number if not a string\n\t\t\t\tparts = typeof value === \"string\" ? value.split( \" \" ) : [ value ];\n\n\t\t\tfor ( ; i < 4; i++ ) {\n\t\t\t\texpanded[ prefix + cssExpand[ i ] + suffix ] =\n\t\t\t\t\tparts[ i ] || parts[ i - 2 ] || parts[ 0 ];\n\t\t\t}\n\n\t\t\treturn expanded;\n\t\t}\n\t};\n\n\tif ( prefix !== \"margin\" ) {\n\t\tjQuery.cssHooks[ prefix + suffix ].set = setPositiveNumber;\n\t}\n} );\n\njQuery.fn.extend( {\n\tcss: function( name, value ) {\n\t\treturn access( this, function( elem, name, value ) {\n\t\t\tvar styles, len,\n\t\t\t\tmap = {},\n\t\t\t\ti = 0;\n\n\t\t\tif ( Array.isArray( name ) ) {\n\t\t\t\tstyles = getStyles( elem );\n\t\t\t\tlen = name.length;\n\n\t\t\t\tfor ( ; i < len; i++ ) {\n\t\t\t\t\tmap[ name[ i ] ] = jQuery.css( elem, name[ i ], false, styles );\n\t\t\t\t}\n\n\t\t\t\treturn map;\n\t\t\t}\n\n\t\t\treturn value !== undefined ?\n\t\t\t\tjQuery.style( elem, name, value ) :\n\t\t\t\tjQuery.css( elem, name );\n\t\t}, name, value, arguments.length > 1 );\n\t}\n} );\n\n\nfunction Tween( elem, options, prop, end, easing ) {\n\treturn new Tween.prototype.init( elem, options, prop, end, easing );\n}\njQuery.Tween = Tween;\n\nTween.prototype = {\n\tconstructor: Tween,\n\tinit: function( elem, options, prop, end, easing, unit ) {\n\t\tthis.elem = elem;\n\t\tthis.prop = prop;\n\t\tthis.easing = easing || jQuery.easing._default;\n\t\tthis.options = options;\n\t\tthis.start = this.now = this.cur();\n\t\tthis.end = end;\n\t\tthis.unit = unit || ( jQuery.cssNumber[ prop ] ? \"\" : \"px\" );\n\t},\n\tcur: function() {\n\t\tvar hooks = Tween.propHooks[ this.prop ];\n\n\t\treturn hooks && hooks.get ?\n\t\t\thooks.get( this ) :\n\t\t\tTween.propHooks._default.get( this );\n\t},\n\trun: function( percent ) {\n\t\tvar eased,\n\t\t\thooks = Tween.propHooks[ this.prop ];\n\n\t\tif ( this.options.duration ) {\n\t\t\tthis.pos = eased = jQuery.easing[ this.easing ](\n\t\t\t\tpercent, this.options.duration * percent, 0, 1, this.options.duration\n\t\t\t);\n\t\t} else {\n\t\t\tthis.pos = eased = percent;\n\t\t}\n\t\tthis.now = ( this.end - this.start ) * eased + this.start;\n\n\t\tif ( this.options.step ) {\n\t\t\tthis.options.step.call( this.elem, this.now, this );\n\t\t}\n\n\t\tif ( hooks && hooks.set ) {\n\t\t\thooks.set( this );\n\t\t} else {\n\t\t\tTween.propHooks._default.set( this );\n\t\t}\n\t\treturn this;\n\t}\n};\n\nTween.prototype.init.prototype = Tween.prototype;\n\nTween.propHooks = {\n\t_default: {\n\t\tget: function( tween ) {\n\t\t\tvar result;\n\n\t\t\t// Use a property on the element directly when it is not a DOM element,\n\t\t\t// or when there is no matching style property that exists.\n\t\t\tif ( tween.elem.nodeType !== 1 ||\n\t\t\t\ttween.elem[ tween.prop ] != null && tween.elem.style[ tween.prop ] == null ) {\n\t\t\t\treturn tween.elem[ tween.prop ];\n\t\t\t}\n\n\t\t\t// Passing an empty string as a 3rd parameter to .css will automatically\n\t\t\t// attempt a parseFloat and fallback to a string if the parse fails.\n\t\t\t// Simple values such as \"10px\" are parsed to Float;\n\t\t\t// complex values such as \"rotate(1rad)\" are returned as-is.\n\t\t\tresult = jQuery.css( tween.elem, tween.prop, \"\" );\n\n\t\t\t// Empty strings, null, undefined and \"auto\" are converted to 0.\n\t\t\treturn !result || result === \"auto\" ? 0 : result;\n\t\t},\n\t\tset: function( tween ) {\n\n\t\t\t// Use step hook for back compat.\n\t\t\t// Use cssHook if its there.\n\t\t\t// Use .style if available and use plain properties where available.\n\t\t\tif ( jQuery.fx.step[ tween.prop ] ) {\n\t\t\t\tjQuery.fx.step[ tween.prop ]( tween );\n\t\t\t} else if ( tween.elem.nodeType === 1 && (\n\t\t\t\t\tjQuery.cssHooks[ tween.prop ] ||\n\t\t\t\t\ttween.elem.style[ finalPropName( tween.prop ) ] != null ) ) {\n\t\t\t\tjQuery.style( tween.elem, tween.prop, tween.now + tween.unit );\n\t\t\t} else {\n\t\t\t\ttween.elem[ tween.prop ] = tween.now;\n\t\t\t}\n\t\t}\n\t}\n};\n\n// Support: IE <=9 only\n// Panic based approach to setting things on disconnected nodes\nTween.propHooks.scrollTop = Tween.propHooks.scrollLeft = {\n\tset: function( tween ) {\n\t\tif ( tween.elem.nodeType && tween.elem.parentNode ) {\n\t\t\ttween.elem[ tween.prop ] = tween.now;\n\t\t}\n\t}\n};\n\njQuery.easing = {\n\tlinear: function( p ) {\n\t\treturn p;\n\t},\n\tswing: function( p ) {\n\t\treturn 0.5 - Math.cos( p * Math.PI ) / 2;\n\t},\n\t_default: \"swing\"\n};\n\njQuery.fx = Tween.prototype.init;\n\n// Back compat <1.8 extension point\njQuery.fx.step = {};\n\n\n\n\nvar\n\tfxNow, inProgress,\n\trfxtypes = /^(?:toggle|show|hide)$/,\n\trrun = /queueHooks$/;\n\nfunction schedule() {\n\tif ( inProgress ) {\n\t\tif ( document.hidden === false && window.requestAnimationFrame ) {\n\t\t\twindow.requestAnimationFrame( schedule );\n\t\t} else {\n\t\t\twindow.setTimeout( schedule, jQuery.fx.interval );\n\t\t}\n\n\t\tjQuery.fx.tick();\n\t}\n}\n\n// Animations created synchronously will run synchronously\nfunction createFxNow() {\n\twindow.setTimeout( function() {\n\t\tfxNow = undefined;\n\t} );\n\treturn ( fxNow = Date.now() );\n}\n\n// Generate parameters to create a standard animation\nfunction genFx( type, includeWidth ) {\n\tvar which,\n\t\ti = 0,\n\t\tattrs = { height: type };\n\n\t// If we include width, step value is 1 to do all cssExpand values,\n\t// otherwise step value is 2 to skip over Left and Right\n\tincludeWidth = includeWidth ? 1 : 0;\n\tfor ( ; i < 4; i += 2 - includeWidth ) {\n\t\twhich = cssExpand[ i ];\n\t\tattrs[ \"margin\" + which ] = attrs[ \"padding\" + which ] = type;\n\t}\n\n\tif ( includeWidth ) {\n\t\tattrs.opacity = attrs.width = type;\n\t}\n\n\treturn attrs;\n}\n\nfunction createTween( value, prop, animation ) {\n\tvar tween,\n\t\tcollection = ( Animation.tweeners[ prop ] || [] ).concat( Animation.tweeners[ \"*\" ] ),\n\t\tindex = 0,\n\t\tlength = collection.length;\n\tfor ( ; index < length; index++ ) {\n\t\tif ( ( tween = collection[ index ].call( animation, prop, value ) ) ) {\n\n\t\t\t// We're done with this property\n\t\t\treturn tween;\n\t\t}\n\t}\n}\n\nfunction defaultPrefilter( elem, props, opts ) {\n\tvar prop, value, toggle, hooks, oldfire, propTween, restoreDisplay, display,\n\t\tisBox = \"width\" in props || \"height\" in props,\n\t\tanim = this,\n\t\torig = {},\n\t\tstyle = elem.style,\n\t\thidden = elem.nodeType && isHiddenWithinTree( elem ),\n\t\tdataShow = dataPriv.get( elem, \"fxshow\" );\n\n\t// Queue-skipping animations hijack the fx hooks\n\tif ( !opts.queue ) {\n\t\thooks = jQuery._queueHooks( elem, \"fx\" );\n\t\tif ( hooks.unqueued == null ) {\n\t\t\thooks.unqueued = 0;\n\t\t\toldfire = hooks.empty.fire;\n\t\t\thooks.empty.fire = function() {\n\t\t\t\tif ( !hooks.unqueued ) {\n\t\t\t\t\toldfire();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t\thooks.unqueued++;\n\n\t\tanim.always( function() {\n\n\t\t\t// Ensure the complete handler is called before this completes\n\t\t\tanim.always( function() {\n\t\t\t\thooks.unqueued--;\n\t\t\t\tif ( !jQuery.queue( elem, \"fx\" ).length ) {\n\t\t\t\t\thooks.empty.fire();\n\t\t\t\t}\n\t\t\t} );\n\t\t} );\n\t}\n\n\t// Detect show/hide animations\n\tfor ( prop in props ) {\n\t\tvalue = props[ prop ];\n\t\tif ( rfxtypes.test( value ) ) {\n\t\t\tdelete props[ prop ];\n\t\t\ttoggle = toggle || value === \"toggle\";\n\t\t\tif ( value === ( hidden ? \"hide\" : \"show\" ) ) {\n\n\t\t\t\t// Pretend to be hidden if this is a \"show\" and\n\t\t\t\t// there is still data from a stopped show/hide\n\t\t\t\tif ( value === \"show\" && dataShow && dataShow[ prop ] !== undefined ) {\n\t\t\t\t\thidden = true;\n\n\t\t\t\t// Ignore all other no-op show/hide data\n\t\t\t\t} else {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t}\n\t\t\torig[ prop ] = dataShow && dataShow[ prop ] || jQuery.style( elem, prop );\n\t\t}\n\t}\n\n\t// Bail out if this is a no-op like .hide().hide()\n\tpropTween = !jQuery.isEmptyObject( props );\n\tif ( !propTween && jQuery.isEmptyObject( orig ) ) {\n\t\treturn;\n\t}\n\n\t// Restrict \"overflow\" and \"display\" styles during box animations\n\tif ( isBox && elem.nodeType === 1 ) {\n\n\t\t// Support: IE <=9 - 11, Edge 12 - 15\n\t\t// Record all 3 overflow attributes because IE does not infer the shorthand\n\t\t// from identically-valued overflowX and overflowY and Edge just mirrors\n\t\t// the overflowX value there.\n\t\topts.overflow = [ style.overflow, style.overflowX, style.overflowY ];\n\n\t\t// Identify a display type, preferring old show/hide data over the CSS cascade\n\t\trestoreDisplay = dataShow && dataShow.display;\n\t\tif ( restoreDisplay == null ) {\n\t\t\trestoreDisplay = dataPriv.get( elem, \"display\" );\n\t\t}\n\t\tdisplay = jQuery.css( elem, \"display\" );\n\t\tif ( display === \"none\" ) {\n\t\t\tif ( restoreDisplay ) {\n\t\t\t\tdisplay = restoreDisplay;\n\t\t\t} else {\n\n\t\t\t\t// Get nonempty value(s) by temporarily forcing visibility\n\t\t\t\tshowHide( [ elem ], true );\n\t\t\t\trestoreDisplay = elem.style.display || restoreDisplay;\n\t\t\t\tdisplay = jQuery.css( elem, \"display\" );\n\t\t\t\tshowHide( [ elem ] );\n\t\t\t}\n\t\t}\n\n\t\t// Animate inline elements as inline-block\n\t\tif ( display === \"inline\" || display === \"inline-block\" && restoreDisplay != null ) {\n\t\t\tif ( jQuery.css( elem, \"float\" ) === \"none\" ) {\n\n\t\t\t\t// Restore the original display value at the end of pure show/hide animations\n\t\t\t\tif ( !propTween ) {\n\t\t\t\t\tanim.done( function() {\n\t\t\t\t\t\tstyle.display = restoreDisplay;\n\t\t\t\t\t} );\n\t\t\t\t\tif ( restoreDisplay == null ) {\n\t\t\t\t\t\tdisplay = style.display;\n\t\t\t\t\t\trestoreDisplay = display === \"none\" ? \"\" : display;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tstyle.display = \"inline-block\";\n\t\t\t}\n\t\t}\n\t}\n\n\tif ( opts.overflow ) {\n\t\tstyle.overflow = \"hidden\";\n\t\tanim.always( function() {\n\t\t\tstyle.overflow = opts.overflow[ 0 ];\n\t\t\tstyle.overflowX = opts.overflow[ 1 ];\n\t\t\tstyle.overflowY = opts.overflow[ 2 ];\n\t\t} );\n\t}\n\n\t// Implement show/hide animations\n\tpropTween = false;\n\tfor ( prop in orig ) {\n\n\t\t// General show/hide setup for this element animation\n\t\tif ( !propTween ) {\n\t\t\tif ( dataShow ) {\n\t\t\t\tif ( \"hidden\" in dataShow ) {\n\t\t\t\t\thidden = dataShow.hidden;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tdataShow = dataPriv.access( elem, \"fxshow\", { display: restoreDisplay } );\n\t\t\t}\n\n\t\t\t// Store hidden/visible for toggle so `.stop().toggle()` \"reverses\"\n\t\t\tif ( toggle ) {\n\t\t\t\tdataShow.hidden = !hidden;\n\t\t\t}\n\n\t\t\t// Show elements before animating them\n\t\t\tif ( hidden ) {\n\t\t\t\tshowHide( [ elem ], true );\n\t\t\t}\n\n\t\t\t/* eslint-disable no-loop-func */\n\n\t\t\tanim.done( function() {\n\n\t\t\t/* eslint-enable no-loop-func */\n\n\t\t\t\t// The final step of a \"hide\" animation is actually hiding the element\n\t\t\t\tif ( !hidden ) {\n\t\t\t\t\tshowHide( [ elem ] );\n\t\t\t\t}\n\t\t\t\tdataPriv.remove( elem, \"fxshow\" );\n\t\t\t\tfor ( prop in orig ) {\n\t\t\t\t\tjQuery.style( elem, prop, orig[ prop ] );\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\n\t\t// Per-property setup\n\t\tpropTween = createTween( hidden ? dataShow[ prop ] : 0, prop, anim );\n\t\tif ( !( prop in dataShow ) ) {\n\t\t\tdataShow[ prop ] = propTween.start;\n\t\t\tif ( hidden ) {\n\t\t\t\tpropTween.end = propTween.start;\n\t\t\t\tpropTween.start = 0;\n\t\t\t}\n\t\t}\n\t}\n}\n\nfunction propFilter( props, specialEasing ) {\n\tvar index, name, easing, value, hooks;\n\n\t// camelCase, specialEasing and expand cssHook pass\n\tfor ( index in props ) {\n\t\tname = camelCase( index );\n\t\teasing = specialEasing[ name ];\n\t\tvalue = props[ index ];\n\t\tif ( Array.isArray( value ) ) {\n\t\t\teasing = value[ 1 ];\n\t\t\tvalue = props[ index ] = value[ 0 ];\n\t\t}\n\n\t\tif ( index !== name ) {\n\t\t\tprops[ name ] = value;\n\t\t\tdelete props[ index ];\n\t\t}\n\n\t\thooks = jQuery.cssHooks[ name ];\n\t\tif ( hooks && \"expand\" in hooks ) {\n\t\t\tvalue = hooks.expand( value );\n\t\t\tdelete props[ name ];\n\n\t\t\t// Not quite $.extend, this won't overwrite existing keys.\n\t\t\t// Reusing 'index' because we have the correct \"name\"\n\t\t\tfor ( index in value ) {\n\t\t\t\tif ( !( index in props ) ) {\n\t\t\t\t\tprops[ index ] = value[ index ];\n\t\t\t\t\tspecialEasing[ index ] = easing;\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tspecialEasing[ name ] = easing;\n\t\t}\n\t}\n}\n\nfunction Animation( elem, properties, options ) {\n\tvar result,\n\t\tstopped,\n\t\tindex = 0,\n\t\tlength = Animation.prefilters.length,\n\t\tdeferred = jQuery.Deferred().always( function() {\n\n\t\t\t// Don't match elem in the :animated selector\n\t\t\tdelete tick.elem;\n\t\t} ),\n\t\ttick = function() {\n\t\t\tif ( stopped ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tvar currentTime = fxNow || createFxNow(),\n\t\t\t\tremaining = Math.max( 0, animation.startTime + animation.duration - currentTime ),\n\n\t\t\t\t// Support: Android 2.3 only\n\t\t\t\t// Archaic crash bug won't allow us to use `1 - ( 0.5 || 0 )` (#12497)\n\t\t\t\ttemp = remaining / animation.duration || 0,\n\t\t\t\tpercent = 1 - temp,\n\t\t\t\tindex = 0,\n\t\t\t\tlength = animation.tweens.length;\n\n\t\t\tfor ( ; index < length; index++ ) {\n\t\t\t\tanimation.tweens[ index ].run( percent );\n\t\t\t}\n\n\t\t\tdeferred.notifyWith( elem, [ animation, percent, remaining ] );\n\n\t\t\t// If there's more to do, yield\n\t\t\tif ( percent < 1 && length ) {\n\t\t\t\treturn remaining;\n\t\t\t}\n\n\t\t\t// If this was an empty animation, synthesize a final progress notification\n\t\t\tif ( !length ) {\n\t\t\t\tdeferred.notifyWith( elem, [ animation, 1, 0 ] );\n\t\t\t}\n\n\t\t\t// Resolve the animation and report its conclusion\n\t\t\tdeferred.resolveWith( elem, [ animation ] );\n\t\t\treturn false;\n\t\t},\n\t\tanimation = deferred.promise( {\n\t\t\telem: elem,\n\t\t\tprops: jQuery.extend( {}, properties ),\n\t\t\topts: jQuery.extend( true, {\n\t\t\t\tspecialEasing: {},\n\t\t\t\teasing: jQuery.easing._default\n\t\t\t}, options ),\n\t\t\toriginalProperties: properties,\n\t\t\toriginalOptions: options,\n\t\t\tstartTime: fxNow || createFxNow(),\n\t\t\tduration: options.duration,\n\t\t\ttweens: [],\n\t\t\tcreateTween: function( prop, end ) {\n\t\t\t\tvar tween = jQuery.Tween( elem, animation.opts, prop, end,\n\t\t\t\t\t\tanimation.opts.specialEasing[ prop ] || animation.opts.easing );\n\t\t\t\tanimation.tweens.push( tween );\n\t\t\t\treturn tween;\n\t\t\t},\n\t\t\tstop: function( gotoEnd ) {\n\t\t\t\tvar index = 0,\n\n\t\t\t\t\t// If we are going to the end, we want to run all the tweens\n\t\t\t\t\t// otherwise we skip this part\n\t\t\t\t\tlength = gotoEnd ? animation.tweens.length : 0;\n\t\t\t\tif ( stopped ) {\n\t\t\t\t\treturn this;\n\t\t\t\t}\n\t\t\t\tstopped = true;\n\t\t\t\tfor ( ; index < length; index++ ) {\n\t\t\t\t\tanimation.tweens[ index ].run( 1 );\n\t\t\t\t}\n\n\t\t\t\t// Resolve when we played the last frame; otherwise, reject\n\t\t\t\tif ( gotoEnd ) {\n\t\t\t\t\tdeferred.notifyWith( elem, [ animation, 1, 0 ] );\n\t\t\t\t\tdeferred.resolveWith( elem, [ animation, gotoEnd ] );\n\t\t\t\t} else {\n\t\t\t\t\tdeferred.rejectWith( elem, [ animation, gotoEnd ] );\n\t\t\t\t}\n\t\t\t\treturn this;\n\t\t\t}\n\t\t} ),\n\t\tprops = animation.props;\n\n\tpropFilter( props, animation.opts.specialEasing );\n\n\tfor ( ; index < length; index++ ) {\n\t\tresult = Animation.prefilters[ index ].call( animation, elem, props, animation.opts );\n\t\tif ( result ) {\n\t\t\tif ( isFunction( result.stop ) ) {\n\t\t\t\tjQuery._queueHooks( animation.elem, animation.opts.queue ).stop =\n\t\t\t\t\tresult.stop.bind( result );\n\t\t\t}\n\t\t\treturn result;\n\t\t}\n\t}\n\n\tjQuery.map( props, createTween, animation );\n\n\tif ( isFunction( animation.opts.start ) ) {\n\t\tanimation.opts.start.call( elem, animation );\n\t}\n\n\t// Attach callbacks from options\n\tanimation\n\t\t.progress( animation.opts.progress )\n\t\t.done( animation.opts.done, animation.opts.complete )\n\t\t.fail( animation.opts.fail )\n\t\t.always( animation.opts.always );\n\n\tjQuery.fx.timer(\n\t\tjQuery.extend( tick, {\n\t\t\telem: elem,\n\t\t\tanim: animation,\n\t\t\tqueue: animation.opts.queue\n\t\t} )\n\t);\n\n\treturn animation;\n}\n\njQuery.Animation = jQuery.extend( Animation, {\n\n\ttweeners: {\n\t\t\"*\": [ function( prop, value ) {\n\t\t\tvar tween = this.createTween( prop, value );\n\t\t\tadjustCSS( tween.elem, prop, rcssNum.exec( value ), tween );\n\t\t\treturn tween;\n\t\t} ]\n\t},\n\n\ttweener: function( props, callback ) {\n\t\tif ( isFunction( props ) ) {\n\t\t\tcallback = props;\n\t\t\tprops = [ \"*\" ];\n\t\t} else {\n\t\t\tprops = props.match( rnothtmlwhite );\n\t\t}\n\n\t\tvar prop,\n\t\t\tindex = 0,\n\t\t\tlength = props.length;\n\n\t\tfor ( ; index < length; index++ ) {\n\t\t\tprop = props[ index ];\n\t\t\tAnimation.tweeners[ prop ] = Animation.tweeners[ prop ] || [];\n\t\t\tAnimation.tweeners[ prop ].unshift( callback );\n\t\t}\n\t},\n\n\tprefilters: [ defaultPrefilter ],\n\n\tprefilter: function( callback, prepend ) {\n\t\tif ( prepend ) {\n\t\t\tAnimation.prefilters.unshift( callback );\n\t\t} else {\n\t\t\tAnimation.prefilters.push( callback );\n\t\t}\n\t}\n} );\n\njQuery.speed = function( speed, easing, fn ) {\n\tvar opt = speed && typeof speed === \"object\" ? jQuery.extend( {}, speed ) : {\n\t\tcomplete: fn || !fn && easing ||\n\t\t\tisFunction( speed ) && speed,\n\t\tduration: speed,\n\t\teasing: fn && easing || easing && !isFunction( easing ) && easing\n\t};\n\n\t// Go to the end state if fx are off\n\tif ( jQuery.fx.off ) {\n\t\topt.duration = 0;\n\n\t} else {\n\t\tif ( typeof opt.duration !== \"number\" ) {\n\t\t\tif ( opt.duration in jQuery.fx.speeds ) {\n\t\t\t\topt.duration = jQuery.fx.speeds[ opt.duration ];\n\n\t\t\t} else {\n\t\t\t\topt.duration = jQuery.fx.speeds._default;\n\t\t\t}\n\t\t}\n\t}\n\n\t// Normalize opt.queue - true/undefined/null -> \"fx\"\n\tif ( opt.queue == null || opt.queue === true ) {\n\t\topt.queue = \"fx\";\n\t}\n\n\t// Queueing\n\topt.old = opt.complete;\n\n\topt.complete = function() {\n\t\tif ( isFunction( opt.old ) ) {\n\t\t\topt.old.call( this );\n\t\t}\n\n\t\tif ( opt.queue ) {\n\t\t\tjQuery.dequeue( this, opt.queue );\n\t\t}\n\t};\n\n\treturn opt;\n};\n\njQuery.fn.extend( {\n\tfadeTo: function( speed, to, easing, callback ) {\n\n\t\t// Show any hidden elements after setting opacity to 0\n\t\treturn this.filter( isHiddenWithinTree ).css( \"opacity\", 0 ).show()\n\n\t\t\t// Animate to the value specified\n\t\t\t.end().animate( { opacity: to }, speed, easing, callback );\n\t},\n\tanimate: function( prop, speed, easing, callback ) {\n\t\tvar empty = jQuery.isEmptyObject( prop ),\n\t\t\toptall = jQuery.speed( speed, easing, callback ),\n\t\t\tdoAnimation = function() {\n\n\t\t\t\t// Operate on a copy of prop so per-property easing won't be lost\n\t\t\t\tvar anim = Animation( this, jQuery.extend( {}, prop ), optall );\n\n\t\t\t\t// Empty animations, or finishing resolves immediately\n\t\t\t\tif ( empty || dataPriv.get( this, \"finish\" ) ) {\n\t\t\t\t\tanim.stop( true );\n\t\t\t\t}\n\t\t\t};\n\t\t\tdoAnimation.finish = doAnimation;\n\n\t\treturn empty || optall.queue === false ?\n\t\t\tthis.each( doAnimation ) :\n\t\t\tthis.queue( optall.queue, doAnimation );\n\t},\n\tstop: function( type, clearQueue, gotoEnd ) {\n\t\tvar stopQueue = function( hooks ) {\n\t\t\tvar stop = hooks.stop;\n\t\t\tdelete hooks.stop;\n\t\t\tstop( gotoEnd );\n\t\t};\n\n\t\tif ( typeof type !== \"string\" ) {\n\t\t\tgotoEnd = clearQueue;\n\t\t\tclearQueue = type;\n\t\t\ttype = undefined;\n\t\t}\n\t\tif ( clearQueue && type !== false ) {\n\t\t\tthis.queue( type || \"fx\", [] );\n\t\t}\n\n\t\treturn this.each( function() {\n\t\t\tvar dequeue = true,\n\t\t\t\tindex = type != null && type + \"queueHooks\",\n\t\t\t\ttimers = jQuery.timers,\n\t\t\t\tdata = dataPriv.get( this );\n\n\t\t\tif ( index ) {\n\t\t\t\tif ( data[ index ] && data[ index ].stop ) {\n\t\t\t\t\tstopQueue( data[ index ] );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tfor ( index in data ) {\n\t\t\t\t\tif ( data[ index ] && data[ index ].stop && rrun.test( index ) ) {\n\t\t\t\t\t\tstopQueue( data[ index ] );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfor ( index = timers.length; index--; ) {\n\t\t\t\tif ( timers[ index ].elem === this &&\n\t\t\t\t\t( type == null || timers[ index ].queue === type ) ) {\n\n\t\t\t\t\ttimers[ index ].anim.stop( gotoEnd );\n\t\t\t\t\tdequeue = false;\n\t\t\t\t\ttimers.splice( index, 1 );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Start the next in the queue if the last step wasn't forced.\n\t\t\t// Timers currently will call their complete callbacks, which\n\t\t\t// will dequeue but only if they were gotoEnd.\n\t\t\tif ( dequeue || !gotoEnd ) {\n\t\t\t\tjQuery.dequeue( this, type );\n\t\t\t}\n\t\t} );\n\t},\n\tfinish: function( type ) {\n\t\tif ( type !== false ) {\n\t\t\ttype = type || \"fx\";\n\t\t}\n\t\treturn this.each( function() {\n\t\t\tvar index,\n\t\t\t\tdata = dataPriv.get( this ),\n\t\t\t\tqueue = data[ type + \"queue\" ],\n\t\t\t\thooks = data[ type + \"queueHooks\" ],\n\t\t\t\ttimers = jQuery.timers,\n\t\t\t\tlength = queue ? queue.length : 0;\n\n\t\t\t// Enable finishing flag on private data\n\t\t\tdata.finish = true;\n\n\t\t\t// Empty the queue first\n\t\t\tjQuery.queue( this, type, [] );\n\n\t\t\tif ( hooks && hooks.stop ) {\n\t\t\t\thooks.stop.call( this, true );\n\t\t\t}\n\n\t\t\t// Look for any active animations, and finish them\n\t\t\tfor ( index = timers.length; index--; ) {\n\t\t\t\tif ( timers[ index ].elem === this && timers[ index ].queue === type ) {\n\t\t\t\t\ttimers[ index ].anim.stop( true );\n\t\t\t\t\ttimers.splice( index, 1 );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Look for any animations in the old queue and finish them\n\t\t\tfor ( index = 0; index < length; index++ ) {\n\t\t\t\tif ( queue[ index ] && queue[ index ].finish ) {\n\t\t\t\t\tqueue[ index ].finish.call( this );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Turn off finishing flag\n\t\t\tdelete data.finish;\n\t\t} );\n\t}\n} );\n\njQuery.each( [ \"toggle\", \"show\", \"hide\" ], function( i, name ) {\n\tvar cssFn = jQuery.fn[ name ];\n\tjQuery.fn[ name ] = function( speed, easing, callback ) {\n\t\treturn speed == null || typeof speed === \"boolean\" ?\n\t\t\tcssFn.apply( this, arguments ) :\n\t\t\tthis.animate( genFx( name, true ), speed, easing, callback );\n\t};\n} );\n\n// Generate shortcuts for custom animations\njQuery.each( {\n\tslideDown: genFx( \"show\" ),\n\tslideUp: genFx( \"hide\" ),\n\tslideToggle: genFx( \"toggle\" ),\n\tfadeIn: { opacity: \"show\" },\n\tfadeOut: { opacity: \"hide\" },\n\tfadeToggle: { opacity: \"toggle\" }\n}, function( name, props ) {\n\tjQuery.fn[ name ] = function( speed, easing, callback ) {\n\t\treturn this.animate( props, speed, easing, callback );\n\t};\n} );\n\njQuery.timers = [];\njQuery.fx.tick = function() {\n\tvar timer,\n\t\ti = 0,\n\t\ttimers = jQuery.timers;\n\n\tfxNow = Date.now();\n\n\tfor ( ; i < timers.length; i++ ) {\n\t\ttimer = timers[ i ];\n\n\t\t// Run the timer and safely remove it when done (allowing for external removal)\n\t\tif ( !timer() && timers[ i ] === timer ) {\n\t\t\ttimers.splice( i--, 1 );\n\t\t}\n\t}\n\n\tif ( !timers.length ) {\n\t\tjQuery.fx.stop();\n\t}\n\tfxNow = undefined;\n};\n\njQuery.fx.timer = function( timer ) {\n\tjQuery.timers.push( timer );\n\tjQuery.fx.start();\n};\n\njQuery.fx.interval = 13;\njQuery.fx.start = function() {\n\tif ( inProgress ) {\n\t\treturn;\n\t}\n\n\tinProgress = true;\n\tschedule();\n};\n\njQuery.fx.stop = function() {\n\tinProgress = null;\n};\n\njQuery.fx.speeds = {\n\tslow: 600,\n\tfast: 200,\n\n\t// Default speed\n\t_default: 400\n};\n\n\n// Based off of the plugin by Clint Helfers, with permission.\n// https://web.archive.org/web/20100324014747/http://blindsignals.com/index.php/2009/07/jquery-delay/\njQuery.fn.delay = function( time, type ) {\n\ttime = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time;\n\ttype = type || \"fx\";\n\n\treturn this.queue( type, function( next, hooks ) {\n\t\tvar timeout = window.setTimeout( next, time );\n\t\thooks.stop = function() {\n\t\t\twindow.clearTimeout( timeout );\n\t\t};\n\t} );\n};\n\n\n( function() {\n\tvar input = document.createElement( \"input\" ),\n\t\tselect = document.createElement( \"select\" ),\n\t\topt = select.appendChild( document.createElement( \"option\" ) );\n\n\tinput.type = \"checkbox\";\n\n\t// Support: Android <=4.3 only\n\t// Default value for a checkbox should be \"on\"\n\tsupport.checkOn = input.value !== \"\";\n\n\t// Support: IE <=11 only\n\t// Must access selectedIndex to make default options select\n\tsupport.optSelected = opt.selected;\n\n\t// Support: IE <=11 only\n\t// An input loses its value after becoming a radio\n\tinput = document.createElement( \"input\" );\n\tinput.value = \"t\";\n\tinput.type = \"radio\";\n\tsupport.radioValue = input.value === \"t\";\n} )();\n\n\nvar boolHook,\n\tattrHandle = jQuery.expr.attrHandle;\n\njQuery.fn.extend( {\n\tattr: function( name, value ) {\n\t\treturn access( this, jQuery.attr, name, value, arguments.length > 1 );\n\t},\n\n\tremoveAttr: function( name ) {\n\t\treturn this.each( function() {\n\t\t\tjQuery.removeAttr( this, name );\n\t\t} );\n\t}\n} );\n\njQuery.extend( {\n\tattr: function( elem, name, value ) {\n\t\tvar ret, hooks,\n\t\t\tnType = elem.nodeType;\n\n\t\t// Don't get/set attributes on text, comment and attribute nodes\n\t\tif ( nType === 3 || nType === 8 || nType === 2 ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Fallback to prop when attributes are not supported\n\t\tif ( typeof elem.getAttribute === \"undefined\" ) {\n\t\t\treturn jQuery.prop( elem, name, value );\n\t\t}\n\n\t\t// Attribute hooks are determined by the lowercase version\n\t\t// Grab necessary hook if one is defined\n\t\tif ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) {\n\t\t\thooks = jQuery.attrHooks[ name.toLowerCase() ] ||\n\t\t\t\t( jQuery.expr.match.bool.test( name ) ? boolHook : undefined );\n\t\t}\n\n\t\tif ( value !== undefined ) {\n\t\t\tif ( value === null ) {\n\t\t\t\tjQuery.removeAttr( elem, name );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( hooks && \"set\" in hooks &&\n\t\t\t\t( ret = hooks.set( elem, value, name ) ) !== undefined ) {\n\t\t\t\treturn ret;\n\t\t\t}\n\n\t\t\telem.setAttribute( name, value + \"\" );\n\t\t\treturn value;\n\t\t}\n\n\t\tif ( hooks && \"get\" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) {\n\t\t\treturn ret;\n\t\t}\n\n\t\tret = jQuery.find.attr( elem, name );\n\n\t\t// Non-existent attributes return null, we normalize to undefined\n\t\treturn ret == null ? undefined : ret;\n\t},\n\n\tattrHooks: {\n\t\ttype: {\n\t\t\tset: function( elem, value ) {\n\t\t\t\tif ( !support.radioValue && value === \"radio\" &&\n\t\t\t\t\tnodeName( elem, \"input\" ) ) {\n\t\t\t\t\tvar val = elem.value;\n\t\t\t\t\telem.setAttribute( \"type\", value );\n\t\t\t\t\tif ( val ) {\n\t\t\t\t\t\telem.value = val;\n\t\t\t\t\t}\n\t\t\t\t\treturn value;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t},\n\n\tremoveAttr: function( elem, value ) {\n\t\tvar name,\n\t\t\ti = 0,\n\n\t\t\t// Attribute names can contain non-HTML whitespace characters\n\t\t\t// https://html.spec.whatwg.org/multipage/syntax.html#attributes-2\n\t\t\tattrNames = value && value.match( rnothtmlwhite );\n\n\t\tif ( attrNames && elem.nodeType === 1 ) {\n\t\t\twhile ( ( name = attrNames[ i++ ] ) ) {\n\t\t\t\telem.removeAttribute( name );\n\t\t\t}\n\t\t}\n\t}\n} );\n\n// Hooks for boolean attributes\nboolHook = {\n\tset: function( elem, value, name ) {\n\t\tif ( value === false ) {\n\n\t\t\t// Remove boolean attributes when set to false\n\t\t\tjQuery.removeAttr( elem, name );\n\t\t} else {\n\t\t\telem.setAttribute( name, name );\n\t\t}\n\t\treturn name;\n\t}\n};\n\njQuery.each( jQuery.expr.match.bool.source.match( /\\w+/g ), function( i, name ) {\n\tvar getter = attrHandle[ name ] || jQuery.find.attr;\n\n\tattrHandle[ name ] = function( elem, name, isXML ) {\n\t\tvar ret, handle,\n\t\t\tlowercaseName = name.toLowerCase();\n\n\t\tif ( !isXML ) {\n\n\t\t\t// Avoid an infinite loop by temporarily removing this function from the getter\n\t\t\thandle = attrHandle[ lowercaseName ];\n\t\t\tattrHandle[ lowercaseName ] = ret;\n\t\t\tret = getter( elem, name, isXML ) != null ?\n\t\t\t\tlowercaseName :\n\t\t\t\tnull;\n\t\t\tattrHandle[ lowercaseName ] = handle;\n\t\t}\n\t\treturn ret;\n\t};\n} );\n\n\n\n\nvar rfocusable = /^(?:input|select|textarea|button)$/i,\n\trclickable = /^(?:a|area)$/i;\n\njQuery.fn.extend( {\n\tprop: function( name, value ) {\n\t\treturn access( this, jQuery.prop, name, value, arguments.length > 1 );\n\t},\n\n\tremoveProp: function( name ) {\n\t\treturn this.each( function() {\n\t\t\tdelete this[ jQuery.propFix[ name ] || name ];\n\t\t} );\n\t}\n} );\n\njQuery.extend( {\n\tprop: function( elem, name, value ) {\n\t\tvar ret, hooks,\n\t\t\tnType = elem.nodeType;\n\n\t\t// Don't get/set properties on text, comment and attribute nodes\n\t\tif ( nType === 3 || nType === 8 || nType === 2 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) {\n\n\t\t\t// Fix name and attach hooks\n\t\t\tname = jQuery.propFix[ name ] || name;\n\t\t\thooks = jQuery.propHooks[ name ];\n\t\t}\n\n\t\tif ( value !== undefined ) {\n\t\t\tif ( hooks && \"set\" in hooks &&\n\t\t\t\t( ret = hooks.set( elem, value, name ) ) !== undefined ) {\n\t\t\t\treturn ret;\n\t\t\t}\n\n\t\t\treturn ( elem[ name ] = value );\n\t\t}\n\n\t\tif ( hooks && \"get\" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) {\n\t\t\treturn ret;\n\t\t}\n\n\t\treturn elem[ name ];\n\t},\n\n\tpropHooks: {\n\t\ttabIndex: {\n\t\t\tget: function( elem ) {\n\n\t\t\t\t// Support: IE <=9 - 11 only\n\t\t\t\t// elem.tabIndex doesn't always return the\n\t\t\t\t// correct value when it hasn't been explicitly set\n\t\t\t\t// https://web.archive.org/web/20141116233347/http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/\n\t\t\t\t// Use proper attribute retrieval(#12072)\n\t\t\t\tvar tabindex = jQuery.find.attr( elem, \"tabindex\" );\n\n\t\t\t\tif ( tabindex ) {\n\t\t\t\t\treturn parseInt( tabindex, 10 );\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\trfocusable.test( elem.nodeName ) ||\n\t\t\t\t\trclickable.test( elem.nodeName ) &&\n\t\t\t\t\telem.href\n\t\t\t\t) {\n\t\t\t\t\treturn 0;\n\t\t\t\t}\n\n\t\t\t\treturn -1;\n\t\t\t}\n\t\t}\n\t},\n\n\tpropFix: {\n\t\t\"for\": \"htmlFor\",\n\t\t\"class\": \"className\"\n\t}\n} );\n\n// Support: IE <=11 only\n// Accessing the selectedIndex property\n// forces the browser to respect setting selected\n// on the option\n// The getter ensures a default option is selected\n// when in an optgroup\n// eslint rule \"no-unused-expressions\" is disabled for this code\n// since it considers such accessions noop\nif ( !support.optSelected ) {\n\tjQuery.propHooks.selected = {\n\t\tget: function( elem ) {\n\n\t\t\t/* eslint no-unused-expressions: \"off\" */\n\n\t\t\tvar parent = elem.parentNode;\n\t\t\tif ( parent && parent.parentNode ) {\n\t\t\t\tparent.parentNode.selectedIndex;\n\t\t\t}\n\t\t\treturn null;\n\t\t},\n\t\tset: function( elem ) {\n\n\t\t\t/* eslint no-unused-expressions: \"off\" */\n\n\t\t\tvar parent = elem.parentNode;\n\t\t\tif ( parent ) {\n\t\t\t\tparent.selectedIndex;\n\n\t\t\t\tif ( parent.parentNode ) {\n\t\t\t\t\tparent.parentNode.selectedIndex;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n}\n\njQuery.each( [\n\t\"tabIndex\",\n\t\"readOnly\",\n\t\"maxLength\",\n\t\"cellSpacing\",\n\t\"cellPadding\",\n\t\"rowSpan\",\n\t\"colSpan\",\n\t\"useMap\",\n\t\"frameBorder\",\n\t\"contentEditable\"\n], function() {\n\tjQuery.propFix[ this.toLowerCase() ] = this;\n} );\n\n\n\n\n\t// Strip and collapse whitespace according to HTML spec\n\t// https://infra.spec.whatwg.org/#strip-and-collapse-ascii-whitespace\n\tfunction stripAndCollapse( value ) {\n\t\tvar tokens = value.match( rnothtmlwhite ) || [];\n\t\treturn tokens.join( \" \" );\n\t}\n\n\nfunction getClass( elem ) {\n\treturn elem.getAttribute && elem.getAttribute( \"class\" ) || \"\";\n}\n\nfunction classesToArray( value ) {\n\tif ( Array.isArray( value ) ) {\n\t\treturn value;\n\t}\n\tif ( typeof value === \"string\" ) {\n\t\treturn value.match( rnothtmlwhite ) || [];\n\t}\n\treturn [];\n}\n\njQuery.fn.extend( {\n\taddClass: function( value ) {\n\t\tvar classes, elem, cur, curValue, clazz, j, finalValue,\n\t\t\ti = 0;\n\n\t\tif ( isFunction( value ) ) {\n\t\t\treturn this.each( function( j ) {\n\t\t\t\tjQuery( this ).addClass( value.call( this, j, getClass( this ) ) );\n\t\t\t} );\n\t\t}\n\n\t\tclasses = classesToArray( value );\n\n\t\tif ( classes.length ) {\n\t\t\twhile ( ( elem = this[ i++ ] ) ) {\n\t\t\t\tcurValue = getClass( elem );\n\t\t\t\tcur = elem.nodeType === 1 && ( \" \" + stripAndCollapse( curValue ) + \" \" );\n\n\t\t\t\tif ( cur ) {\n\t\t\t\t\tj = 0;\n\t\t\t\t\twhile ( ( clazz = classes[ j++ ] ) ) {\n\t\t\t\t\t\tif ( cur.indexOf( \" \" + clazz + \" \" ) < 0 ) {\n\t\t\t\t\t\t\tcur += clazz + \" \";\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Only assign if different to avoid unneeded rendering.\n\t\t\t\t\tfinalValue = stripAndCollapse( cur );\n\t\t\t\t\tif ( curValue !== finalValue ) {\n\t\t\t\t\t\telem.setAttribute( \"class\", finalValue );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn this;\n\t},\n\n\tremoveClass: function( value ) {\n\t\tvar classes, elem, cur, curValue, clazz, j, finalValue,\n\t\t\ti = 0;\n\n\t\tif ( isFunction( value ) ) {\n\t\t\treturn this.each( function( j ) {\n\t\t\t\tjQuery( this ).removeClass( value.call( this, j, getClass( this ) ) );\n\t\t\t} );\n\t\t}\n\n\t\tif ( !arguments.length ) {\n\t\t\treturn this.attr( \"class\", \"\" );\n\t\t}\n\n\t\tclasses = classesToArray( value );\n\n\t\tif ( classes.length ) {\n\t\t\twhile ( ( elem = this[ i++ ] ) ) {\n\t\t\t\tcurValue = getClass( elem );\n\n\t\t\t\t// This expression is here for better compressibility (see addClass)\n\t\t\t\tcur = elem.nodeType === 1 && ( \" \" + stripAndCollapse( curValue ) + \" \" );\n\n\t\t\t\tif ( cur ) {\n\t\t\t\t\tj = 0;\n\t\t\t\t\twhile ( ( clazz = classes[ j++ ] ) ) {\n\n\t\t\t\t\t\t// Remove *all* instances\n\t\t\t\t\t\twhile ( cur.indexOf( \" \" + clazz + \" \" ) > -1 ) {\n\t\t\t\t\t\t\tcur = cur.replace( \" \" + clazz + \" \", \" \" );\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Only assign if different to avoid unneeded rendering.\n\t\t\t\t\tfinalValue = stripAndCollapse( cur );\n\t\t\t\t\tif ( curValue !== finalValue ) {\n\t\t\t\t\t\telem.setAttribute( \"class\", finalValue );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn this;\n\t},\n\n\ttoggleClass: function( value, stateVal ) {\n\t\tvar type = typeof value,\n\t\t\tisValidValue = type === \"string\" || Array.isArray( value );\n\n\t\tif ( typeof stateVal === \"boolean\" && isValidValue ) {\n\t\t\treturn stateVal ? this.addClass( value ) : this.removeClass( value );\n\t\t}\n\n\t\tif ( isFunction( value ) ) {\n\t\t\treturn this.each( function( i ) {\n\t\t\t\tjQuery( this ).toggleClass(\n\t\t\t\t\tvalue.call( this, i, getClass( this ), stateVal ),\n\t\t\t\t\tstateVal\n\t\t\t\t);\n\t\t\t} );\n\t\t}\n\n\t\treturn this.each( function() {\n\t\t\tvar className, i, self, classNames;\n\n\t\t\tif ( isValidValue ) {\n\n\t\t\t\t// Toggle individual class names\n\t\t\t\ti = 0;\n\t\t\t\tself = jQuery( this );\n\t\t\t\tclassNames = classesToArray( value );\n\n\t\t\t\twhile ( ( className = classNames[ i++ ] ) ) {\n\n\t\t\t\t\t// Check each className given, space separated list\n\t\t\t\t\tif ( self.hasClass( className ) ) {\n\t\t\t\t\t\tself.removeClass( className );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tself.addClass( className );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t// Toggle whole class name\n\t\t\t} else if ( value === undefined || type === \"boolean\" ) {\n\t\t\t\tclassName = getClass( this );\n\t\t\t\tif ( className ) {\n\n\t\t\t\t\t// Store className if set\n\t\t\t\t\tdataPriv.set( this, \"__className__\", className );\n\t\t\t\t}\n\n\t\t\t\t// If the element has a class name or if we're passed `false`,\n\t\t\t\t// then remove the whole classname (if there was one, the above saved it).\n\t\t\t\t// Otherwise bring back whatever was previously saved (if anything),\n\t\t\t\t// falling back to the empty string if nothing was stored.\n\t\t\t\tif ( this.setAttribute ) {\n\t\t\t\t\tthis.setAttribute( \"class\",\n\t\t\t\t\t\tclassName || value === false ?\n\t\t\t\t\t\t\"\" :\n\t\t\t\t\t\tdataPriv.get( this, \"__className__\" ) || \"\"\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t},\n\n\thasClass: function( selector ) {\n\t\tvar className, elem,\n\t\t\ti = 0;\n\n\t\tclassName = \" \" + selector + \" \";\n\t\twhile ( ( elem = this[ i++ ] ) ) {\n\t\t\tif ( elem.nodeType === 1 &&\n\t\t\t\t( \" \" + stripAndCollapse( getClass( elem ) ) + \" \" ).indexOf( className ) > -1 ) {\n\t\t\t\t\treturn true;\n\t\t\t}\n\t\t}\n\n\t\treturn false;\n\t}\n} );\n\n\n\n\nvar rreturn = /\\r/g;\n\njQuery.fn.extend( {\n\tval: function( value ) {\n\t\tvar hooks, ret, valueIsFunction,\n\t\t\telem = this[ 0 ];\n\n\t\tif ( !arguments.length ) {\n\t\t\tif ( elem ) {\n\t\t\t\thooks = jQuery.valHooks[ elem.type ] ||\n\t\t\t\t\tjQuery.valHooks[ elem.nodeName.toLowerCase() ];\n\n\t\t\t\tif ( hooks &&\n\t\t\t\t\t\"get\" in hooks &&\n\t\t\t\t\t( ret = hooks.get( elem, \"value\" ) ) !== undefined\n\t\t\t\t) {\n\t\t\t\t\treturn ret;\n\t\t\t\t}\n\n\t\t\t\tret = elem.value;\n\n\t\t\t\t// Handle most common string cases\n\t\t\t\tif ( typeof ret === \"string\" ) {\n\t\t\t\t\treturn ret.replace( rreturn, \"\" );\n\t\t\t\t}\n\n\t\t\t\t// Handle cases where value is null/undef or number\n\t\t\t\treturn ret == null ? \"\" : ret;\n\t\t\t}\n\n\t\t\treturn;\n\t\t}\n\n\t\tvalueIsFunction = isFunction( value );\n\n\t\treturn this.each( function( i ) {\n\t\t\tvar val;\n\n\t\t\tif ( this.nodeType !== 1 ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( valueIsFunction ) {\n\t\t\t\tval = value.call( this, i, jQuery( this ).val() );\n\t\t\t} else {\n\t\t\t\tval = value;\n\t\t\t}\n\n\t\t\t// Treat null/undefined as \"\"; convert numbers to string\n\t\t\tif ( val == null ) {\n\t\t\t\tval = \"\";\n\n\t\t\t} else if ( typeof val === \"number\" ) {\n\t\t\t\tval += \"\";\n\n\t\t\t} else if ( Array.isArray( val ) ) {\n\t\t\t\tval = jQuery.map( val, function( value ) {\n\t\t\t\t\treturn value == null ? \"\" : value + \"\";\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\thooks = jQuery.valHooks[ this.type ] || jQuery.valHooks[ this.nodeName.toLowerCase() ];\n\n\t\t\t// If set returns undefined, fall back to normal setting\n\t\t\tif ( !hooks || !( \"set\" in hooks ) || hooks.set( this, val, \"value\" ) === undefined ) {\n\t\t\t\tthis.value = val;\n\t\t\t}\n\t\t} );\n\t}\n} );\n\njQuery.extend( {\n\tvalHooks: {\n\t\toption: {\n\t\t\tget: function( elem ) {\n\n\t\t\t\tvar val = jQuery.find.attr( elem, \"value\" );\n\t\t\t\treturn val != null ?\n\t\t\t\t\tval :\n\n\t\t\t\t\t// Support: IE <=10 - 11 only\n\t\t\t\t\t// option.text throws exceptions (#14686, #14858)\n\t\t\t\t\t// Strip and collapse whitespace\n\t\t\t\t\t// https://html.spec.whatwg.org/#strip-and-collapse-whitespace\n\t\t\t\t\tstripAndCollapse( jQuery.text( elem ) );\n\t\t\t}\n\t\t},\n\t\tselect: {\n\t\t\tget: function( elem ) {\n\t\t\t\tvar value, option, i,\n\t\t\t\t\toptions = elem.options,\n\t\t\t\t\tindex = elem.selectedIndex,\n\t\t\t\t\tone = elem.type === \"select-one\",\n\t\t\t\t\tvalues = one ? null : [],\n\t\t\t\t\tmax = one ? index + 1 : options.length;\n\n\t\t\t\tif ( index < 0 ) {\n\t\t\t\t\ti = max;\n\n\t\t\t\t} else {\n\t\t\t\t\ti = one ? index : 0;\n\t\t\t\t}\n\n\t\t\t\t// Loop through all the selected options\n\t\t\t\tfor ( ; i < max; i++ ) {\n\t\t\t\t\toption = options[ i ];\n\n\t\t\t\t\t// Support: IE <=9 only\n\t\t\t\t\t// IE8-9 doesn't update selected after form reset (#2551)\n\t\t\t\t\tif ( ( option.selected || i === index ) &&\n\n\t\t\t\t\t\t\t// Don't return options that are disabled or in a disabled optgroup\n\t\t\t\t\t\t\t!option.disabled &&\n\t\t\t\t\t\t\t( !option.parentNode.disabled ||\n\t\t\t\t\t\t\t\t!nodeName( option.parentNode, \"optgroup\" ) ) ) {\n\n\t\t\t\t\t\t// Get the specific value for the option\n\t\t\t\t\t\tvalue = jQuery( option ).val();\n\n\t\t\t\t\t\t// We don't need an array for one selects\n\t\t\t\t\t\tif ( one ) {\n\t\t\t\t\t\t\treturn value;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Multi-Selects return an array\n\t\t\t\t\t\tvalues.push( value );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn values;\n\t\t\t},\n\n\t\t\tset: function( elem, value ) {\n\t\t\t\tvar optionSet, option,\n\t\t\t\t\toptions = elem.options,\n\t\t\t\t\tvalues = jQuery.makeArray( value ),\n\t\t\t\t\ti = options.length;\n\n\t\t\t\twhile ( i-- ) {\n\t\t\t\t\toption = options[ i ];\n\n\t\t\t\t\t/* eslint-disable no-cond-assign */\n\n\t\t\t\t\tif ( option.selected =\n\t\t\t\t\t\tjQuery.inArray( jQuery.valHooks.option.get( option ), values ) > -1\n\t\t\t\t\t) {\n\t\t\t\t\t\toptionSet = true;\n\t\t\t\t\t}\n\n\t\t\t\t\t/* eslint-enable no-cond-assign */\n\t\t\t\t}\n\n\t\t\t\t// Force browsers to behave consistently when non-matching value is set\n\t\t\t\tif ( !optionSet ) {\n\t\t\t\t\telem.selectedIndex = -1;\n\t\t\t\t}\n\t\t\t\treturn values;\n\t\t\t}\n\t\t}\n\t}\n} );\n\n// Radios and checkboxes getter/setter\njQuery.each( [ \"radio\", \"checkbox\" ], function() {\n\tjQuery.valHooks[ this ] = {\n\t\tset: function( elem, value ) {\n\t\t\tif ( Array.isArray( value ) ) {\n\t\t\t\treturn ( elem.checked = jQuery.inArray( jQuery( elem ).val(), value ) > -1 );\n\t\t\t}\n\t\t}\n\t};\n\tif ( !support.checkOn ) {\n\t\tjQuery.valHooks[ this ].get = function( elem ) {\n\t\t\treturn elem.getAttribute( \"value\" ) === null ? \"on\" : elem.value;\n\t\t};\n\t}\n} );\n\n\n\n\n// Return jQuery for attributes-only inclusion\n\n\nsupport.focusin = \"onfocusin\" in window;\n\n\nvar rfocusMorph = /^(?:focusinfocus|focusoutblur)$/,\n\tstopPropagationCallback = function( e ) {\n\t\te.stopPropagation();\n\t};\n\njQuery.extend( jQuery.event, {\n\n\ttrigger: function( event, data, elem, onlyHandlers ) {\n\n\t\tvar i, cur, tmp, bubbleType, ontype, handle, special, lastElement,\n\t\t\teventPath = [ elem || document ],\n\t\t\ttype = hasOwn.call( event, \"type\" ) ? event.type : event,\n\t\t\tnamespaces = hasOwn.call( event, \"namespace\" ) ? event.namespace.split( \".\" ) : [];\n\n\t\tcur = lastElement = tmp = elem = elem || document;\n\n\t\t// Don't do events on text and comment nodes\n\t\tif ( elem.nodeType === 3 || elem.nodeType === 8 ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// focus/blur morphs to focusin/out; ensure we're not firing them right now\n\t\tif ( rfocusMorph.test( type + jQuery.event.triggered ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( type.indexOf( \".\" ) > -1 ) {\n\n\t\t\t// Namespaced trigger; create a regexp to match event type in handle()\n\t\t\tnamespaces = type.split( \".\" );\n\t\t\ttype = namespaces.shift();\n\t\t\tnamespaces.sort();\n\t\t}\n\t\tontype = type.indexOf( \":\" ) < 0 && \"on\" + type;\n\n\t\t// Caller can pass in a jQuery.Event object, Object, or just an event type string\n\t\tevent = event[ jQuery.expando ] ?\n\t\t\tevent :\n\t\t\tnew jQuery.Event( type, typeof event === \"object\" && event );\n\n\t\t// Trigger bitmask: & 1 for native handlers; & 2 for jQuery (always true)\n\t\tevent.isTrigger = onlyHandlers ? 2 : 3;\n\t\tevent.namespace = namespaces.join( \".\" );\n\t\tevent.rnamespace = event.namespace ?\n\t\t\tnew RegExp( \"(^|\\\\.)\" + namespaces.join( \"\\\\.(?:.*\\\\.|)\" ) + \"(\\\\.|$)\" ) :\n\t\t\tnull;\n\n\t\t// Clean up the event in case it is being reused\n\t\tevent.result = undefined;\n\t\tif ( !event.target ) {\n\t\t\tevent.target = elem;\n\t\t}\n\n\t\t// Clone any incoming data and prepend the event, creating the handler arg list\n\t\tdata = data == null ?\n\t\t\t[ event ] :\n\t\t\tjQuery.makeArray( data, [ event ] );\n\n\t\t// Allow special events to draw outside the lines\n\t\tspecial = jQuery.event.special[ type ] || {};\n\t\tif ( !onlyHandlers && special.trigger && special.trigger.apply( elem, data ) === false ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Determine event propagation path in advance, per W3C events spec (#9951)\n\t\t// Bubble up to document, then to window; watch for a global ownerDocument var (#9724)\n\t\tif ( !onlyHandlers && !special.noBubble && !isWindow( elem ) ) {\n\n\t\t\tbubbleType = special.delegateType || type;\n\t\t\tif ( !rfocusMorph.test( bubbleType + type ) ) {\n\t\t\t\tcur = cur.parentNode;\n\t\t\t}\n\t\t\tfor ( ; cur; cur = cur.parentNode ) {\n\t\t\t\teventPath.push( cur );\n\t\t\t\ttmp = cur;\n\t\t\t}\n\n\t\t\t// Only add window if we got to document (e.g., not plain obj or detached DOM)\n\t\t\tif ( tmp === ( elem.ownerDocument || document ) ) {\n\t\t\t\teventPath.push( tmp.defaultView || tmp.parentWindow || window );\n\t\t\t}\n\t\t}\n\n\t\t// Fire handlers on the event path\n\t\ti = 0;\n\t\twhile ( ( cur = eventPath[ i++ ] ) && !event.isPropagationStopped() ) {\n\t\t\tlastElement = cur;\n\t\t\tevent.type = i > 1 ?\n\t\t\t\tbubbleType :\n\t\t\t\tspecial.bindType || type;\n\n\t\t\t// jQuery handler\n\t\t\thandle = ( dataPriv.get( cur, \"events\" ) || {} )[ event.type ] &&\n\t\t\t\tdataPriv.get( cur, \"handle\" );\n\t\t\tif ( handle ) {\n\t\t\t\thandle.apply( cur, data );\n\t\t\t}\n\n\t\t\t// Native handler\n\t\t\thandle = ontype && cur[ ontype ];\n\t\t\tif ( handle && handle.apply && acceptData( cur ) ) {\n\t\t\t\tevent.result = handle.apply( cur, data );\n\t\t\t\tif ( event.result === false ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tevent.type = type;\n\n\t\t// If nobody prevented the default action, do it now\n\t\tif ( !onlyHandlers && !event.isDefaultPrevented() ) {\n\n\t\t\tif ( ( !special._default ||\n\t\t\t\tspecial._default.apply( eventPath.pop(), data ) === false ) &&\n\t\t\t\tacceptData( elem ) ) {\n\n\t\t\t\t// Call a native DOM method on the target with the same name as the event.\n\t\t\t\t// Don't do default actions on window, that's where global variables be (#6170)\n\t\t\t\tif ( ontype && isFunction( elem[ type ] ) && !isWindow( elem ) ) {\n\n\t\t\t\t\t// Don't re-trigger an onFOO event when we call its FOO() method\n\t\t\t\t\ttmp = elem[ ontype ];\n\n\t\t\t\t\tif ( tmp ) {\n\t\t\t\t\t\telem[ ontype ] = null;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Prevent re-triggering of the same event, since we already bubbled it above\n\t\t\t\t\tjQuery.event.triggered = type;\n\n\t\t\t\t\tif ( event.isPropagationStopped() ) {\n\t\t\t\t\t\tlastElement.addEventListener( type, stopPropagationCallback );\n\t\t\t\t\t}\n\n\t\t\t\t\telem[ type ]();\n\n\t\t\t\t\tif ( event.isPropagationStopped() ) {\n\t\t\t\t\t\tlastElement.removeEventListener( type, stopPropagationCallback );\n\t\t\t\t\t}\n\n\t\t\t\t\tjQuery.event.triggered = undefined;\n\n\t\t\t\t\tif ( tmp ) {\n\t\t\t\t\t\telem[ ontype ] = tmp;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn event.result;\n\t},\n\n\t// Piggyback on a donor event to simulate a different one\n\t// Used only for `focus(in | out)` events\n\tsimulate: function( type, elem, event ) {\n\t\tvar e = jQuery.extend(\n\t\t\tnew jQuery.Event(),\n\t\t\tevent,\n\t\t\t{\n\t\t\t\ttype: type,\n\t\t\t\tisSimulated: true\n\t\t\t}\n\t\t);\n\n\t\tjQuery.event.trigger( e, null, elem );\n\t}\n\n} );\n\njQuery.fn.extend( {\n\n\ttrigger: function( type, data ) {\n\t\treturn this.each( function() {\n\t\t\tjQuery.event.trigger( type, data, this );\n\t\t} );\n\t},\n\ttriggerHandler: function( type, data ) {\n\t\tvar elem = this[ 0 ];\n\t\tif ( elem ) {\n\t\t\treturn jQuery.event.trigger( type, data, elem, true );\n\t\t}\n\t}\n} );\n\n\n// Support: Firefox <=44\n// Firefox doesn't have focus(in | out) events\n// Related ticket - https://bugzilla.mozilla.org/show_bug.cgi?id=687787\n//\n// Support: Chrome <=48 - 49, Safari <=9.0 - 9.1\n// focus(in | out) events fire after focus & blur events,\n// which is spec violation - http://www.w3.org/TR/DOM-Level-3-Events/#events-focusevent-event-order\n// Related ticket - https://bugs.chromium.org/p/chromium/issues/detail?id=449857\nif ( !support.focusin ) {\n\tjQuery.each( { focus: \"focusin\", blur: \"focusout\" }, function( orig, fix ) {\n\n\t\t// Attach a single capturing handler on the document while someone wants focusin/focusout\n\t\tvar handler = function( event ) {\n\t\t\tjQuery.event.simulate( fix, event.target, jQuery.event.fix( event ) );\n\t\t};\n\n\t\tjQuery.event.special[ fix ] = {\n\t\t\tsetup: function() {\n\t\t\t\tvar doc = this.ownerDocument || this,\n\t\t\t\t\tattaches = dataPriv.access( doc, fix );\n\n\t\t\t\tif ( !attaches ) {\n\t\t\t\t\tdoc.addEventListener( orig, handler, true );\n\t\t\t\t}\n\t\t\t\tdataPriv.access( doc, fix, ( attaches || 0 ) + 1 );\n\t\t\t},\n\t\t\tteardown: function() {\n\t\t\t\tvar doc = this.ownerDocument || this,\n\t\t\t\t\tattaches = dataPriv.access( doc, fix ) - 1;\n\n\t\t\t\tif ( !attaches ) {\n\t\t\t\t\tdoc.removeEventListener( orig, handler, true );\n\t\t\t\t\tdataPriv.remove( doc, fix );\n\n\t\t\t\t} else {\n\t\t\t\t\tdataPriv.access( doc, fix, attaches );\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t} );\n}\nvar location = window.location;\n\nvar nonce = Date.now();\n\nvar rquery = ( /\\?/ );\n\n\n\n// Cross-browser xml parsing\njQuery.parseXML = function( data ) {\n\tvar xml;\n\tif ( !data || typeof data !== \"string\" ) {\n\t\treturn null;\n\t}\n\n\t// Support: IE 9 - 11 only\n\t// IE throws on parseFromString with invalid input.\n\ttry {\n\t\txml = ( new window.DOMParser() ).parseFromString( data, \"text/xml\" );\n\t} catch ( e ) {\n\t\txml = undefined;\n\t}\n\n\tif ( !xml || xml.getElementsByTagName( \"parsererror\" ).length ) {\n\t\tjQuery.error( \"Invalid XML: \" + data );\n\t}\n\treturn xml;\n};\n\n\nvar\n\trbracket = /\\[\\]$/,\n\trCRLF = /\\r?\\n/g,\n\trsubmitterTypes = /^(?:submit|button|image|reset|file)$/i,\n\trsubmittable = /^(?:input|select|textarea|keygen)/i;\n\nfunction buildParams( prefix, obj, traditional, add ) {\n\tvar name;\n\n\tif ( Array.isArray( obj ) ) {\n\n\t\t// Serialize array item.\n\t\tjQuery.each( obj, function( i, v ) {\n\t\t\tif ( traditional || rbracket.test( prefix ) ) {\n\n\t\t\t\t// Treat each array item as a scalar.\n\t\t\t\tadd( prefix, v );\n\n\t\t\t} else {\n\n\t\t\t\t// Item is non-scalar (array or object), encode its numeric index.\n\t\t\t\tbuildParams(\n\t\t\t\t\tprefix + \"[\" + ( typeof v === \"object\" && v != null ? i : \"\" ) + \"]\",\n\t\t\t\t\tv,\n\t\t\t\t\ttraditional,\n\t\t\t\t\tadd\n\t\t\t\t);\n\t\t\t}\n\t\t} );\n\n\t} else if ( !traditional && toType( obj ) === \"object\" ) {\n\n\t\t// Serialize object item.\n\t\tfor ( name in obj ) {\n\t\t\tbuildParams( prefix + \"[\" + name + \"]\", obj[ name ], traditional, add );\n\t\t}\n\n\t} else {\n\n\t\t// Serialize scalar item.\n\t\tadd( prefix, obj );\n\t}\n}\n\n// Serialize an array of form elements or a set of\n// key/values into a query string\njQuery.param = function( a, traditional ) {\n\tvar prefix,\n\t\ts = [],\n\t\tadd = function( key, valueOrFunction ) {\n\n\t\t\t// If value is a function, invoke it and use its return value\n\t\t\tvar value = isFunction( valueOrFunction ) ?\n\t\t\t\tvalueOrFunction() :\n\t\t\t\tvalueOrFunction;\n\n\t\t\ts[ s.length ] = encodeURIComponent( key ) + \"=\" +\n\t\t\t\tencodeURIComponent( value == null ? \"\" : value );\n\t\t};\n\n\tif ( a == null ) {\n\t\treturn \"\";\n\t}\n\n\t// If an array was passed in, assume that it is an array of form elements.\n\tif ( Array.isArray( a ) || ( a.jquery && !jQuery.isPlainObject( a ) ) ) {\n\n\t\t// Serialize the form elements\n\t\tjQuery.each( a, function() {\n\t\t\tadd( this.name, this.value );\n\t\t} );\n\n\t} else {\n\n\t\t// If traditional, encode the \"old\" way (the way 1.3.2 or older\n\t\t// did it), otherwise encode params recursively.\n\t\tfor ( prefix in a ) {\n\t\t\tbuildParams( prefix, a[ prefix ], traditional, add );\n\t\t}\n\t}\n\n\t// Return the resulting serialization\n\treturn s.join( \"&\" );\n};\n\njQuery.fn.extend( {\n\tserialize: function() {\n\t\treturn jQuery.param( this.serializeArray() );\n\t},\n\tserializeArray: function() {\n\t\treturn this.map( function() {\n\n\t\t\t// Can add propHook for \"elements\" to filter or add form elements\n\t\t\tvar elements = jQuery.prop( this, \"elements\" );\n\t\t\treturn elements ? jQuery.makeArray( elements ) : this;\n\t\t} )\n\t\t.filter( function() {\n\t\t\tvar type = this.type;\n\n\t\t\t// Use .is( \":disabled\" ) so that fieldset[disabled] works\n\t\t\treturn this.name && !jQuery( this ).is( \":disabled\" ) &&\n\t\t\t\trsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&\n\t\t\t\t( this.checked || !rcheckableType.test( type ) );\n\t\t} )\n\t\t.map( function( i, elem ) {\n\t\t\tvar val = jQuery( this ).val();\n\n\t\t\tif ( val == null ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tif ( Array.isArray( val ) ) {\n\t\t\t\treturn jQuery.map( val, function( val ) {\n\t\t\t\t\treturn { name: elem.name, value: val.replace( rCRLF, \"\\r\\n\" ) };\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\treturn { name: elem.name, value: val.replace( rCRLF, \"\\r\\n\" ) };\n\t\t} ).get();\n\t}\n} );\n\n\nvar\n\tr20 = /%20/g,\n\trhash = /#.*$/,\n\trantiCache = /([?&])_=[^&]*/,\n\trheaders = /^(.*?):[ \\t]*([^\\r\\n]*)$/mg,\n\n\t// #7653, #8125, #8152: local protocol detection\n\trlocalProtocol = /^(?:about|app|app-storage|.+-extension|file|res|widget):$/,\n\trnoContent = /^(?:GET|HEAD)$/,\n\trprotocol = /^\\/\\//,\n\n\t/* Prefilters\n\t * 1) They are useful to introduce custom dataTypes (see ajax/jsonp.js for an example)\n\t * 2) These are called:\n\t *    - BEFORE asking for a transport\n\t *    - AFTER param serialization (s.data is a string if s.processData is true)\n\t * 3) key is the dataType\n\t * 4) the catchall symbol \"*\" can be used\n\t * 5) execution will start with transport dataType and THEN continue down to \"*\" if needed\n\t */\n\tprefilters = {},\n\n\t/* Transports bindings\n\t * 1) key is the dataType\n\t * 2) the catchall symbol \"*\" can be used\n\t * 3) selection will start with transport dataType and THEN go to \"*\" if needed\n\t */\n\ttransports = {},\n\n\t// Avoid comment-prolog char sequence (#10098); must appease lint and evade compression\n\tallTypes = \"*/\".concat( \"*\" ),\n\n\t// Anchor tag for parsing the document origin\n\toriginAnchor = document.createElement( \"a\" );\n\toriginAnchor.href = location.href;\n\n// Base \"constructor\" for jQuery.ajaxPrefilter and jQuery.ajaxTransport\nfunction addToPrefiltersOrTransports( structure ) {\n\n\t// dataTypeExpression is optional and defaults to \"*\"\n\treturn function( dataTypeExpression, func ) {\n\n\t\tif ( typeof dataTypeExpression !== \"string\" ) {\n\t\t\tfunc = dataTypeExpression;\n\t\t\tdataTypeExpression = \"*\";\n\t\t}\n\n\t\tvar dataType,\n\t\t\ti = 0,\n\t\t\tdataTypes = dataTypeExpression.toLowerCase().match( rnothtmlwhite ) || [];\n\n\t\tif ( isFunction( func ) ) {\n\n\t\t\t// For each dataType in the dataTypeExpression\n\t\t\twhile ( ( dataType = dataTypes[ i++ ] ) ) {\n\n\t\t\t\t// Prepend if requested\n\t\t\t\tif ( dataType[ 0 ] === \"+\" ) {\n\t\t\t\t\tdataType = dataType.slice( 1 ) || \"*\";\n\t\t\t\t\t( structure[ dataType ] = structure[ dataType ] || [] ).unshift( func );\n\n\t\t\t\t// Otherwise append\n\t\t\t\t} else {\n\t\t\t\t\t( structure[ dataType ] = structure[ dataType ] || [] ).push( func );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n}\n\n// Base inspection function for prefilters and transports\nfunction inspectPrefiltersOrTransports( structure, options, originalOptions, jqXHR ) {\n\n\tvar inspected = {},\n\t\tseekingTransport = ( structure === transports );\n\n\tfunction inspect( dataType ) {\n\t\tvar selected;\n\t\tinspected[ dataType ] = true;\n\t\tjQuery.each( structure[ dataType ] || [], function( _, prefilterOrFactory ) {\n\t\t\tvar dataTypeOrTransport = prefilterOrFactory( options, originalOptions, jqXHR );\n\t\t\tif ( typeof dataTypeOrTransport === \"string\" &&\n\t\t\t\t!seekingTransport && !inspected[ dataTypeOrTransport ] ) {\n\n\t\t\t\toptions.dataTypes.unshift( dataTypeOrTransport );\n\t\t\t\tinspect( dataTypeOrTransport );\n\t\t\t\treturn false;\n\t\t\t} else if ( seekingTransport ) {\n\t\t\t\treturn !( selected = dataTypeOrTransport );\n\t\t\t}\n\t\t} );\n\t\treturn selected;\n\t}\n\n\treturn inspect( options.dataTypes[ 0 ] ) || !inspected[ \"*\" ] && inspect( \"*\" );\n}\n\n// A special extend for ajax options\n// that takes \"flat\" options (not to be deep extended)\n// Fixes #9887\nfunction ajaxExtend( target, src ) {\n\tvar key, deep,\n\t\tflatOptions = jQuery.ajaxSettings.flatOptions || {};\n\n\tfor ( key in src ) {\n\t\tif ( src[ key ] !== undefined ) {\n\t\t\t( flatOptions[ key ] ? target : ( deep || ( deep = {} ) ) )[ key ] = src[ key ];\n\t\t}\n\t}\n\tif ( deep ) {\n\t\tjQuery.extend( true, target, deep );\n\t}\n\n\treturn target;\n}\n\n/* Handles responses to an ajax request:\n * - finds the right dataType (mediates between content-type and expected dataType)\n * - returns the corresponding response\n */\nfunction ajaxHandleResponses( s, jqXHR, responses ) {\n\n\tvar ct, type, finalDataType, firstDataType,\n\t\tcontents = s.contents,\n\t\tdataTypes = s.dataTypes;\n\n\t// Remove auto dataType and get content-type in the process\n\twhile ( dataTypes[ 0 ] === \"*\" ) {\n\t\tdataTypes.shift();\n\t\tif ( ct === undefined ) {\n\t\t\tct = s.mimeType || jqXHR.getResponseHeader( \"Content-Type\" );\n\t\t}\n\t}\n\n\t// Check if we're dealing with a known content-type\n\tif ( ct ) {\n\t\tfor ( type in contents ) {\n\t\t\tif ( contents[ type ] && contents[ type ].test( ct ) ) {\n\t\t\t\tdataTypes.unshift( type );\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t}\n\n\t// Check to see if we have a response for the expected dataType\n\tif ( dataTypes[ 0 ] in responses ) {\n\t\tfinalDataType = dataTypes[ 0 ];\n\t} else {\n\n\t\t// Try convertible dataTypes\n\t\tfor ( type in responses ) {\n\t\t\tif ( !dataTypes[ 0 ] || s.converters[ type + \" \" + dataTypes[ 0 ] ] ) {\n\t\t\t\tfinalDataType = type;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tif ( !firstDataType ) {\n\t\t\t\tfirstDataType = type;\n\t\t\t}\n\t\t}\n\n\t\t// Or just use first one\n\t\tfinalDataType = finalDataType || firstDataType;\n\t}\n\n\t// If we found a dataType\n\t// We add the dataType to the list if needed\n\t// and return the corresponding response\n\tif ( finalDataType ) {\n\t\tif ( finalDataType !== dataTypes[ 0 ] ) {\n\t\t\tdataTypes.unshift( finalDataType );\n\t\t}\n\t\treturn responses[ finalDataType ];\n\t}\n}\n\n/* Chain conversions given the request and the original response\n * Also sets the responseXXX fields on the jqXHR instance\n */\nfunction ajaxConvert( s, response, jqXHR, isSuccess ) {\n\tvar conv2, current, conv, tmp, prev,\n\t\tconverters = {},\n\n\t\t// Work with a copy of dataTypes in case we need to modify it for conversion\n\t\tdataTypes = s.dataTypes.slice();\n\n\t// Create converters map with lowercased keys\n\tif ( dataTypes[ 1 ] ) {\n\t\tfor ( conv in s.converters ) {\n\t\t\tconverters[ conv.toLowerCase() ] = s.converters[ conv ];\n\t\t}\n\t}\n\n\tcurrent = dataTypes.shift();\n\n\t// Convert to each sequential dataType\n\twhile ( current ) {\n\n\t\tif ( s.responseFields[ current ] ) {\n\t\t\tjqXHR[ s.responseFields[ current ] ] = response;\n\t\t}\n\n\t\t// Apply the dataFilter if provided\n\t\tif ( !prev && isSuccess && s.dataFilter ) {\n\t\t\tresponse = s.dataFilter( response, s.dataType );\n\t\t}\n\n\t\tprev = current;\n\t\tcurrent = dataTypes.shift();\n\n\t\tif ( current ) {\n\n\t\t\t// There's only work to do if current dataType is non-auto\n\t\t\tif ( current === \"*\" ) {\n\n\t\t\t\tcurrent = prev;\n\n\t\t\t// Convert response if prev dataType is non-auto and differs from current\n\t\t\t} else if ( prev !== \"*\" && prev !== current ) {\n\n\t\t\t\t// Seek a direct converter\n\t\t\t\tconv = converters[ prev + \" \" + current ] || converters[ \"* \" + current ];\n\n\t\t\t\t// If none found, seek a pair\n\t\t\t\tif ( !conv ) {\n\t\t\t\t\tfor ( conv2 in converters ) {\n\n\t\t\t\t\t\t// If conv2 outputs current\n\t\t\t\t\t\ttmp = conv2.split( \" \" );\n\t\t\t\t\t\tif ( tmp[ 1 ] === current ) {\n\n\t\t\t\t\t\t\t// If prev can be converted to accepted input\n\t\t\t\t\t\t\tconv = converters[ prev + \" \" + tmp[ 0 ] ] ||\n\t\t\t\t\t\t\t\tconverters[ \"* \" + tmp[ 0 ] ];\n\t\t\t\t\t\t\tif ( conv ) {\n\n\t\t\t\t\t\t\t\t// Condense equivalence converters\n\t\t\t\t\t\t\t\tif ( conv === true ) {\n\t\t\t\t\t\t\t\t\tconv = converters[ conv2 ];\n\n\t\t\t\t\t\t\t\t// Otherwise, insert the intermediate dataType\n\t\t\t\t\t\t\t\t} else if ( converters[ conv2 ] !== true ) {\n\t\t\t\t\t\t\t\t\tcurrent = tmp[ 0 ];\n\t\t\t\t\t\t\t\t\tdataTypes.unshift( tmp[ 1 ] );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Apply converter (if not an equivalence)\n\t\t\t\tif ( conv !== true ) {\n\n\t\t\t\t\t// Unless errors are allowed to bubble, catch and return them\n\t\t\t\t\tif ( conv && s.throws ) {\n\t\t\t\t\t\tresponse = conv( response );\n\t\t\t\t\t} else {\n\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\tresponse = conv( response );\n\t\t\t\t\t\t} catch ( e ) {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\tstate: \"parsererror\",\n\t\t\t\t\t\t\t\terror: conv ? e : \"No conversion from \" + prev + \" to \" + current\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\treturn { state: \"success\", data: response };\n}\n\njQuery.extend( {\n\n\t// Counter for holding the number of active queries\n\tactive: 0,\n\n\t// Last-Modified header cache for next request\n\tlastModified: {},\n\tetag: {},\n\n\tajaxSettings: {\n\t\turl: location.href,\n\t\ttype: \"GET\",\n\t\tisLocal: rlocalProtocol.test( location.protocol ),\n\t\tglobal: true,\n\t\tprocessData: true,\n\t\tasync: true,\n\t\tcontentType: \"application/x-www-form-urlencoded; charset=UTF-8\",\n\n\t\t/*\n\t\ttimeout: 0,\n\t\tdata: null,\n\t\tdataType: null,\n\t\tusername: null,\n\t\tpassword: null,\n\t\tcache: null,\n\t\tthrows: false,\n\t\ttraditional: false,\n\t\theaders: {},\n\t\t*/\n\n\t\taccepts: {\n\t\t\t\"*\": allTypes,\n\t\t\ttext: \"text/plain\",\n\t\t\thtml: \"text/html\",\n\t\t\txml: \"application/xml, text/xml\",\n\t\t\tjson: \"application/json, text/javascript\"\n\t\t},\n\n\t\tcontents: {\n\t\t\txml: /\\bxml\\b/,\n\t\t\thtml: /\\bhtml/,\n\t\t\tjson: /\\bjson\\b/\n\t\t},\n\n\t\tresponseFields: {\n\t\t\txml: \"responseXML\",\n\t\t\ttext: \"responseText\",\n\t\t\tjson: \"responseJSON\"\n\t\t},\n\n\t\t// Data converters\n\t\t// Keys separate source (or catchall \"*\") and destination types with a single space\n\t\tconverters: {\n\n\t\t\t// Convert anything to text\n\t\t\t\"* text\": String,\n\n\t\t\t// Text to html (true = no transformation)\n\t\t\t\"text html\": true,\n\n\t\t\t// Evaluate text as a json expression\n\t\t\t\"text json\": JSON.parse,\n\n\t\t\t// Parse text as xml\n\t\t\t\"text xml\": jQuery.parseXML\n\t\t},\n\n\t\t// For options that shouldn't be deep extended:\n\t\t// you can add your own custom options here if\n\t\t// and when you create one that shouldn't be\n\t\t// deep extended (see ajaxExtend)\n\t\tflatOptions: {\n\t\t\turl: true,\n\t\t\tcontext: true\n\t\t}\n\t},\n\n\t// Creates a full fledged settings object into target\n\t// with both ajaxSettings and settings fields.\n\t// If target is omitted, writes into ajaxSettings.\n\tajaxSetup: function( target, settings ) {\n\t\treturn settings ?\n\n\t\t\t// Building a settings object\n\t\t\tajaxExtend( ajaxExtend( target, jQuery.ajaxSettings ), settings ) :\n\n\t\t\t// Extending ajaxSettings\n\t\t\tajaxExtend( jQuery.ajaxSettings, target );\n\t},\n\n\tajaxPrefilter: addToPrefiltersOrTransports( prefilters ),\n\tajaxTransport: addToPrefiltersOrTransports( transports ),\n\n\t// Main method\n\tajax: function( url, options ) {\n\n\t\t// If url is an object, simulate pre-1.5 signature\n\t\tif ( typeof url === \"object\" ) {\n\t\t\toptions = url;\n\t\t\turl = undefined;\n\t\t}\n\n\t\t// Force options to be an object\n\t\toptions = options || {};\n\n\t\tvar transport,\n\n\t\t\t// URL without anti-cache param\n\t\t\tcacheURL,\n\n\t\t\t// Response headers\n\t\t\tresponseHeadersString,\n\t\t\tresponseHeaders,\n\n\t\t\t// timeout handle\n\t\t\ttimeoutTimer,\n\n\t\t\t// Url cleanup var\n\t\t\turlAnchor,\n\n\t\t\t// Request state (becomes false upon send and true upon completion)\n\t\t\tcompleted,\n\n\t\t\t// To know if global events are to be dispatched\n\t\t\tfireGlobals,\n\n\t\t\t// Loop variable\n\t\t\ti,\n\n\t\t\t// uncached part of the url\n\t\t\tuncached,\n\n\t\t\t// Create the final options object\n\t\t\ts = jQuery.ajaxSetup( {}, options ),\n\n\t\t\t// Callbacks context\n\t\t\tcallbackContext = s.context || s,\n\n\t\t\t// Context for global events is callbackContext if it is a DOM node or jQuery collection\n\t\t\tglobalEventContext = s.context &&\n\t\t\t\t( callbackContext.nodeType || callbackContext.jquery ) ?\n\t\t\t\t\tjQuery( callbackContext ) :\n\t\t\t\t\tjQuery.event,\n\n\t\t\t// Deferreds\n\t\t\tdeferred = jQuery.Deferred(),\n\t\t\tcompleteDeferred = jQuery.Callbacks( \"once memory\" ),\n\n\t\t\t// Status-dependent callbacks\n\t\t\tstatusCode = s.statusCode || {},\n\n\t\t\t// Headers (they are sent all at once)\n\t\t\trequestHeaders = {},\n\t\t\trequestHeadersNames = {},\n\n\t\t\t// Default abort message\n\t\t\tstrAbort = \"canceled\",\n\n\t\t\t// Fake xhr\n\t\t\tjqXHR = {\n\t\t\t\treadyState: 0,\n\n\t\t\t\t// Builds headers hashtable if needed\n\t\t\t\tgetResponseHeader: function( key ) {\n\t\t\t\t\tvar match;\n\t\t\t\t\tif ( completed ) {\n\t\t\t\t\t\tif ( !responseHeaders ) {\n\t\t\t\t\t\t\tresponseHeaders = {};\n\t\t\t\t\t\t\twhile ( ( match = rheaders.exec( responseHeadersString ) ) ) {\n\t\t\t\t\t\t\t\tresponseHeaders[ match[ 1 ].toLowerCase() + \" \" ] =\n\t\t\t\t\t\t\t\t\t( responseHeaders[ match[ 1 ].toLowerCase() + \" \" ] || [] )\n\t\t\t\t\t\t\t\t\t\t.concat( match[ 2 ] );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tmatch = responseHeaders[ key.toLowerCase() + \" \" ];\n\t\t\t\t\t}\n\t\t\t\t\treturn match == null ? null : match.join( \", \" );\n\t\t\t\t},\n\n\t\t\t\t// Raw string\n\t\t\t\tgetAllResponseHeaders: function() {\n\t\t\t\t\treturn completed ? responseHeadersString : null;\n\t\t\t\t},\n\n\t\t\t\t// Caches the header\n\t\t\t\tsetRequestHeader: function( name, value ) {\n\t\t\t\t\tif ( completed == null ) {\n\t\t\t\t\t\tname = requestHeadersNames[ name.toLowerCase() ] =\n\t\t\t\t\t\t\trequestHeadersNames[ name.toLowerCase() ] || name;\n\t\t\t\t\t\trequestHeaders[ name ] = value;\n\t\t\t\t\t}\n\t\t\t\t\treturn this;\n\t\t\t\t},\n\n\t\t\t\t// Overrides response content-type header\n\t\t\t\toverrideMimeType: function( type ) {\n\t\t\t\t\tif ( completed == null ) {\n\t\t\t\t\t\ts.mimeType = type;\n\t\t\t\t\t}\n\t\t\t\t\treturn this;\n\t\t\t\t},\n\n\t\t\t\t// Status-dependent callbacks\n\t\t\t\tstatusCode: function( map ) {\n\t\t\t\t\tvar code;\n\t\t\t\t\tif ( map ) {\n\t\t\t\t\t\tif ( completed ) {\n\n\t\t\t\t\t\t\t// Execute the appropriate callbacks\n\t\t\t\t\t\t\tjqXHR.always( map[ jqXHR.status ] );\n\t\t\t\t\t\t} else {\n\n\t\t\t\t\t\t\t// Lazy-add the new callbacks in a way that preserves old ones\n\t\t\t\t\t\t\tfor ( code in map ) {\n\t\t\t\t\t\t\t\tstatusCode[ code ] = [ statusCode[ code ], map[ code ] ];\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\treturn this;\n\t\t\t\t},\n\n\t\t\t\t// Cancel the request\n\t\t\t\tabort: function( statusText ) {\n\t\t\t\t\tvar finalText = statusText || strAbort;\n\t\t\t\t\tif ( transport ) {\n\t\t\t\t\t\ttransport.abort( finalText );\n\t\t\t\t\t}\n\t\t\t\t\tdone( 0, finalText );\n\t\t\t\t\treturn this;\n\t\t\t\t}\n\t\t\t};\n\n\t\t// Attach deferreds\n\t\tdeferred.promise( jqXHR );\n\n\t\t// Add protocol if not provided (prefilters might expect it)\n\t\t// Handle falsy url in the settings object (#10093: consistency with old signature)\n\t\t// We also use the url parameter if available\n\t\ts.url = ( ( url || s.url || location.href ) + \"\" )\n\t\t\t.replace( rprotocol, location.protocol + \"//\" );\n\n\t\t// Alias method option to type as per ticket #12004\n\t\ts.type = options.method || options.type || s.method || s.type;\n\n\t\t// Extract dataTypes list\n\t\ts.dataTypes = ( s.dataType || \"*\" ).toLowerCase().match( rnothtmlwhite ) || [ \"\" ];\n\n\t\t// A cross-domain request is in order when the origin doesn't match the current origin.\n\t\tif ( s.crossDomain == null ) {\n\t\t\turlAnchor = document.createElement( \"a\" );\n\n\t\t\t// Support: IE <=8 - 11, Edge 12 - 15\n\t\t\t// IE throws exception on accessing the href property if url is malformed,\n\t\t\t// e.g. http://example.com:80x/\n\t\t\ttry {\n\t\t\t\turlAnchor.href = s.url;\n\n\t\t\t\t// Support: IE <=8 - 11 only\n\t\t\t\t// Anchor's host property isn't correctly set when s.url is relative\n\t\t\t\turlAnchor.href = urlAnchor.href;\n\t\t\t\ts.crossDomain = originAnchor.protocol + \"//\" + originAnchor.host !==\n\t\t\t\t\turlAnchor.protocol + \"//\" + urlAnchor.host;\n\t\t\t} catch ( e ) {\n\n\t\t\t\t// If there is an error parsing the URL, assume it is crossDomain,\n\t\t\t\t// it can be rejected by the transport if it is invalid\n\t\t\t\ts.crossDomain = true;\n\t\t\t}\n\t\t}\n\n\t\t// Convert data if not already a string\n\t\tif ( s.data && s.processData && typeof s.data !== \"string\" ) {\n\t\t\ts.data = jQuery.param( s.data, s.traditional );\n\t\t}\n\n\t\t// Apply prefilters\n\t\tinspectPrefiltersOrTransports( prefilters, s, options, jqXHR );\n\n\t\t// If request was aborted inside a prefilter, stop there\n\t\tif ( completed ) {\n\t\t\treturn jqXHR;\n\t\t}\n\n\t\t// We can fire global events as of now if asked to\n\t\t// Don't fire events if jQuery.event is undefined in an AMD-usage scenario (#15118)\n\t\tfireGlobals = jQuery.event && s.global;\n\n\t\t// Watch for a new set of requests\n\t\tif ( fireGlobals && jQuery.active++ === 0 ) {\n\t\t\tjQuery.event.trigger( \"ajaxStart\" );\n\t\t}\n\n\t\t// Uppercase the type\n\t\ts.type = s.type.toUpperCase();\n\n\t\t// Determine if request has content\n\t\ts.hasContent = !rnoContent.test( s.type );\n\n\t\t// Save the URL in case we're toying with the If-Modified-Since\n\t\t// and/or If-None-Match header later on\n\t\t// Remove hash to simplify url manipulation\n\t\tcacheURL = s.url.replace( rhash, \"\" );\n\n\t\t// More options handling for requests with no content\n\t\tif ( !s.hasContent ) {\n\n\t\t\t// Remember the hash so we can put it back\n\t\t\tuncached = s.url.slice( cacheURL.length );\n\n\t\t\t// If data is available and should be processed, append data to url\n\t\t\tif ( s.data && ( s.processData || typeof s.data === \"string\" ) ) {\n\t\t\t\tcacheURL += ( rquery.test( cacheURL ) ? \"&\" : \"?\" ) + s.data;\n\n\t\t\t\t// #9682: remove data so that it's not used in an eventual retry\n\t\t\t\tdelete s.data;\n\t\t\t}\n\n\t\t\t// Add or update anti-cache param if needed\n\t\t\tif ( s.cache === false ) {\n\t\t\t\tcacheURL = cacheURL.replace( rantiCache, \"$1\" );\n\t\t\t\tuncached = ( rquery.test( cacheURL ) ? \"&\" : \"?\" ) + \"_=\" + ( nonce++ ) + uncached;\n\t\t\t}\n\n\t\t\t// Put hash and anti-cache on the URL that will be requested (gh-1732)\n\t\t\ts.url = cacheURL + uncached;\n\n\t\t// Change '%20' to '+' if this is encoded form body content (gh-2658)\n\t\t} else if ( s.data && s.processData &&\n\t\t\t( s.contentType || \"\" ).indexOf( \"application/x-www-form-urlencoded\" ) === 0 ) {\n\t\t\ts.data = s.data.replace( r20, \"+\" );\n\t\t}\n\n\t\t// Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.\n\t\tif ( s.ifModified ) {\n\t\t\tif ( jQuery.lastModified[ cacheURL ] ) {\n\t\t\t\tjqXHR.setRequestHeader( \"If-Modified-Since\", jQuery.lastModified[ cacheURL ] );\n\t\t\t}\n\t\t\tif ( jQuery.etag[ cacheURL ] ) {\n\t\t\t\tjqXHR.setRequestHeader( \"If-None-Match\", jQuery.etag[ cacheURL ] );\n\t\t\t}\n\t\t}\n\n\t\t// Set the correct header, if data is being sent\n\t\tif ( s.data && s.hasContent && s.contentType !== false || options.contentType ) {\n\t\t\tjqXHR.setRequestHeader( \"Content-Type\", s.contentType );\n\t\t}\n\n\t\t// Set the Accepts header for the server, depending on the dataType\n\t\tjqXHR.setRequestHeader(\n\t\t\t\"Accept\",\n\t\t\ts.dataTypes[ 0 ] && s.accepts[ s.dataTypes[ 0 ] ] ?\n\t\t\t\ts.accepts[ s.dataTypes[ 0 ] ] +\n\t\t\t\t\t( s.dataTypes[ 0 ] !== \"*\" ? \", \" + allTypes + \"; q=0.01\" : \"\" ) :\n\t\t\t\ts.accepts[ \"*\" ]\n\t\t);\n\n\t\t// Check for headers option\n\t\tfor ( i in s.headers ) {\n\t\t\tjqXHR.setRequestHeader( i, s.headers[ i ] );\n\t\t}\n\n\t\t// Allow custom headers/mimetypes and early abort\n\t\tif ( s.beforeSend &&\n\t\t\t( s.beforeSend.call( callbackContext, jqXHR, s ) === false || completed ) ) {\n\n\t\t\t// Abort if not done already and return\n\t\t\treturn jqXHR.abort();\n\t\t}\n\n\t\t// Aborting is no longer a cancellation\n\t\tstrAbort = \"abort\";\n\n\t\t// Install callbacks on deferreds\n\t\tcompleteDeferred.add( s.complete );\n\t\tjqXHR.done( s.success );\n\t\tjqXHR.fail( s.error );\n\n\t\t// Get transport\n\t\ttransport = inspectPrefiltersOrTransports( transports, s, options, jqXHR );\n\n\t\t// If no transport, we auto-abort\n\t\tif ( !transport ) {\n\t\t\tdone( -1, \"No Transport\" );\n\t\t} else {\n\t\t\tjqXHR.readyState = 1;\n\n\t\t\t// Send global event\n\t\t\tif ( fireGlobals ) {\n\t\t\t\tglobalEventContext.trigger( \"ajaxSend\", [ jqXHR, s ] );\n\t\t\t}\n\n\t\t\t// If request was aborted inside ajaxSend, stop there\n\t\t\tif ( completed ) {\n\t\t\t\treturn jqXHR;\n\t\t\t}\n\n\t\t\t// Timeout\n\t\t\tif ( s.async && s.timeout > 0 ) {\n\t\t\t\ttimeoutTimer = window.setTimeout( function() {\n\t\t\t\t\tjqXHR.abort( \"timeout\" );\n\t\t\t\t}, s.timeout );\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tcompleted = false;\n\t\t\t\ttransport.send( requestHeaders, done );\n\t\t\t} catch ( e ) {\n\n\t\t\t\t// Rethrow post-completion exceptions\n\t\t\t\tif ( completed ) {\n\t\t\t\t\tthrow e;\n\t\t\t\t}\n\n\t\t\t\t// Propagate others as results\n\t\t\t\tdone( -1, e );\n\t\t\t}\n\t\t}\n\n\t\t// Callback for when everything is done\n\t\tfunction done( status, nativeStatusText, responses, headers ) {\n\t\t\tvar isSuccess, success, error, response, modified,\n\t\t\t\tstatusText = nativeStatusText;\n\n\t\t\t// Ignore repeat invocations\n\t\t\tif ( completed ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tcompleted = true;\n\n\t\t\t// Clear timeout if it exists\n\t\t\tif ( timeoutTimer ) {\n\t\t\t\twindow.clearTimeout( timeoutTimer );\n\t\t\t}\n\n\t\t\t// Dereference transport for early garbage collection\n\t\t\t// (no matter how long the jqXHR object will be used)\n\t\t\ttransport = undefined;\n\n\t\t\t// Cache response headers\n\t\t\tresponseHeadersString = headers || \"\";\n\n\t\t\t// Set readyState\n\t\t\tjqXHR.readyState = status > 0 ? 4 : 0;\n\n\t\t\t// Determine if successful\n\t\t\tisSuccess = status >= 200 && status < 300 || status === 304;\n\n\t\t\t// Get response data\n\t\t\tif ( responses ) {\n\t\t\t\tresponse = ajaxHandleResponses( s, jqXHR, responses );\n\t\t\t}\n\n\t\t\t// Convert no matter what (that way responseXXX fields are always set)\n\t\t\tresponse = ajaxConvert( s, response, jqXHR, isSuccess );\n\n\t\t\t// If successful, handle type chaining\n\t\t\tif ( isSuccess ) {\n\n\t\t\t\t// Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.\n\t\t\t\tif ( s.ifModified ) {\n\t\t\t\t\tmodified = jqXHR.getResponseHeader( \"Last-Modified\" );\n\t\t\t\t\tif ( modified ) {\n\t\t\t\t\t\tjQuery.lastModified[ cacheURL ] = modified;\n\t\t\t\t\t}\n\t\t\t\t\tmodified = jqXHR.getResponseHeader( \"etag\" );\n\t\t\t\t\tif ( modified ) {\n\t\t\t\t\t\tjQuery.etag[ cacheURL ] = modified;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// if no content\n\t\t\t\tif ( status === 204 || s.type === \"HEAD\" ) {\n\t\t\t\t\tstatusText = \"nocontent\";\n\n\t\t\t\t// if not modified\n\t\t\t\t} else if ( status === 304 ) {\n\t\t\t\t\tstatusText = \"notmodified\";\n\n\t\t\t\t// If we have data, let's convert it\n\t\t\t\t} else {\n\t\t\t\t\tstatusText = response.state;\n\t\t\t\t\tsuccess = response.data;\n\t\t\t\t\terror = response.error;\n\t\t\t\t\tisSuccess = !error;\n\t\t\t\t}\n\t\t\t} else {\n\n\t\t\t\t// Extract error from statusText and normalize for non-aborts\n\t\t\t\terror = statusText;\n\t\t\t\tif ( status || !statusText ) {\n\t\t\t\t\tstatusText = \"error\";\n\t\t\t\t\tif ( status < 0 ) {\n\t\t\t\t\t\tstatus = 0;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Set data for the fake xhr object\n\t\t\tjqXHR.status = status;\n\t\t\tjqXHR.statusText = ( nativeStatusText || statusText ) + \"\";\n\n\t\t\t// Success/Error\n\t\t\tif ( isSuccess ) {\n\t\t\t\tdeferred.resolveWith( callbackContext, [ success, statusText, jqXHR ] );\n\t\t\t} else {\n\t\t\t\tdeferred.rejectWith( callbackContext, [ jqXHR, statusText, error ] );\n\t\t\t}\n\n\t\t\t// Status-dependent callbacks\n\t\t\tjqXHR.statusCode( statusCode );\n\t\t\tstatusCode = undefined;\n\n\t\t\tif ( fireGlobals ) {\n\t\t\t\tglobalEventContext.trigger( isSuccess ? \"ajaxSuccess\" : \"ajaxError\",\n\t\t\t\t\t[ jqXHR, s, isSuccess ? success : error ] );\n\t\t\t}\n\n\t\t\t// Complete\n\t\t\tcompleteDeferred.fireWith( callbackContext, [ jqXHR, statusText ] );\n\n\t\t\tif ( fireGlobals ) {\n\t\t\t\tglobalEventContext.trigger( \"ajaxComplete\", [ jqXHR, s ] );\n\n\t\t\t\t// Handle the global AJAX counter\n\t\t\t\tif ( !( --jQuery.active ) ) {\n\t\t\t\t\tjQuery.event.trigger( \"ajaxStop\" );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn jqXHR;\n\t},\n\n\tgetJSON: function( url, data, callback ) {\n\t\treturn jQuery.get( url, data, callback, \"json\" );\n\t},\n\n\tgetScript: function( url, callback ) {\n\t\treturn jQuery.get( url, undefined, callback, \"script\" );\n\t}\n} );\n\njQuery.each( [ \"get\", \"post\" ], function( i, method ) {\n\tjQuery[ method ] = function( url, data, callback, type ) {\n\n\t\t// Shift arguments if data argument was omitted\n\t\tif ( isFunction( data ) ) {\n\t\t\ttype = type || callback;\n\t\t\tcallback = data;\n\t\t\tdata = undefined;\n\t\t}\n\n\t\t// The url can be an options object (which then must have .url)\n\t\treturn jQuery.ajax( jQuery.extend( {\n\t\t\turl: url,\n\t\t\ttype: method,\n\t\t\tdataType: type,\n\t\t\tdata: data,\n\t\t\tsuccess: callback\n\t\t}, jQuery.isPlainObject( url ) && url ) );\n\t};\n} );\n\n\njQuery._evalUrl = function( url, options ) {\n\treturn jQuery.ajax( {\n\t\turl: url,\n\n\t\t// Make this explicit, since user can override this through ajaxSetup (#11264)\n\t\ttype: \"GET\",\n\t\tdataType: \"script\",\n\t\tcache: true,\n\t\tasync: false,\n\t\tglobal: false,\n\n\t\t// Only evaluate the response if it is successful (gh-4126)\n\t\t// dataFilter is not invoked for failure responses, so using it instead\n\t\t// of the default converter is kludgy but it works.\n\t\tconverters: {\n\t\t\t\"text script\": function() {}\n\t\t},\n\t\tdataFilter: function( response ) {\n\t\t\tjQuery.globalEval( response, options );\n\t\t}\n\t} );\n};\n\n\njQuery.fn.extend( {\n\twrapAll: function( html ) {\n\t\tvar wrap;\n\n\t\tif ( this[ 0 ] ) {\n\t\t\tif ( isFunction( html ) ) {\n\t\t\t\thtml = html.call( this[ 0 ] );\n\t\t\t}\n\n\t\t\t// The elements to wrap the target around\n\t\t\twrap = jQuery( html, this[ 0 ].ownerDocument ).eq( 0 ).clone( true );\n\n\t\t\tif ( this[ 0 ].parentNode ) {\n\t\t\t\twrap.insertBefore( this[ 0 ] );\n\t\t\t}\n\n\t\t\twrap.map( function() {\n\t\t\t\tvar elem = this;\n\n\t\t\t\twhile ( elem.firstElementChild ) {\n\t\t\t\t\telem = elem.firstElementChild;\n\t\t\t\t}\n\n\t\t\t\treturn elem;\n\t\t\t} ).append( this );\n\t\t}\n\n\t\treturn this;\n\t},\n\n\twrapInner: function( html ) {\n\t\tif ( isFunction( html ) ) {\n\t\t\treturn this.each( function( i ) {\n\t\t\t\tjQuery( this ).wrapInner( html.call( this, i ) );\n\t\t\t} );\n\t\t}\n\n\t\treturn this.each( function() {\n\t\t\tvar self = jQuery( this ),\n\t\t\t\tcontents = self.contents();\n\n\t\t\tif ( contents.length ) {\n\t\t\t\tcontents.wrapAll( html );\n\n\t\t\t} else {\n\t\t\t\tself.append( html );\n\t\t\t}\n\t\t} );\n\t},\n\n\twrap: function( html ) {\n\t\tvar htmlIsFunction = isFunction( html );\n\n\t\treturn this.each( function( i ) {\n\t\t\tjQuery( this ).wrapAll( htmlIsFunction ? html.call( this, i ) : html );\n\t\t} );\n\t},\n\n\tunwrap: function( selector ) {\n\t\tthis.parent( selector ).not( \"body\" ).each( function() {\n\t\t\tjQuery( this ).replaceWith( this.childNodes );\n\t\t} );\n\t\treturn this;\n\t}\n} );\n\n\njQuery.expr.pseudos.hidden = function( elem ) {\n\treturn !jQuery.expr.pseudos.visible( elem );\n};\njQuery.expr.pseudos.visible = function( elem ) {\n\treturn !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length );\n};\n\n\n\n\njQuery.ajaxSettings.xhr = function() {\n\ttry {\n\t\treturn new window.XMLHttpRequest();\n\t} catch ( e ) {}\n};\n\nvar xhrSuccessStatus = {\n\n\t\t// File protocol always yields status code 0, assume 200\n\t\t0: 200,\n\n\t\t// Support: IE <=9 only\n\t\t// #1450: sometimes IE returns 1223 when it should be 204\n\t\t1223: 204\n\t},\n\txhrSupported = jQuery.ajaxSettings.xhr();\n\nsupport.cors = !!xhrSupported && ( \"withCredentials\" in xhrSupported );\nsupport.ajax = xhrSupported = !!xhrSupported;\n\njQuery.ajaxTransport( function( options ) {\n\tvar callback, errorCallback;\n\n\t// Cross domain only allowed if supported through XMLHttpRequest\n\tif ( support.cors || xhrSupported && !options.crossDomain ) {\n\t\treturn {\n\t\t\tsend: function( headers, complete ) {\n\t\t\t\tvar i,\n\t\t\t\t\txhr = options.xhr();\n\n\t\t\t\txhr.open(\n\t\t\t\t\toptions.type,\n\t\t\t\t\toptions.url,\n\t\t\t\t\toptions.async,\n\t\t\t\t\toptions.username,\n\t\t\t\t\toptions.password\n\t\t\t\t);\n\n\t\t\t\t// Apply custom fields if provided\n\t\t\t\tif ( options.xhrFields ) {\n\t\t\t\t\tfor ( i in options.xhrFields ) {\n\t\t\t\t\t\txhr[ i ] = options.xhrFields[ i ];\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Override mime type if needed\n\t\t\t\tif ( options.mimeType && xhr.overrideMimeType ) {\n\t\t\t\t\txhr.overrideMimeType( options.mimeType );\n\t\t\t\t}\n\n\t\t\t\t// X-Requested-With header\n\t\t\t\t// For cross-domain requests, seeing as conditions for a preflight are\n\t\t\t\t// akin to a jigsaw puzzle, we simply never set it to be sure.\n\t\t\t\t// (it can always be set on a per-request basis or even using ajaxSetup)\n\t\t\t\t// For same-domain requests, won't change header if already provided.\n\t\t\t\tif ( !options.crossDomain && !headers[ \"X-Requested-With\" ] ) {\n\t\t\t\t\theaders[ \"X-Requested-With\" ] = \"XMLHttpRequest\";\n\t\t\t\t}\n\n\t\t\t\t// Set headers\n\t\t\t\tfor ( i in headers ) {\n\t\t\t\t\txhr.setRequestHeader( i, headers[ i ] );\n\t\t\t\t}\n\n\t\t\t\t// Callback\n\t\t\t\tcallback = function( type ) {\n\t\t\t\t\treturn function() {\n\t\t\t\t\t\tif ( callback ) {\n\t\t\t\t\t\t\tcallback = errorCallback = xhr.onload =\n\t\t\t\t\t\t\t\txhr.onerror = xhr.onabort = xhr.ontimeout =\n\t\t\t\t\t\t\t\t\txhr.onreadystatechange = null;\n\n\t\t\t\t\t\t\tif ( type === \"abort\" ) {\n\t\t\t\t\t\t\t\txhr.abort();\n\t\t\t\t\t\t\t} else if ( type === \"error\" ) {\n\n\t\t\t\t\t\t\t\t// Support: IE <=9 only\n\t\t\t\t\t\t\t\t// On a manual native abort, IE9 throws\n\t\t\t\t\t\t\t\t// errors on any property access that is not readyState\n\t\t\t\t\t\t\t\tif ( typeof xhr.status !== \"number\" ) {\n\t\t\t\t\t\t\t\t\tcomplete( 0, \"error\" );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tcomplete(\n\n\t\t\t\t\t\t\t\t\t\t// File: protocol always yields status 0; see #8605, #14207\n\t\t\t\t\t\t\t\t\t\txhr.status,\n\t\t\t\t\t\t\t\t\t\txhr.statusText\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tcomplete(\n\t\t\t\t\t\t\t\t\txhrSuccessStatus[ xhr.status ] || xhr.status,\n\t\t\t\t\t\t\t\t\txhr.statusText,\n\n\t\t\t\t\t\t\t\t\t// Support: IE <=9 only\n\t\t\t\t\t\t\t\t\t// IE9 has no XHR2 but throws on binary (trac-11426)\n\t\t\t\t\t\t\t\t\t// For XHR2 non-text, let the caller handle it (gh-2498)\n\t\t\t\t\t\t\t\t\t( xhr.responseType || \"text\" ) !== \"text\"  ||\n\t\t\t\t\t\t\t\t\ttypeof xhr.responseText !== \"string\" ?\n\t\t\t\t\t\t\t\t\t\t{ binary: xhr.response } :\n\t\t\t\t\t\t\t\t\t\t{ text: xhr.responseText },\n\t\t\t\t\t\t\t\t\txhr.getAllResponseHeaders()\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t};\n\t\t\t\t};\n\n\t\t\t\t// Listen to events\n\t\t\t\txhr.onload = callback();\n\t\t\t\terrorCallback = xhr.onerror = xhr.ontimeout = callback( \"error\" );\n\n\t\t\t\t// Support: IE 9 only\n\t\t\t\t// Use onreadystatechange to replace onabort\n\t\t\t\t// to handle uncaught aborts\n\t\t\t\tif ( xhr.onabort !== undefined ) {\n\t\t\t\t\txhr.onabort = errorCallback;\n\t\t\t\t} else {\n\t\t\t\t\txhr.onreadystatechange = function() {\n\n\t\t\t\t\t\t// Check readyState before timeout as it changes\n\t\t\t\t\t\tif ( xhr.readyState === 4 ) {\n\n\t\t\t\t\t\t\t// Allow onerror to be called first,\n\t\t\t\t\t\t\t// but that will not handle a native abort\n\t\t\t\t\t\t\t// Also, save errorCallback to a variable\n\t\t\t\t\t\t\t// as xhr.onerror cannot be accessed\n\t\t\t\t\t\t\twindow.setTimeout( function() {\n\t\t\t\t\t\t\t\tif ( callback ) {\n\t\t\t\t\t\t\t\t\terrorCallback();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t}\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\t// Create the abort callback\n\t\t\t\tcallback = callback( \"abort\" );\n\n\t\t\t\ttry {\n\n\t\t\t\t\t// Do send the request (this may raise an exception)\n\t\t\t\t\txhr.send( options.hasContent && options.data || null );\n\t\t\t\t} catch ( e ) {\n\n\t\t\t\t\t// #14683: Only rethrow if this hasn't been notified as an error yet\n\t\t\t\t\tif ( callback ) {\n\t\t\t\t\t\tthrow e;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\n\t\t\tabort: function() {\n\t\t\t\tif ( callback ) {\n\t\t\t\t\tcallback();\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t}\n} );\n\n\n\n\n// Prevent auto-execution of scripts when no explicit dataType was provided (See gh-2432)\njQuery.ajaxPrefilter( function( s ) {\n\tif ( s.crossDomain ) {\n\t\ts.contents.script = false;\n\t}\n} );\n\n// Install script dataType\njQuery.ajaxSetup( {\n\taccepts: {\n\t\tscript: \"text/javascript, application/javascript, \" +\n\t\t\t\"application/ecmascript, application/x-ecmascript\"\n\t},\n\tcontents: {\n\t\tscript: /\\b(?:java|ecma)script\\b/\n\t},\n\tconverters: {\n\t\t\"text script\": function( text ) {\n\t\t\tjQuery.globalEval( text );\n\t\t\treturn text;\n\t\t}\n\t}\n} );\n\n// Handle cache's special case and crossDomain\njQuery.ajaxPrefilter( \"script\", function( s ) {\n\tif ( s.cache === undefined ) {\n\t\ts.cache = false;\n\t}\n\tif ( s.crossDomain ) {\n\t\ts.type = \"GET\";\n\t}\n} );\n\n// Bind script tag hack transport\njQuery.ajaxTransport( \"script\", function( s ) {\n\n\t// This transport only deals with cross domain or forced-by-attrs requests\n\tif ( s.crossDomain || s.scriptAttrs ) {\n\t\tvar script, callback;\n\t\treturn {\n\t\t\tsend: function( _, complete ) {\n\t\t\t\tscript = jQuery( \"<script>\" )\n\t\t\t\t\t.attr( s.scriptAttrs || {} )\n\t\t\t\t\t.prop( { charset: s.scriptCharset, src: s.url } )\n\t\t\t\t\t.on( \"load error\", callback = function( evt ) {\n\t\t\t\t\t\tscript.remove();\n\t\t\t\t\t\tcallback = null;\n\t\t\t\t\t\tif ( evt ) {\n\t\t\t\t\t\t\tcomplete( evt.type === \"error\" ? 404 : 200, evt.type );\n\t\t\t\t\t\t}\n\t\t\t\t\t} );\n\n\t\t\t\t// Use native DOM manipulation to avoid our domManip AJAX trickery\n\t\t\t\tdocument.head.appendChild( script[ 0 ] );\n\t\t\t},\n\t\t\tabort: function() {\n\t\t\t\tif ( callback ) {\n\t\t\t\t\tcallback();\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t}\n} );\n\n\n\n\nvar oldCallbacks = [],\n\trjsonp = /(=)\\?(?=&|$)|\\?\\?/;\n\n// Default jsonp settings\njQuery.ajaxSetup( {\n\tjsonp: \"callback\",\n\tjsonpCallback: function() {\n\t\tvar callback = oldCallbacks.pop() || ( jQuery.expando + \"_\" + ( nonce++ ) );\n\t\tthis[ callback ] = true;\n\t\treturn callback;\n\t}\n} );\n\n// Detect, normalize options and install callbacks for jsonp requests\njQuery.ajaxPrefilter( \"json jsonp\", function( s, originalSettings, jqXHR ) {\n\n\tvar callbackName, overwritten, responseContainer,\n\t\tjsonProp = s.jsonp !== false && ( rjsonp.test( s.url ) ?\n\t\t\t\"url\" :\n\t\t\ttypeof s.data === \"string\" &&\n\t\t\t\t( s.contentType || \"\" )\n\t\t\t\t\t.indexOf( \"application/x-www-form-urlencoded\" ) === 0 &&\n\t\t\t\trjsonp.test( s.data ) && \"data\"\n\t\t);\n\n\t// Handle iff the expected data type is \"jsonp\" or we have a parameter to set\n\tif ( jsonProp || s.dataTypes[ 0 ] === \"jsonp\" ) {\n\n\t\t// Get callback name, remembering preexisting value associated with it\n\t\tcallbackName = s.jsonpCallback = isFunction( s.jsonpCallback ) ?\n\t\t\ts.jsonpCallback() :\n\t\t\ts.jsonpCallback;\n\n\t\t// Insert callback into url or form data\n\t\tif ( jsonProp ) {\n\t\t\ts[ jsonProp ] = s[ jsonProp ].replace( rjsonp, \"$1\" + callbackName );\n\t\t} else if ( s.jsonp !== false ) {\n\t\t\ts.url += ( rquery.test( s.url ) ? \"&\" : \"?\" ) + s.jsonp + \"=\" + callbackName;\n\t\t}\n\n\t\t// Use data converter to retrieve json after script execution\n\t\ts.converters[ \"script json\" ] = function() {\n\t\t\tif ( !responseContainer ) {\n\t\t\t\tjQuery.error( callbackName + \" was not called\" );\n\t\t\t}\n\t\t\treturn responseContainer[ 0 ];\n\t\t};\n\n\t\t// Force json dataType\n\t\ts.dataTypes[ 0 ] = \"json\";\n\n\t\t// Install callback\n\t\toverwritten = window[ callbackName ];\n\t\twindow[ callbackName ] = function() {\n\t\t\tresponseContainer = arguments;\n\t\t};\n\n\t\t// Clean-up function (fires after converters)\n\t\tjqXHR.always( function() {\n\n\t\t\t// If previous value didn't exist - remove it\n\t\t\tif ( overwritten === undefined ) {\n\t\t\t\tjQuery( window ).removeProp( callbackName );\n\n\t\t\t// Otherwise restore preexisting value\n\t\t\t} else {\n\t\t\t\twindow[ callbackName ] = overwritten;\n\t\t\t}\n\n\t\t\t// Save back as free\n\t\t\tif ( s[ callbackName ] ) {\n\n\t\t\t\t// Make sure that re-using the options doesn't screw things around\n\t\t\t\ts.jsonpCallback = originalSettings.jsonpCallback;\n\n\t\t\t\t// Save the callback name for future use\n\t\t\t\toldCallbacks.push( callbackName );\n\t\t\t}\n\n\t\t\t// Call if it was a function and we have a response\n\t\t\tif ( responseContainer && isFunction( overwritten ) ) {\n\t\t\t\toverwritten( responseContainer[ 0 ] );\n\t\t\t}\n\n\t\t\tresponseContainer = overwritten = undefined;\n\t\t} );\n\n\t\t// Delegate to script\n\t\treturn \"script\";\n\t}\n} );\n\n\n\n\n// Support: Safari 8 only\n// In Safari 8 documents created via document.implementation.createHTMLDocument\n// collapse sibling forms: the second one becomes a child of the first one.\n// Because of that, this security measure has to be disabled in Safari 8.\n// https://bugs.webkit.org/show_bug.cgi?id=137337\nsupport.createHTMLDocument = ( function() {\n\tvar body = document.implementation.createHTMLDocument( \"\" ).body;\n\tbody.innerHTML = \"<form></form><form></form>\";\n\treturn body.childNodes.length === 2;\n} )();\n\n\n// Argument \"data\" should be string of html\n// context (optional): If specified, the fragment will be created in this context,\n// defaults to document\n// keepScripts (optional): If true, will include scripts passed in the html string\njQuery.parseHTML = function( data, context, keepScripts ) {\n\tif ( typeof data !== \"string\" ) {\n\t\treturn [];\n\t}\n\tif ( typeof context === \"boolean\" ) {\n\t\tkeepScripts = context;\n\t\tcontext = false;\n\t}\n\n\tvar base, parsed, scripts;\n\n\tif ( !context ) {\n\n\t\t// Stop scripts or inline event handlers from being executed immediately\n\t\t// by using document.implementation\n\t\tif ( support.createHTMLDocument ) {\n\t\t\tcontext = document.implementation.createHTMLDocument( \"\" );\n\n\t\t\t// Set the base href for the created document\n\t\t\t// so any parsed elements with URLs\n\t\t\t// are based on the document's URL (gh-2965)\n\t\t\tbase = context.createElement( \"base\" );\n\t\t\tbase.href = document.location.href;\n\t\t\tcontext.head.appendChild( base );\n\t\t} else {\n\t\t\tcontext = document;\n\t\t}\n\t}\n\n\tparsed = rsingleTag.exec( data );\n\tscripts = !keepScripts && [];\n\n\t// Single tag\n\tif ( parsed ) {\n\t\treturn [ context.createElement( parsed[ 1 ] ) ];\n\t}\n\n\tparsed = buildFragment( [ data ], context, scripts );\n\n\tif ( scripts && scripts.length ) {\n\t\tjQuery( scripts ).remove();\n\t}\n\n\treturn jQuery.merge( [], parsed.childNodes );\n};\n\n\n/**\n * Load a url into a page\n */\njQuery.fn.load = function( url, params, callback ) {\n\tvar selector, type, response,\n\t\tself = this,\n\t\toff = url.indexOf( \" \" );\n\n\tif ( off > -1 ) {\n\t\tselector = stripAndCollapse( url.slice( off ) );\n\t\turl = url.slice( 0, off );\n\t}\n\n\t// If it's a function\n\tif ( isFunction( params ) ) {\n\n\t\t// We assume that it's the callback\n\t\tcallback = params;\n\t\tparams = undefined;\n\n\t// Otherwise, build a param string\n\t} else if ( params && typeof params === \"object\" ) {\n\t\ttype = \"POST\";\n\t}\n\n\t// If we have elements to modify, make the request\n\tif ( self.length > 0 ) {\n\t\tjQuery.ajax( {\n\t\t\turl: url,\n\n\t\t\t// If \"type\" variable is undefined, then \"GET\" method will be used.\n\t\t\t// Make value of this field explicit since\n\t\t\t// user can override it through ajaxSetup method\n\t\t\ttype: type || \"GET\",\n\t\t\tdataType: \"html\",\n\t\t\tdata: params\n\t\t} ).done( function( responseText ) {\n\n\t\t\t// Save response for use in complete callback\n\t\t\tresponse = arguments;\n\n\t\t\tself.html( selector ?\n\n\t\t\t\t// If a selector was specified, locate the right elements in a dummy div\n\t\t\t\t// Exclude scripts to avoid IE 'Permission Denied' errors\n\t\t\t\tjQuery( \"<div>\" ).append( jQuery.parseHTML( responseText ) ).find( selector ) :\n\n\t\t\t\t// Otherwise use the full result\n\t\t\t\tresponseText );\n\n\t\t// If the request succeeds, this function gets \"data\", \"status\", \"jqXHR\"\n\t\t// but they are ignored because response was set above.\n\t\t// If it fails, this function gets \"jqXHR\", \"status\", \"error\"\n\t\t} ).always( callback && function( jqXHR, status ) {\n\t\t\tself.each( function() {\n\t\t\t\tcallback.apply( this, response || [ jqXHR.responseText, status, jqXHR ] );\n\t\t\t} );\n\t\t} );\n\t}\n\n\treturn this;\n};\n\n\n\n\n// Attach a bunch of functions for handling common AJAX events\njQuery.each( [\n\t\"ajaxStart\",\n\t\"ajaxStop\",\n\t\"ajaxComplete\",\n\t\"ajaxError\",\n\t\"ajaxSuccess\",\n\t\"ajaxSend\"\n], function( i, type ) {\n\tjQuery.fn[ type ] = function( fn ) {\n\t\treturn this.on( type, fn );\n\t};\n} );\n\n\n\n\njQuery.expr.pseudos.animated = function( elem ) {\n\treturn jQuery.grep( jQuery.timers, function( fn ) {\n\t\treturn elem === fn.elem;\n\t} ).length;\n};\n\n\n\n\njQuery.offset = {\n\tsetOffset: function( elem, options, i ) {\n\t\tvar curPosition, curLeft, curCSSTop, curTop, curOffset, curCSSLeft, calculatePosition,\n\t\t\tposition = jQuery.css( elem, \"position\" ),\n\t\t\tcurElem = jQuery( elem ),\n\t\t\tprops = {};\n\n\t\t// Set position first, in-case top/left are set even on static elem\n\t\tif ( position === \"static\" ) {\n\t\t\telem.style.position = \"relative\";\n\t\t}\n\n\t\tcurOffset = curElem.offset();\n\t\tcurCSSTop = jQuery.css( elem, \"top\" );\n\t\tcurCSSLeft = jQuery.css( elem, \"left\" );\n\t\tcalculatePosition = ( position === \"absolute\" || position === \"fixed\" ) &&\n\t\t\t( curCSSTop + curCSSLeft ).indexOf( \"auto\" ) > -1;\n\n\t\t// Need to be able to calculate position if either\n\t\t// top or left is auto and position is either absolute or fixed\n\t\tif ( calculatePosition ) {\n\t\t\tcurPosition = curElem.position();\n\t\t\tcurTop = curPosition.top;\n\t\t\tcurLeft = curPosition.left;\n\n\t\t} else {\n\t\t\tcurTop = parseFloat( curCSSTop ) || 0;\n\t\t\tcurLeft = parseFloat( curCSSLeft ) || 0;\n\t\t}\n\n\t\tif ( isFunction( options ) ) {\n\n\t\t\t// Use jQuery.extend here to allow modification of coordinates argument (gh-1848)\n\t\t\toptions = options.call( elem, i, jQuery.extend( {}, curOffset ) );\n\t\t}\n\n\t\tif ( options.top != null ) {\n\t\t\tprops.top = ( options.top - curOffset.top ) + curTop;\n\t\t}\n\t\tif ( options.left != null ) {\n\t\t\tprops.left = ( options.left - curOffset.left ) + curLeft;\n\t\t}\n\n\t\tif ( \"using\" in options ) {\n\t\t\toptions.using.call( elem, props );\n\n\t\t} else {\n\t\t\tcurElem.css( props );\n\t\t}\n\t}\n};\n\njQuery.fn.extend( {\n\n\t// offset() relates an element's border box to the document origin\n\toffset: function( options ) {\n\n\t\t// Preserve chaining for setter\n\t\tif ( arguments.length ) {\n\t\t\treturn options === undefined ?\n\t\t\t\tthis :\n\t\t\t\tthis.each( function( i ) {\n\t\t\t\t\tjQuery.offset.setOffset( this, options, i );\n\t\t\t\t} );\n\t\t}\n\n\t\tvar rect, win,\n\t\t\telem = this[ 0 ];\n\n\t\tif ( !elem ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Return zeros for disconnected and hidden (display: none) elements (gh-2310)\n\t\t// Support: IE <=11 only\n\t\t// Running getBoundingClientRect on a\n\t\t// disconnected node in IE throws an error\n\t\tif ( !elem.getClientRects().length ) {\n\t\t\treturn { top: 0, left: 0 };\n\t\t}\n\n\t\t// Get document-relative position by adding viewport scroll to viewport-relative gBCR\n\t\trect = elem.getBoundingClientRect();\n\t\twin = elem.ownerDocument.defaultView;\n\t\treturn {\n\t\t\ttop: rect.top + win.pageYOffset,\n\t\t\tleft: rect.left + win.pageXOffset\n\t\t};\n\t},\n\n\t// position() relates an element's margin box to its offset parent's padding box\n\t// This corresponds to the behavior of CSS absolute positioning\n\tposition: function() {\n\t\tif ( !this[ 0 ] ) {\n\t\t\treturn;\n\t\t}\n\n\t\tvar offsetParent, offset, doc,\n\t\t\telem = this[ 0 ],\n\t\t\tparentOffset = { top: 0, left: 0 };\n\n\t\t// position:fixed elements are offset from the viewport, which itself always has zero offset\n\t\tif ( jQuery.css( elem, \"position\" ) === \"fixed\" ) {\n\n\t\t\t// Assume position:fixed implies availability of getBoundingClientRect\n\t\t\toffset = elem.getBoundingClientRect();\n\n\t\t} else {\n\t\t\toffset = this.offset();\n\n\t\t\t// Account for the *real* offset parent, which can be the document or its root element\n\t\t\t// when a statically positioned element is identified\n\t\t\tdoc = elem.ownerDocument;\n\t\t\toffsetParent = elem.offsetParent || doc.documentElement;\n\t\t\twhile ( offsetParent &&\n\t\t\t\t( offsetParent === doc.body || offsetParent === doc.documentElement ) &&\n\t\t\t\tjQuery.css( offsetParent, \"position\" ) === \"static\" ) {\n\n\t\t\t\toffsetParent = offsetParent.parentNode;\n\t\t\t}\n\t\t\tif ( offsetParent && offsetParent !== elem && offsetParent.nodeType === 1 ) {\n\n\t\t\t\t// Incorporate borders into its offset, since they are outside its content origin\n\t\t\t\tparentOffset = jQuery( offsetParent ).offset();\n\t\t\t\tparentOffset.top += jQuery.css( offsetParent, \"borderTopWidth\", true );\n\t\t\t\tparentOffset.left += jQuery.css( offsetParent, \"borderLeftWidth\", true );\n\t\t\t}\n\t\t}\n\n\t\t// Subtract parent offsets and element margins\n\t\treturn {\n\t\t\ttop: offset.top - parentOffset.top - jQuery.css( elem, \"marginTop\", true ),\n\t\t\tleft: offset.left - parentOffset.left - jQuery.css( elem, \"marginLeft\", true )\n\t\t};\n\t},\n\n\t// This method will return documentElement in the following cases:\n\t// 1) For the element inside the iframe without offsetParent, this method will return\n\t//    documentElement of the parent window\n\t// 2) For the hidden or detached element\n\t// 3) For body or html element, i.e. in case of the html node - it will return itself\n\t//\n\t// but those exceptions were never presented as a real life use-cases\n\t// and might be considered as more preferable results.\n\t//\n\t// This logic, however, is not guaranteed and can change at any point in the future\n\toffsetParent: function() {\n\t\treturn this.map( function() {\n\t\t\tvar offsetParent = this.offsetParent;\n\n\t\t\twhile ( offsetParent && jQuery.css( offsetParent, \"position\" ) === \"static\" ) {\n\t\t\t\toffsetParent = offsetParent.offsetParent;\n\t\t\t}\n\n\t\t\treturn offsetParent || documentElement;\n\t\t} );\n\t}\n} );\n\n// Create scrollLeft and scrollTop methods\njQuery.each( { scrollLeft: \"pageXOffset\", scrollTop: \"pageYOffset\" }, function( method, prop ) {\n\tvar top = \"pageYOffset\" === prop;\n\n\tjQuery.fn[ method ] = function( val ) {\n\t\treturn access( this, function( elem, method, val ) {\n\n\t\t\t// Coalesce documents and windows\n\t\t\tvar win;\n\t\t\tif ( isWindow( elem ) ) {\n\t\t\t\twin = elem;\n\t\t\t} else if ( elem.nodeType === 9 ) {\n\t\t\t\twin = elem.defaultView;\n\t\t\t}\n\n\t\t\tif ( val === undefined ) {\n\t\t\t\treturn win ? win[ prop ] : elem[ method ];\n\t\t\t}\n\n\t\t\tif ( win ) {\n\t\t\t\twin.scrollTo(\n\t\t\t\t\t!top ? val : win.pageXOffset,\n\t\t\t\t\ttop ? val : win.pageYOffset\n\t\t\t\t);\n\n\t\t\t} else {\n\t\t\t\telem[ method ] = val;\n\t\t\t}\n\t\t}, method, val, arguments.length );\n\t};\n} );\n\n// Support: Safari <=7 - 9.1, Chrome <=37 - 49\n// Add the top/left cssHooks using jQuery.fn.position\n// Webkit bug: https://bugs.webkit.org/show_bug.cgi?id=29084\n// Blink bug: https://bugs.chromium.org/p/chromium/issues/detail?id=589347\n// getComputedStyle returns percent when specified for top/left/bottom/right;\n// rather than make the css module depend on the offset module, just check for it here\njQuery.each( [ \"top\", \"left\" ], function( i, prop ) {\n\tjQuery.cssHooks[ prop ] = addGetHookIf( support.pixelPosition,\n\t\tfunction( elem, computed ) {\n\t\t\tif ( computed ) {\n\t\t\t\tcomputed = curCSS( elem, prop );\n\n\t\t\t\t// If curCSS returns percentage, fallback to offset\n\t\t\t\treturn rnumnonpx.test( computed ) ?\n\t\t\t\t\tjQuery( elem ).position()[ prop ] + \"px\" :\n\t\t\t\t\tcomputed;\n\t\t\t}\n\t\t}\n\t);\n} );\n\n\n// Create innerHeight, innerWidth, height, width, outerHeight and outerWidth methods\njQuery.each( { Height: \"height\", Width: \"width\" }, function( name, type ) {\n\tjQuery.each( { padding: \"inner\" + name, content: type, \"\": \"outer\" + name },\n\t\tfunction( defaultExtra, funcName ) {\n\n\t\t// Margin is only for outerHeight, outerWidth\n\t\tjQuery.fn[ funcName ] = function( margin, value ) {\n\t\t\tvar chainable = arguments.length && ( defaultExtra || typeof margin !== \"boolean\" ),\n\t\t\t\textra = defaultExtra || ( margin === true || value === true ? \"margin\" : \"border\" );\n\n\t\t\treturn access( this, function( elem, type, value ) {\n\t\t\t\tvar doc;\n\n\t\t\t\tif ( isWindow( elem ) ) {\n\n\t\t\t\t\t// $( window ).outerWidth/Height return w/h including scrollbars (gh-1729)\n\t\t\t\t\treturn funcName.indexOf( \"outer\" ) === 0 ?\n\t\t\t\t\t\telem[ \"inner\" + name ] :\n\t\t\t\t\t\telem.document.documentElement[ \"client\" + name ];\n\t\t\t\t}\n\n\t\t\t\t// Get document width or height\n\t\t\t\tif ( elem.nodeType === 9 ) {\n\t\t\t\t\tdoc = elem.documentElement;\n\n\t\t\t\t\t// Either scroll[Width/Height] or offset[Width/Height] or client[Width/Height],\n\t\t\t\t\t// whichever is greatest\n\t\t\t\t\treturn Math.max(\n\t\t\t\t\t\telem.body[ \"scroll\" + name ], doc[ \"scroll\" + name ],\n\t\t\t\t\t\telem.body[ \"offset\" + name ], doc[ \"offset\" + name ],\n\t\t\t\t\t\tdoc[ \"client\" + name ]\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn value === undefined ?\n\n\t\t\t\t\t// Get width or height on the element, requesting but not forcing parseFloat\n\t\t\t\t\tjQuery.css( elem, type, extra ) :\n\n\t\t\t\t\t// Set width or height on the element\n\t\t\t\t\tjQuery.style( elem, type, value, extra );\n\t\t\t}, type, chainable ? margin : undefined, chainable );\n\t\t};\n\t} );\n} );\n\n\njQuery.each( ( \"blur focus focusin focusout resize scroll click dblclick \" +\n\t\"mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave \" +\n\t\"change select submit keydown keypress keyup contextmenu\" ).split( \" \" ),\n\tfunction( i, name ) {\n\n\t// Handle event binding\n\tjQuery.fn[ name ] = function( data, fn ) {\n\t\treturn arguments.length > 0 ?\n\t\t\tthis.on( name, null, data, fn ) :\n\t\t\tthis.trigger( name );\n\t};\n} );\n\njQuery.fn.extend( {\n\thover: function( fnOver, fnOut ) {\n\t\treturn this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );\n\t}\n} );\n\n\n\n\njQuery.fn.extend( {\n\n\tbind: function( types, data, fn ) {\n\t\treturn this.on( types, null, data, fn );\n\t},\n\tunbind: function( types, fn ) {\n\t\treturn this.off( types, null, fn );\n\t},\n\n\tdelegate: function( selector, types, data, fn ) {\n\t\treturn this.on( types, selector, data, fn );\n\t},\n\tundelegate: function( selector, types, fn ) {\n\n\t\t// ( namespace ) or ( selector, types [, fn] )\n\t\treturn arguments.length === 1 ?\n\t\t\tthis.off( selector, \"**\" ) :\n\t\t\tthis.off( types, selector || \"**\", fn );\n\t}\n} );\n\n// Bind a function to a context, optionally partially applying any\n// arguments.\n// jQuery.proxy is deprecated to promote standards (specifically Function#bind)\n// However, it is not slated for removal any time soon\njQuery.proxy = function( fn, context ) {\n\tvar tmp, args, proxy;\n\n\tif ( typeof context === \"string\" ) {\n\t\ttmp = fn[ context ];\n\t\tcontext = fn;\n\t\tfn = tmp;\n\t}\n\n\t// Quick check to determine if target is callable, in the spec\n\t// this throws a TypeError, but we will just return undefined.\n\tif ( !isFunction( fn ) ) {\n\t\treturn undefined;\n\t}\n\n\t// Simulated bind\n\targs = slice.call( arguments, 2 );\n\tproxy = function() {\n\t\treturn fn.apply( context || this, args.concat( slice.call( arguments ) ) );\n\t};\n\n\t// Set the guid of unique handler to the same of original handler, so it can be removed\n\tproxy.guid = fn.guid = fn.guid || jQuery.guid++;\n\n\treturn proxy;\n};\n\njQuery.holdReady = function( hold ) {\n\tif ( hold ) {\n\t\tjQuery.readyWait++;\n\t} else {\n\t\tjQuery.ready( true );\n\t}\n};\njQuery.isArray = Array.isArray;\njQuery.parseJSON = JSON.parse;\njQuery.nodeName = nodeName;\njQuery.isFunction = isFunction;\njQuery.isWindow = isWindow;\njQuery.camelCase = camelCase;\njQuery.type = toType;\n\njQuery.now = Date.now;\n\njQuery.isNumeric = function( obj ) {\n\n\t// As of jQuery 3.0, isNumeric is limited to\n\t// strings and numbers (primitives or objects)\n\t// that can be coerced to finite numbers (gh-2662)\n\tvar type = jQuery.type( obj );\n\treturn ( type === \"number\" || type === \"string\" ) &&\n\n\t\t// parseFloat NaNs numeric-cast false positives (\"\")\n\t\t// ...but misinterprets leading-number strings, particularly hex literals (\"0x...\")\n\t\t// subtraction forces infinities to NaN\n\t\t!isNaN( obj - parseFloat( obj ) );\n};\n\n\n\n\n// Register as a named AMD module, since jQuery can be concatenated with other\n// files that may use define, but not via a proper concatenation script that\n// understands anonymous AMD modules. A named AMD is safest and most robust\n// way to register. Lowercase jquery is used because AMD module names are\n// derived from file names, and jQuery is normally delivered in a lowercase\n// file name. Do this after creating the global so that if an AMD module wants\n// to call noConflict to hide this version of jQuery, it will work.\n\n// Note that for maximum portability, libraries that are not jQuery should\n// declare themselves as anonymous modules, and avoid setting a global if an\n// AMD loader is present. jQuery is a special case. For more information, see\n// https://github.com/jrburke/requirejs/wiki/Updating-existing-libraries#wiki-anon\n\nif ( typeof define === \"function\" && define.amd ) {\n\tdefine( \"jquery\", [], function() {\n\t\treturn jQuery;\n\t} );\n}\n\n\n\n\nvar\n\n\t// Map over jQuery in case of overwrite\n\t_jQuery = window.jQuery,\n\n\t// Map over the $ in case of overwrite\n\t_$ = window.$;\n\njQuery.noConflict = function( deep ) {\n\tif ( window.$ === jQuery ) {\n\t\twindow.$ = _$;\n\t}\n\n\tif ( deep && window.jQuery === jQuery ) {\n\t\twindow.jQuery = _jQuery;\n\t}\n\n\treturn jQuery;\n};\n\n// Expose jQuery and $ identifiers, even in AMD\n// (#7102#comment:10, https://github.com/jquery/jquery/pull/557)\n// and CommonJS for browser emulators (#13566)\nif ( !noGlobal ) {\n\twindow.jQuery = window.$ = jQuery;\n}\n\n\n\n\nreturn jQuery;\n} );\n"
  },
  {
    "path": "src/assets/stylesheets/_animations.scss",
    "content": "/* ==========================================================================\n   ANIMATIONS\n   ========================================================================== */\n\n/*\n   Fade-in\n   ========================================================================== */\n\n@keyframes fade-in {\n  0% {\n    opacity: 0;\n  }\n\n  100% {\n    opacity: 1;\n  }\n}\n\n/*\n   Spin\n   ========================================================================== */\n\n@keyframes spin {\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(359deg);\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_archive.scss",
    "content": "/* ==========================================================================\n   Archive\n   ========================================================================== */\n\n.archive,\n.archive_work,\n.autopage_tags {\n  @include breakpoint($md-down) {\n    margin-left: 5vw;\n    margin-right: 5vw;\n  }\n\n  @include breakpoint($md-up) {\n    display: grid;\n    grid-template-columns: 2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;\n    grid-template-rows: 80px auto auto;\n    align-items: end;\n  }\n\n  @include breakpoint($xl-up) {\n    grid-template-columns: 5% 5% 20% 10% 10% 10% 10% 20% 5% 5%;\n  }\n\n  .page__content {\n    @include breakpoint($md-up) {\n      grid-column: 3 / 9;\n    }\n\n    @include breakpoint($lg-up) {\n      grid-column: 3 / 9;\n    }\n  }\n\n  .entry__title {\n    margin-bottom: 0;\n  }\n\n  .heading {\n    @include margin-top(3);\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_base.scss",
    "content": "/* ==========================================================================\n   Base elements\n   ========================================================================== */\n\nhtml {\n  font-size: #{$base-font-size + '%'};\n\n  @include breakpoint($xl-up) {\n    font-size: #{$base-font-size * 1.125 + '%'};\n  }\n}\n\n// * {\n//   @include line-height(1);\n//   @include margin-top(0);\n// }\n\nbody {\n  margin: 0;\n  padding: 0;\n  min-height: 100%;\n  color: $text-color;\n  font-family: $serif-font;\n  font-kerning: normal;\n  word-wrap: break-word;\n}\n\n// Headings parameters [ h1: line-height: 2 × 26px, margin-top: 3 × 26px, margin-bottom: 1 × 26px ]\n$headings: (\n  h1: (2, 3, 1),\n  h2: (1.5, 2, 1),\n  h3: (1.25, 1, 1),\n  h4: (1.125, 1, 0),\n  h5: (1, 1, 0),\n  h6: (1, 1, 0)\n);\n\n// Set line-heights and margins\n@each $heading, $properties in $headings {\n  #{$heading} {\n    @include line-height(nth($properties, 1));\n    @include margin-top(nth($properties, 2));\n    @include margin-bottom(nth($properties, 3));\n  }\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-family: $sans-serif-font;\n  text-rendering: optimizeLegibility; /* enable common ligatures and kerning */\n}\n\nh2 {\n  font-size: ms(2, $thread: h);\n\n  @include breakpoint ($md-up) {\n    font-size: ms(3, $thread: h);\n  }\n\n  @include breakpoint ($lg-up) {\n    font-size: ms(4, $thread: h);\n  }\n}\n\nh3 {\n  font-size: ms(1, $thread: h);\n\n  @include breakpoint ($md-up) {\n    font-size: ms(2, $thread: h);\n  }\n\n  @include breakpoint ($lg-up) {\n    font-size: ms(3, $thread: h);\n  }\n}\n\nh4 {\n  font-size: ms(0, $thread: h);\n\n  @include breakpoint ($md-up) {\n    font-size: ms(1, $thread: h);\n  }\n\n  @include breakpoint ($lg-up) {\n    font-size: ms(2, $thread: h);\n  }\n}\n\nh5 {\n  font-size: ms(-1, $thread: h);\n\n  @include breakpoint ($md-up) {\n    font-size: ms(0, $thread: h);\n  }\n\n  @include breakpoint ($lg-up) {\n    font-size: ms(1, $thread: h);\n  }\n}\n\nh6 {\n  font-size: ms(-2, $thread: h);\n\n  @include breakpoint ($md-up) {\n    font-size: ms(-1, $thread: h);\n  }\n\n  @include breakpoint ($lg-up) {\n    font-size: ms(0, $thread: h);\n  }\n}\n\n\nblockquote {\n  margin-right: 0;\n  margin-left: calc(-1rem - 0.25rem);\n  padding: 0 1rem;\n  border-left: 0.25rem solid #7a7e83;\n}\n\nblockquote,\nq {\n  font-style: italic;\n}\n\nblockquote cite,\nq cite {\n  font-family: $sans-serif-font;\n  font-size: 80%;\n  font-style: normal;\n  font-weight: 700;\n}\n\nblockquote :last-child {\n  margin-bottom: 0;\n}\n\nhr {\n  box-sizing: content-box;\n  display: block;\n  border: 0;\n  margin-top: 3em;\n  margin-bottom: 3em;\n  text-align: center;\n}\n\nhr::before {\n  content: '';\n  display: inline-block;\n  width: 20px;\n  height: 3px;\n  background-color: $text-color;\n}\n\na {\n  color: #1e79ae;\n  text-decoration: none;\n\n  &:visited {\n    color: #165b83;\n  }\n\n  &:hover {\n    text-decoration: underline;\n  }\n}\n\np img {\n  max-width: 100%;\n}\n\n:focus {\n  outline: none;\n}\n\n:focus:not([tabindex=\"-1\"]) {\n  outline: 2px solid $info-color;\n  outline-offset: 2px;\n}\n\ninput,\ntextarea,\nselect {\n  &:focus:not([tabindex=\"-1\"]) {\n    border: 1px solid $info-color;\n    outline: 0;\n    outline-offset: 0;\n  }\n}\n\ncode,\nkbd,\nsamp,\npre {\n  font-family: $monospace-font;\n}\n\npre {\n  overflow-x: auto;\n}\n\nkbd {\n  background-color: rgb(247, 247, 247);\n  border-radius: 3px;\n  border: 1px solid rgb(204, 204, 204);\n  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), inset 0 0 0 2px #fff;\n  display: inline-block;\n  margin: 0 0.125em;\n  padding: 0.125em 0.5em;\n  text-shadow: 0 1px 0 #fff;\n}\n\ndt {\n  font-weight: bold;\n\n  &:not(:first-child) {\n    margin-top: 1rem;\n  }\n}\n\ndd {\n  margin: 0;\n}\n\nfigure {\n  margin-left: 0;\n  margin-right: 0;\n\n  > p {\n    margin-bottom: 0;\n    width: 100%;\n  }\n\n  > img {\n    width: 100%;\n  }\n}\n\nfigcaption {\n  font-size: 80%;\n  margin: 0.5rem 0;\n}\n\nimg {\n  /* lazysizes plugin */\n  &[data-sizes=\"auto\"] {\n    display: block;\n    width: 100%;\n  }\n}\n\nul, ol {\n  @include breakpoint($md-up) {\n    padding-left: 0;\n    list-style-position: outside;\n  }\n}\n\nul {\n  list-style-type: square;\n}\n\nli {\n\n  > img {\n    margin: 1rem 0;\n  }\n}\n\ninput:required,\ntextarea:required {\n  box-shadow: none;\n}\n\niframe {\n  max-width: 100%;\n}\n\n::selection {\n  color: #fff;\n  background: #000;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_buttons.scss",
    "content": "/* ==========================================================================\n   Buttons\n   ========================================================================== */\n\n.btn,\n[type=\"submit\"] {\n  background-color: $text-color;\n  border-radius: $border-radius;\n  border: 0;\n  color: #fff;\n  cursor: pointer;\n  display: inline-block;\n  font-family: $monospace-font;\n  font-size: ms(-1);\n  font-weight: bold;\n  line-height: 1.5;\n  padding: 0.5em 1em;\n  text-align: center;\n  text-decoration: none;\n\n  &:hover {\n    background-color: tint($accent-color, 20%);\n    color: #fff;\n    text-decoration: none;\n  }\n\n  &:visited {\n    color: #fff;\n  }\n\n  &:active {\n    transform: scale(0.95);\n  }\n\n  .icon {\n    margin-right: 0.5em;\n  }\n}\n\n.btn--group {\n  display: flex;\n  flex-direction: column;\n  margin-bottom: 2rem;\n\n  @include breakpoint($md-up) {\n    flex-direction: row;\n  }\n\n  .btn {\n    margin-bottom: 0.25em;\n  }\n\n  .btn + .btn {\n    @include breakpoint($md-up) {\n      margin-left: 0.25em;\n    }\n  }\n}\n\n/* block button fills width of parent container */\n.btn--block {\n  display: block;\n  width: 100%;\n\n  + .btn--block {\n    margin-top: 1rem;\n  }\n}\n\n/* for dark backgrounds */\n.btn--inverse {\n  background-color: #fff;\n  color: $text-color !important;\n  outline: 0.125em solid $text-color;\n\n  &:hover {\n    background-color: mix($text-color, #fff, 10%);\n    outline: 0.125em solid $text-color;\n  }\n}\n\n/* light outline */\n.btn--light-outline {\n  background-color: transparent;\n  border: 1px solid #fff !important; // override\n}\n\n/* information */\n.btn--info {\n  background-color: $info-color;\n\n  &:hover {\n    background-color: mix(#000, $info-color, 20%);\n  }\n}\n\n/* warning */\n.btn--warning {\n  background-color: $warning-color;\n\n  &:hover {\n    background-color: mix(#000, $warning-color, 20%);\n  }\n}\n\n/* success */\n.btn--success {\n  background-color: $success-color;\n\n  &:hover {\n    background-color: mix(#000, $success-color, 20%);\n  }\n}\n\n/* danger */\n.btn--danger {\n  background-color: $danger-color;\n\n  &:hover {\n    background-color: mix(#000, $danger-color, 20%);\n  }\n}\n\n/* disabled */\n.btn--disabled {\n  box-shadow: none;\n  cursor: not-allowed;\n  opacity: 0.65;\n  pointer-events: none;\n}\n\n/* social buttons */\n$social: (facebook, $facebook-color),  (twitter, $twitter-color);\n\n@each $socialnetwork, $color in $social {\n  .btn--#{$socialnetwork} {\n    background-color: $color;\n\n    &:hover {\n      background-color: mix(#000, $color, 20%);\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_comments.scss",
    "content": "/* ==========================================================================\n   Comments\n   ========================================================================== */\n\n.comment {\n  display: flex;\n\n  + .comment {\n    margin-top: 2em;\n  }\n\n  &.child {\n    margin-left: 40px;\n\n    @include breakpoint($md-up) {\n      margin-left: 80px;\n    }\n  }\n}\n\n.comment__avatar {\n  $avatar-size: 30px;\n\n  flex-shrink: 0;\n  margin-right: 10px;\n  width: $avatar-size;\n  height: $avatar-size;\n  background-color: #e3e3e3;\n\n  @include breakpoint($md-up) {\n    margin-right: 20px;\n    width: (2 * $avatar-size);\n    height: (2 * $avatar-size);\n  }\n\n  img {\n    width: $avatar-size;\n    height: $avatar-size;\n\n    @include breakpoint($md-up) {\n      width: (2 * $avatar-size);\n      height: (2 * $avatar-size);\n    }\n  }\n}\n\n.comment__main {\n  min-width: calc(100% - 40px); // fix overflowing code blocks (message width - avatar size)\n\n  @include breakpoint($md-up) {\n    min-width: calc(100% - 80px); // fix overflowing code blocks (message width - avatar size)\n  }\n}\n\n.comment__meta {\n  margin-bottom: 1em;\n  padding-bottom: 0.25em;\n  font-family: $monospace-font;\n  font-size: ms(-1);\n  border-bottom: 2px solid;\n\n  a {\n    color: inherit;\n  }\n}\n\n.comment__message {\n  font-size: ms(-1);\n\n  > *:last-child {\n    margin-bottom: 0;\n  }\n\n  img {\n    max-width: 100%;\n  }\n}\n\n.comment__reply {\n  margin-top: 0.5em;\n  font-family: $monospace-font;\n  font-size: ms(-2);\n}\n\n.comment__form {\n  @include margin-bottom(2);\n\n  .title {\n    @include margin-top(2);\n\n    &:before {\n      @include margin-bottom(1);\n      content: '';\n      display: block;\n      width: 2em;\n      height: 0.125em;\n      background-color: #000;\n    }\n  }\n}\n\n#cancel-comment-reply-link {\n  margin-left: 1em;\n  color: $danger-color;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_contact-lists.scss",
    "content": "/* ==========================================================================\n   Contact lists\n   ========================================================================== */\n\n.contact-list {\n  @include list-unstyled;\n\n  .icon {\n    margin-right: 0.25em;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_entries.scss",
    "content": "/* ==========================================================================\n   Entries (Posts, collection documents, etc.)\n   ========================================================================== */\n\n.entry {\n  position: relative;\n  margin-bottom: 3em;\n  max-width: 35em;\n}\n\n.entry__title {\n  margin-bottom: 0;\n  font-weight: 700;\n  line-height: 1.25;\n\n  @include breakpoint($md-up) {\n    font-size: ms(2);\n  }\n\n  a::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n  }\n}\n\n.entry__meta {\n  @include margin-bottom(0.5);\n  font-family: $monospace-font;\n  font-size: ms(-2);\n  text-transform: uppercase;\n\n  *:not(:first-child) {\n    &::before {\n      content: ' · ';\n    }\n  }\n}\n\n.entry__image {\n  margin-bottom: 1em;\n}\n\n.entry__excerpt {\n  a {\n    position: relative;\n    z-index: 5;\n  }\n}\n\n.entries__columns {\n  $col-gap: 1em;\n  $width: calc(33.3333% - #{$col-gap});\n\n  .title {\n    margin-bottom: 0.25em;\n    padding-bottom: 0.25em;\n    border-bottom: 2px solid #000;\n    font-size: ms(1, $thread: h);\n\n    @include breakpoint ($xl-up) {\n      font-size: ms(2, $thread: h);\n    }\n  }\n\n  ul {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n\n    @include breakpoint($md-up) {\n      display: flex;\n      flex-wrap: wrap;\n\n      &:after {\n        width: $width;\n      }\n    }\n  }\n\n  li {\n    display: block;\n\n    @include breakpoint($md-up) {\n      margin-right: 1.5 * $col-gap;\n      width: $width;\n\n      // Remove margin in last column\n      &:nth-of-type(3n) {\n        margin-right: 0;\n      }\n\n      // For when there are two items in the last row\n      &:nth-of-type(3n-2):nth-last-of-type(2) {\n        margin-bottom: 0;\n      }\n\n      // For when the last row is complete\n      &:nth-of-type(3n-1):nth-last-of-type(2)\n      &:nth-of-type(3n-2):nth-last-of-type(3) {\n        margin-bottom: 0;\n      }\n    }\n\n    a {\n      border-bottom: 1px solid $border-color;\n      color: inherit;\n      display: flex;\n      justify-content: space-between;\n      padding: 0.25em 0;\n      text-decoration: none;\n    }\n\n    strong {\n      font-family: $alternate-font;\n    }\n\n    .count {\n      color: mix(#fff, $text-color, 25%);\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_forms.scss",
    "content": "/* ==========================================================================\n   Forms\n   ========================================================================== */\n\nform {\n  position: relative;\n  max-width: 100%;\n\n  [type=\"submit\"] {\n    @include margin-top(0.5);\n  }\n}\n\nlabel {\n  display: block;\n  width: 100%;\n  margin-top: 0;\n  @include margin-bottom(0.5);\n  font-family: $monospace-font;\n  font-size: ms(-1);\n}\n\ninput,\ntextarea {\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  margin: 0;\n  padding: 0.75em 0.5em;\n  vertical-align: top;\n  overflow: visible;\n  font-family: $sans-serif-font;\n  font-size: ms(0);\n  background: #f2f2f2;\n  border: 1px solid #f2f2f2;\n  border-radius: 0.25em;\n  -webkit-appearance: none;\n}\n\n.form__group {\n  @include breakpoint($lg-up) {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: row;\n    margin: 0 -0.5em 1em;\n\n    > * {\n      padding-left: 0.5em;\n      padding-right: 0.5em;\n    }\n\n    /* fix reCAPTCHA iframe overflow */\n    &.g-recaptcha > * {\n      margin-left: 0.5em;\n      padding: 0;\n    }\n  }\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput[type=\"search\"] {\n  appearance: none;\n}\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n  display: inline-block;\n  margin-right: 0.5em;\n  width: initial;\n}\n\ninput[type=\"file\"] {\n  width: 100%;\n}\n\nselect {\n  max-width: 100%;\n  width: auto;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_gallery.scss",
    "content": "/* ==========================================================================\n   Gallery\n   ========================================================================== */\n\n.gallery {\n  display: flex;\n  flex-wrap: wrap;\n  list-style-type: none;\n  margin: 0 -8px;\n  @include margin-bottom(1);\n  padding: 0;\n\n  &.columns-3 {\n    .gallery-item {\n      @include breakpoint($md-up) {\n        width: calc(100% / 3 - 16px)\n      }\n    }\n  }\n}\n\n.gallery-item {\n  position: relative;\n  margin: 8px;\n  width: calc(100% / 2 - 16px);\n\n  &.entry {\n    justify-content: start;\n    width: 100%;\n    @include margin-bottom(1);\n\n    .entry__title {\n      @include margin-top(1);\n\n      @include breakpoint($md-up) {\n        font-size: ms(1);\n      }\n    }\n\n    a {\n      display: inline;\n    }\n\n    @include breakpoint($md-up) {\n      width: calc(100% / 2 - 3em);\n\n      &:nth-of-type(odd) {\n        margin-right: 1.5em;\n      }\n\n      &:nth-of-type(even) {\n        margin-left: 1.5em;\n      }\n    }\n  }\n\n  a {\n    display: block;\n    width: 100%;\n  }\n\n  .browser-frame {\n    margin-bottom: 0;\n  }\n}\n\n\n/* 2 Column Gallery */\n\n.gallery-2-col {\n  $col-gap: 0.5em;\n  $width: calc(50% - (0.5 * #{$col-gap}));\n  @include margin-bottom(1);\n\n  @include breakpoint($md-up) {\n    display: flex;\n    flex-wrap: wrap;\n\n    &:after {\n      width: $width;\n    }\n  }\n\n  > * {\n    display: block;\n    margin-bottom: $col-gap;\n\n    @include breakpoint($md-up) {\n      margin-right: $col-gap;\n      width: $width;\n      height: 100%;\n\n      // Remove margin in last column\n      &:nth-of-type(2n) {\n        margin-right: 0;\n      }\n\n      // For when the last row is complete\n      &:nth-of-type(2n-1):nth-last-of-type(2) {\n        margin-bottom: 0;\n      }\n\n      // Creates a fake item that will push against real items in the last row\n      &:after {\n        content: '';\n        display: block;\n        flex: 1 1 auto;\n      }\n    }\n  }\n\n  figcaption {\n    width: 100%;\n    margin-bottom: 0;\n  }\n\n  .browser-frame {\n    margin-bottom: 0;\n  }\n}\n\n/* 3 Column Gallery */\n\n.gallery-3-col {\n  $col-gap: 0.5em;\n  $width: calc(33.3333% - (0.75 * #{$col-gap}));\n  @include margin-bottom(1);\n\n  @include breakpoint($md-up) {\n    display: flex;\n    flex-wrap: wrap;\n\n    &:after {\n      width: $width;\n    }\n  }\n\n  > * {\n    display: block;\n    margin-bottom: $col-gap;\n\n    @include breakpoint($md-up) {\n      margin-right: $col-gap;\n      width: $width;\n\n      // Remove margin in last column\n      &:nth-of-type(3n) {\n        margin-right: 0;\n      }\n\n      // For when there are two items in the last row\n      &:nth-of-type(3n-2):nth-last-of-type(2) {\n        margin-bottom: 0;\n      }\n\n      // For when the last row is complete\n      &:nth-of-type(3n-1):nth-last-of-type(2)\n      &:nth-of-type(3n-2):nth-last-of-type(3) {\n        margin-bottom: 0;\n      }\n    }\n  }\n\n  figcaption {\n    width: 100%;\n    margin-bottom: 0;\n  }\n\n  .browser-frame {\n    margin-bottom: 0;\n  }\n}\n\n// Thumbnail Gallery\n\n.gallery-thumbnails {\n  @include clearfix();\n  padding-left: 0; // reset\n\n  @supports (display: grid) {\n    display: grid;\n    grid-gap: 0.5em;\n    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));\n  }\n\n  li {\n    float: left;\n    list-style: none;\n    margin: 0.25em;\n    width: 100px;\n\n    @supports (display: grid) {\n      margin: 0;\n    }\n\n    a {\n      display: block;\n    }\n\n    img {\n      border-radius: $border-radius;\n      height: auto;\n      min-height: 100px;\n      width: 100%;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_google-search.scss",
    "content": "/* ==========================================================================\n   GOOGLE SEARCH\n   ========================================================================== */\n\n.search-goog {\n  form {\n    margin-top: 12px;\n  }\n}\n\n#goog-fixurl {\n  ul {\n    @include list-unstyled();\n  }\n\n  .other-things {\n    display: none;\n  }\n}\n\n// input field\n#goog-wm-qt {\n  @include breakpoint($md-up) {\n    display: inline-block;\n    width: 70%;\n  }\n}\n\n// submit button\n#goog-wm-sb {\n  background-color: $text-color;\n  color: #fff;\n  font-weight: 700;\n\n  @include breakpoint($md-up) {\n    display: inline-block;\n    margin-left: 1%;\n    width: 29%;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_home.scss",
    "content": "/* ==========================================================================\n   Home\n   ========================================================================== */\n\n.layout__home {\n  .site__header {\n    position: relative;\n  }\n}\n\n.home {\n  @include breakpoint($md-down) {\n    .site__header,\n    .site__footer {\n      margin-left: 5%;\n      margin-right: 5%;\n    }\n  }\n\n  // @include breakpoint($md-up) {\n  //   display: grid;\n  //   grid-template-columns: 2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;\n  //   align-items: end;\n  // }\n\n  // @include breakpoint($lg-up) {\n  //   grid-template-columns: 5% 5% 20% 10% 10% 10% 10% 20% 5% 5%;\n  // }\n\n  .page__content {\n    margin-top: 0;\n\n    @include breakpoint($md-up) {\n      grid-column: 1 / span 10;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_icons.scss",
    "content": "/* ==========================================================================\n   Icons\n   ========================================================================== */\n\n.icon {\n  display: inline-block;\n  fill: currentColor;\n  height: 1em;\n  line-height: 1;\n  position: relative;\n  top: -0.125em; // fine-tune alignment\n  vertical-align: middle;\n  width: 1em;\n\n  &.spin {\n    animation: spin 2s infinite linear;\n  }\n\n  $icons: (\n     (email, #000),\n     (facebook, $facebook-color),\n     (flickr, $flickr-color),\n     (github, $github-color),\n     (googleplus, $google-plus-color),\n     (instagram, $instagram-color),\n     (rss, $rss-color),\n     (twitter, $twitter-color),\n     (youtube, $youtube-color)\n  );\n\n  @each $icon, $color in $icons {\n    &--#{$icon} {\n      fill: $color;\n    }\n  }\n\n  /* icon--arrow-left */\n  &--arrow-left {\n    transform: matrix(-1, 0, 0, 1, 0, 0);\n  }\n}\n\n.emoji {\n  height: 1em;\n  margin: 0;\n  max-height: 20px;\n  max-width: 20px;\n  width: 1em;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_menu.scss",
    "content": "/* ==========================================================================\n   Menu\n   ========================================================================== */\n\n.menu {\n  @include margin-bottom(3);\n  padding-left: 0;\n  list-style: none;\n}\n\n.menu__toggle {\n  display: inline-block;\n  order: -1;\n  margin-right: 1em;\n\n  .toggle {\n    position: relative;\n    z-index: 50;\n    cursor: pointer;\n  }\n\n  .toggle-inner {\n    display: flex;\n    align-items: center;\n  }\n}\n\n.menu__overlay {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  padding-left: 5%;\n  padding-right: 5%;\n  background: #000;\n  color: #fff;\n  pointer-events: none;\n  z-index: 100;\n  visibility: hidden;\n  transition: all 0.4s cubic-bezier(0, 0, 0.2, 1);\n  transform: translateY(-100%);\n  -webkit-overflow-scrolling: touch; // fix momentum scrolling for iOS\n\n  &.is--visible {\n    pointer-events: auto;\n    transform: translateY(0);\n  }\n\n  a {\n    color: #fff;\n    text-decoration: none;\n  }\n}\n\n.menu__overlay-inner {\n  height: 100%;\n  overflow-x: hidden;\n  padding-top: 80px;\n\n  @include breakpoint($lg-up) {\n    padding-left: 3rem;\n    padding-right: 3rem;\n  }\n}\n\n.menu-item {\n  font-family: $sans-serif-font;\n  font-size: ms(2);\n  font-weight: 700;\n  @include line-height(1.5);\n  opacity: 0;\n  transform: translateX(-1rem);\n  transition: all 0.5s;\n\n  @include breakpoint($md-up) {\n    font-size: ms(4);\n    @include line-height(2);\n  }\n\n  &.is--moved {\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  /* line hover effect */\n  a {\n    color: mix($base-color, #fff, 40%);\n    position: relative;\n\n    &::before {\n      background-color: #fff;\n      content: \"\";\n      display: block;\n      height: 1px;\n      left: -3rem;\n      position: absolute;\n      top: 50%;\n      transition: width 0.3s cubic-bezier(0, 0, 0.3, 1);\n      width: 0;\n    }\n\n    &:hover {\n      color: #fff;\n    }\n\n    &:hover::before {\n      width: 2.5rem;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_mixins.scss",
    "content": "@import \"mixins/clearfix\";\n@import \"mixins/color\";\n@import \"mixins/float\";\n@import \"mixins/image\";\n@import \"mixins/lists\";\n@import \"mixins/screen-reader\";\n@import \"mixins/scrim-gradient\";\n@import \"mixins/text-truncate\";\n@import \"mixins/vertical-rhythm\";\n"
  },
  {
    "path": "src/assets/stylesheets/_navicons.scss",
    "content": "/* ==========================================================================\n   Navicons\n   ========================================================================== */\n\n.navicon-button {\n  position: relative;\n  display: inline-block;\n  padding: 0;\n  min-height: $site-image-height;\n  outline: none;\n  border: 0;\n  background-color: transparent;\n  line-height: 5 * $navicon-height;\n  cursor: pointer;\n  transition: $navicon-duration / 2;\n  user-select: none;\n\n  &:focus {\n    outline: none;\n  }\n\n  .navicon::before,\n  .navicon::after {\n    transition-duration: $navicon-duration / 2;\n  }\n\n  &:hover,\n  &:focus {\n    transition-duration: $navicon-duration;\n\n    .navicon::before,\n    .navicon::after {\n      transition-duration: $navicon-duration / 2;\n    }\n\n    .navicon::before,\n    .navicon::after {\n      left: -0.25em;\n    }\n  }\n}\n\n.navicon {\n  position: relative;\n  width: $navicon-width;\n  height: $navicon-height;\n  background: $navicon-content-bg;\n  transition-duration: $navicon-duration;\n\n  &::before,\n  &::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    display: block;\n    width: $navicon-width;\n    height: $navicon-height;\n    background: $navicon-content-bg;\n    transition-duration: $navicon-duration $navicon-duration / 2;\n  }\n\n  &::before {\n    top: (2 * $navicon-height);\n  }\n  &::after {\n    top: (-2 * $navicon-height);\n  }\n}\n\n.open:not(.steps) .navicon::before,\n.open:not(.steps) .navicon::after {\n  top: 0 !important;\n}\n\n.open {\n  transform: scale($navicon-toggled-size);\n\n  .navicon::before,\n  .navicon::after {\n    transition-duration: $navicon-duration;\n  }\n\n  /* × */\n  .x .navicon {\n    background: transparent;\n\n    &::before,\n    &::after {\n      background: #fff;\n    }\n\n    &::before { transform: rotate(-45deg); }\n    &::after { transform: rotate(45deg); }\n  }\n\n  .navicon::before,\n  .navicon::after {\n    left: 0;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_navigation.scss",
    "content": "/* ==========================================================================\n   Navigation\n   ========================================================================== */\n\n/*\n   Skip links\n   ========================================================================== */\n\n.skip-links {\n  position: absolute;\n  width: 100%;\n\n  ul {\n    @include list-unstyled;\n  }\n}\n\n.back-to-top {\n  display: block;\n  @include margin-top(2);\n  font-family: $monospace-font;\n  font-size: ms(-1);\n}\n\n/*\n   Breadcrumbs\n   ========================================================================== */\n\n.breadcrumbs {\n  display: flex;\n\n  @include breakpoint($md-up) {\n    flex-direction: column;\n  }\n\n  .breadcrumb {\n    @include breakpoint($md-up) {\n      border-left: 2px solid #000;\n    }\n\n    &:first-child {\n      border-left: 2px solid #000;\n    }\n\n    &:not(:first-child) {\n      @include breakpoint($md-down) {\n        padding-left: 0.25em;\n        border-left-width: 0;\n      }\n\n      @include breakpoint($md-up) {\n        margin-left: 2em;\n      }\n    }\n\n    a {\n      position: relative;\n      display: block;\n\n      &:before {\n        position: absolute;\n        display: block;\n        content: '';\n        top: 50%;\n        width: 1rem;\n        height: 2px;\n        background-color: #000;\n      }\n\n      &:after {\n        position: absolute;\n        display: block;\n        content: '';\n        left: -2px;\n        bottom: 0;\n        width: calc(1rem + 2px);\n        height: calc(50% - 2px);\n        background-color: #fff;\n      }\n    }\n\n    span {\n      padding-left: 1.25rem;\n    }\n  }\n}\n\nspan + .breadcrumbs {\n  @include margin-top(0.75);\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_notices.scss",
    "content": "/* ==========================================================================\n   NOTICE TEXT BLOCKS\n   ========================================================================== */\n\n.notice {\n  position: relative;\n  min-height: 1em;\n  @include margin-top(1);\n  @include margin-bottom(1);\n  padding: 1em 1.5em 1.5em;\n  border: 2px solid;\n  box-shadow: 0.25em 0.25em 0 #000;\n\n  &.info {\n    color: $info-color;\n    box-shadow: 0.25em 0.25em 0 $info-color;\n  }\n\n  &.warning {\n    color: $warning-color;\n    box-shadow: 0.25em 0.25em 0 $warning-color;\n  }\n\n  &.danger {\n    color: $danger-color;\n    box-shadow: 0.25em 0.25em 0 $danger-color;\n  }\n\n  &.success {\n    color: $success-color;\n    box-shadow: 0.25em 0.25em 0 $success-color;\n  }\n}\n\n.notice > {\n  h2, h3, h4, h5, h6 {\n    display: block;\n    margin-bottom: 1.25em;\n    padding-bottom: 0.25em;\n    border-bottom: 2px solid;\n    font-family: $monospace-font;\n    font-size: ms(0);\n  }\n}\n\n.notice:first-child {\n  margin-top: 0;\n}\n\n.notice:last-child {\n  margin-bottom: 0;\n}\n\n.notice p {\n  margin: 0.75em 0;\n}\n\n.notice p:first-child {\n  margin-top: 0;\n}\n\n.notice p:last-child {\n  margin-bottom: 0;\n}\n\n.notice ul {\n  text-align: left;\n  padding: 0;\n  opacity: 0.85;\n  list-style-position: inside;\n  margin: 0.5em 0 0;\n}\n\n.notice ul:first-child {\n  margin-top: 0;\n}\n\n.notice ul:last-child {\n  margin-bottom: 0;\n}\n\n.notice ul li {\n  position: relative;\n  list-style-type: none;\n  margin: 0 0 0.3em 1em;\n  padding: 0;\n}\n\n.notice ul li::before {\n  position: absolute;\n  content: \"•\";\n  left: -1em;\n  height: 100%;\n  vertical-align: baseline;\n}\n\n.notice ul li:last-child {\n  margin-bottom: 0;\n}\n\n.notice > :first-child {\n  margin-top: 0;\n}\n\n.notice > :last-child {\n  margin-bottom: 0;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_page.scss",
    "content": "/* ==========================================================================\n   Page\n   ========================================================================== */\n\n.page {\n  @include breakpoint($md-down) {\n    margin-left: 5vw;\n    margin-right: 5vw;\n  }\n\n  @include breakpoint($md-up) {\n    display: grid;\n    grid-template-columns: 2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;\n    grid-template-rows: 80px auto auto;\n    align-items: end;\n  }\n\n  @include breakpoint($xl-up) {\n    grid-template-columns: 5% 5% 20% 10% 10% 10% 10% 20% 5% 5%;\n  }\n}\n\n.page__title {\n  @include breakpoint($md-up) {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    align-self: end;\n    grid-column: 2 / span 4;\n    grid-row: 2 / 3;\n    margin-top: 0;\n    z-index: 10;\n  }\n\n  @include breakpoint($lg-up) {\n    grid-column : 2 / span 3;\n  }\n\n  .heading {\n    position: relative;\n    @include margin-top(3);\n    @include margin-bottom(0.5);\n    align-self: flex-start;\n    width: 100%;\n    color: #fff;\n    font-family: $alternate-font;\n    font-weight: 700;\n    font-size: ms(2);\n    font-variant-ligatures: common-ligatures;\n    font-feature-settings: \"kern\" on, \"liga\" on, \"clig\" on, \"calt\" on;\n    line-height: 1.25;\n    z-index: 99;\n\n    @include breakpoint($md-up) {\n      padding-right: 5%;\n      font-size: ms(3);\n    }\n\n    @include breakpoint ($lg-up) {\n      font-size: ms(4);\n    }\n\n    span {\n      padding: 0 0.5em;\n      line-height: 1.5;\n      box-decoration-break: clone;\n      background-color: #000;\n    }\n  }\n}\n\n.page__meta {\n  font-family: $monospace-font;\n  font-size: ms(-2);\n\n  @include breakpoint($md-up) {\n    grid-column: 3 / span 2;\n    grid-row: 3 / span 1;\n    align-self: start;\n\n    &:not(:empty) {\n      @include margin-top(1);\n      @include margin-bottom(1);\n    }\n\n    span {\n      display: block;\n    }\n  }\n\n  @include breakpoint($lg-up) {\n    grid-column: 3 / 4;\n  }\n\n  .page__work {\n    @include breakpoint($md-down) {\n      &::after {\n        content: ' · ';\n      }\n    }\n  }\n\n  .page__read-time {\n    @include breakpoint($md-down) {\n      &::before {\n        content: ' · ';\n      }\n    }\n  }\n\n  .page__author {\n    @include breakpoint($md-down) {\n      display: none;\n    }\n\n    .name {\n      &::before {\n        content: \"by \";\n      }\n    }\n  }\n}\n\n.page__cover {\n  @include margin-top(0.5);\n\n  @include breakpoint($md-down) {\n    margin-left: -5vw;\n    margin-right: -5vw;\n  }\n\n  @include breakpoint($md-up) {\n    grid-column: 5 / 11;\n    grid-row: 1 / 4;\n    margin-top: 0;\n    object-fit: cover;\n    object-position: center center;\n    width: 100%;\n    height: 100%;\n  }\n  @include breakpoint($lg-up) {\n    grid-column: 4 / 11;\n  }\n}\n\n.page__content {\n\n  @include breakpoint($md-up) {\n    grid-column: 3 / 7;\n    grid-row: 4 / span 1;\n    align-self: flex-start;\n    @include margin-top(2);\n  }\n\n  > h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    @include margin-top(2);\n    @include margin-bottom(1);\n  }\n\n  > h2,\n  h3 {\n    letter-spacing: -0.02em;\n  }\n\n  > h2 {\n    + h2,\n    + h3,\n    + h4,\n    + h5 {\n      margin-top: 0;\n    }\n  }\n\n  p {\n    max-width: 35em;\n  }\n\n  > p:first-child {\n    @include margin-top(1);\n  }\n}\n\n.page__comments {\n  .title {\n    @include margin-top(3);\n  }\n}\n\n.page__comments-count {\n  @include breakpoint($md-down) {\n    &::before {\n      content: ' · ';\n    }\n  }\n}\n\n.page__aside {\n  @include breakpoint($md-up) {\n    grid-column: 8;\n    grid-row: 4;\n    align-self: start;\n    @include margin-top(2);\n\n    @supports (position: sticky) {\n      position: sticky;\n      top: 1em;\n    }\n  }\n\n  > * {\n    @include margin-top(1);\n  }\n\n  ul {\n    @include breakpoint($md-down) {\n      padding-left: 0.75em;\n    }\n  }\n\n  li {\n    font-family: $monospace-font;\n    font-size: ms(-1);\n    @include line-height(1);\n  }\n\n  .title {\n    margin-top: 0;\n    margin-right: 0.5rem;\n    margin-bottom: 0;\n    padding: 0;\n    font-size: ms(0);\n  }\n}\n\n.page__toc {\n  @include breakpoint($md-down) {\n    display: none;\n  }\n}\n\n.page__taxonomy {\n  .title {\n    @include breakpoint($md-down) {\n      display: inline;\n    }\n  }\n\n  span {\n    display: inline-block;\n    margin-right: 1rem;\n    font-family: $monospace-font;\n    font-size: ms(-1);\n    @include line-height(1);\n\n    @include breakpoint($md-up) {\n      display: block;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_pagination.scss",
    "content": "/* ==========================================================================\n   Pagination\n   ========================================================================== */\n\n.pagination {\n  max-width: 35em;\n\n  ul {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n    list-style: none;\n    padding: 0;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_paper-color-swatches.scss",
    "content": "/* ==========================================================================\n   PAPER COLOR PALETTE SWATCHES\n   ========================================================================== */\n\n.palette {\n  background: #171716 url(\"../images/paper-53-palette-bk.png\");\n  border-radius: 10px;\n  margin-bottom: 1em;\n  width: 100%;\n\n  &__row {\n    padding: 0.25em 0;\n    text-align: center;\n    width: 100%;\n\n    a {\n      margin: 0.25em;\n    }\n  }\n\n  /* spacing above and below rows */\n  div:first-child {\n    padding-top: 1em;\n  }\n\n  div:last-child {\n    padding-bottom: 1em;\n  }\n\n  &__swatch {\n    border-radius: 50%;\n    border: 3px solid #000;\n    height: 60px;\n    margin: 0 auto;\n    width: 60px;\n\n    @include breakpoint($md-up) {\n      height: 110px;\n      width: 110px;\n    }\n\n    &:hover {\n      border: 3px solid #fff;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_post.scss",
    "content": "/* ==========================================================================\n   Post\n   ========================================================================== */\n\n.post {\n  @include breakpoint($md-down) {\n    margin-left: 5vw;\n    margin-right: 5vw;\n  }\n\n  @include breakpoint($md-up) {\n    display: grid;\n    grid-template-columns: 2% 3% 25% 10% 10% 10% 10% 25% 3% 2%;\n    grid-template-rows: 80px auto auto;\n    align-items: end;\n  }\n\n  @include breakpoint($xl-up) {\n    grid-template-columns: 5% 5% 20% 10% 10% 10% 10% 20% 5% 5%;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_print.scss",
    "content": "/* ==========================================================================\n   PRINT STYLES\n   ========================================================================== */\n\n@media print {\n  [hidden] {\n    display: none;\n  }\n\n  * {\n    box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    -webkit-box-sizing: border-box;\n  }\n\n  html {\n    font-size: 16px;\n    margin: 0;\n    padding: 0;\n  }\n\n  body {\n    background: #fff !important;\n    color: #000 !important;\n    font-size: 1rem;\n    line-height: 1.5;\n    margin: 0 auto;\n    text-rendering: optimizeLegibility;\n    -moz-osx-font-smoothing: grayscale;\n    -webkit-font-smoothing: antialiased;\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    color: #000;\n    line-height: 1.2;\n    margin-bottom: 0.75rem;\n    margin-top: 0;\n  }\n\n  h1 {\n    font-size: 2.5rem;\n  }\n\n  h2 {\n    font-size: 2rem;\n  }\n\n  h3 {\n    font-size: 1.75rem;\n  }\n\n  h4 {\n    font-size: 1.5rem;\n  }\n\n  h5 {\n    font-size: 1.25rem;\n  }\n\n  h6 {\n    font-size: 1rem;\n  }\n\n  a {\n    background: none;\n    color: #000;\n    text-decoration: underline;\n    word-wrap: break-word;\n  }\n\n  table {\n    border-collapse: collapse;\n  }\n\n  thead {\n    display: table-header-group;\n  }\n\n  table,\n  th,\n  td {\n    border-bottom: 1px solid #000;\n  }\n\n  td,\n  th {\n    padding: 8px 16px;\n  }\n\n  img {\n    border: 0;\n    display: block;\n    max-width: 100% !important;\n  }\n\n  hr {\n    border: 0;\n    border-bottom: 2px solid #bbb;\n    height: 0;\n    margin: 2.25rem 0;\n    padding: 0;\n  }\n\n  dt {\n    font-weight: bold;\n  }\n\n  dd {\n    margin: 0;\n    margin-bottom: 0.75rem;\n  }\n\n  abbr[title],\n  acronym[title] {\n    border: 0;\n    text-decoration: none;\n  }\n\n  table,\n  blockquote,\n  pre,\n  code,\n  figure,\n  li,\n  hr,\n  ul,\n  ol,\n  a,\n  tr {\n    page-break-inside: avoid;\n  }\n\n  h2,\n  h3,\n  h4,\n  p,\n  a {\n    orphans: 3;\n    widows: 3;\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    page-break-after: avoid;\n    page-break-inside: avoid;\n  }\n\n  h1 + p,\n  h2 + p,\n  h3 + p {\n    page-break-before: avoid;\n  }\n\n  img {\n    page-break-after: auto;\n    page-break-before: auto;\n    page-break-inside: avoid;\n  }\n\n  pre {\n    white-space: pre-wrap !important;\n    word-wrap: break-word;\n  }\n\n  a[href^=\"http://\"]::after,\n  a[href^=\"https://\"]::after,\n  a[href^=\"ftp://\"]::after {\n    content: \" (\" attr(href) \")\";\n    font-size: 80%;\n  }\n\n  abbr[title]::after,\n  acronym[title]::after {\n    content: \" (\" attr(title) \")\";\n  }\n\n  .page-break,\n  .page-break-before {\n    page-break-before: always;\n  }\n\n  .page-break-after {\n    page-break-after: always;\n  }\n\n  .no-print {\n    display: none;\n  }\n\n  a.no-reformat::after {\n    content: \"\";\n  }\n\n  abbr[title].no-reformat::after,\n  acronym[title].no-reformat::after {\n    content: \"\";\n  }\n\n  .btn {\n    background: none;\n    color: #000;\n  }\n\n  /*\n   Hide the following elements on print\n   ========================================================================== */\n\n  .menu__toggle,\n  .pager,\n  .site__footer,\n  .adsbygoogle,\n  #respond {\n    display: none !important;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_reset.scss",
    "content": "/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */\n\n/**\n * 1. Change the default font family in all browsers (opinionated).\n * 2. Prevent adjustments of font size after orientation changes in\n *    IE on Windows Phone and in iOS.\n */\n\n/* Document\n   ========================================================================== */\n\nhtml {\n  font-family: $serif-font; /* 1 */\n  box-sizing: border-box;\n  -ms-text-size-adjust: 100%; /* 2 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n*,\n*::before,\n*::after {\n  box-sizing: inherit;\n}\n\n/* Sections\n   ========================================================================== */\n\n/**\n * Remove the margin in all browsers (opinionated).\n */\n\nbody {\n  margin: 0;\n  line-height: 1.55;\n}\n\n/**\n * Add the correct display in IE 9-.\n */\n\narticle,\naside,\nfooter,\nheader,\nnav,\nsection {\n  display: block;\n}\n\n/**\n * Remove margin padding.\n *\n */\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\npre,\nblockquote,\ndl,\ntable,\naddress {\n  margin-top: 0;\n  @include margin-bottom(1);\n}\n\n/**\n * Adjust heading line-height\n *\n */\n\nh1,\nh2,\nh3,\nh4 {\n  line-height: 1.2;\n}\n\n/* Grouping content\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n * 1. Add the correct display in IE.\n */\n\nfigcaption,\nfigure,\nmain {\n  /* 1 */\n  display: block;\n}\n\n/**\n * Reset the margins.\n */\n\nfigure {\n  @include margin-top(1);\n  @include margin-bottom(1);\n  margin-right: 0;\n  margin-left: 0;\n}\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n  margin: 2em 0;\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n  box-sizing: content-box; /* 1 */\n  border: 1px solid $text-color;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n * 3. Add scrollbars to wide code blocks.\n */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n  overflow-x: auto; /* 3 */\n}\n\n/* Text-level semantics\n   ========================================================================== */\n\n/**\n * 1. Remove the gray background on active links in IE 10.\n * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.\n */\n\na {\n  background-color: transparent; /* 1 */\n  -webkit-text-decoration-skip: objects; /* 2 */\n}\n\n/**\n * Remove the outline on focused links when they are also active or hovered\n * in all browsers (opinionated).\n */\n\na:active,\na:hover {\n  outline-width: 0;\n}\n\nabbr[title] {\n  text-decoration: none;\n  border-bottom: 1px dotted currentColor;\n}\n\n/**\n * Prevent the duplicate application of `bolder` by the next rule in Safari 6.\n */\n\nb,\nstrong {\n  font-weight: inherit;\n  font-weight: bolder; /* Add the correct font weight in Chrome, Edge, and Safari. */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font style in Android 4.3-.\n */\n\ndfn {\n  font-style: italic;\n}\n\n/**\n * Add the correct background and color in IE 9-.\n */\n\nmark {\n  background-color: #ff0;\n  color: #000;\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n * Change the margin and padding and add a line rule on the left-side in all\n * browsers (opinionated).\n */\n\nblockquote {\n  margin-right: 0;\n  margin-left: 0;\n  padding: 0 1rem;\n  border-left: solid 0.25rem;\n\n  *:last-child {\n    margin-bottom: 0;\n  }\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n  position: relative;\n  font-size: 75%;\n  line-height: 0;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/**\n * Remove margin\n */\n\nul,\nol {\n  margin-top: 0;\n}\n\n/* Embedded content\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n */\n\naudio,\nvideo {\n  display: inline-block;\n}\n\n/**\n * Add the correct display in iOS 4-7.\n */\n\naudio:not([controls]) {\n  display: none;\n  height: 0;\n}\n\nimg {\n  /* Responsive images (ensure images don't scale beyond their parents) */\n  max-width: 100%; /* part 1: Set a maximum relative to the parent*/\n  width: auto\\9; /* IE7-8 need help adjusting responsive images*/\n  height: auto; /* part 2: Scale the height according to the width, otherwise you get stretching*/\n\n  border-style: none; /* Remove the border on images inside links in IE 10-.*/\n\n  vertical-align: middle;\n  -ms-interpolation-mode: bicubic;\n}\n\n/**\n * Hide the overflow in IE.\n */\n\nsvg:not(:root) {\n  overflow: hidden;\n}\n\n/* Forms\n   ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers (opinionated).\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  margin: 0; /* 2 */\n  font-family: $serif-font; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput {\n  /* 1 */\n  overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect {\n  /* 1 */\n  text-transform: none;\n}\n\n/**\n * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`\n *    controls in Android 4.\n * 2. Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\nhtml [type=\"button\"],\n/* 1 */ [type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button; /* 2 */\n  cursor: pointer;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  padding: 0;\n  border-style: none;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n * Change the border, margin, and padding in all browsers (opinionated).\n */\n\nfieldset {\n  margin: 0 2px;\n  padding: 0.35em 0.625em 0.75em;\n  border: 1px solid #c0c0c0;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n *    `fieldset` elements in all browsers.\n */\n\nlegend {\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  color: inherit; /* 2 */\n  white-space: normal; /* 1 */\n  box-sizing: border-box; /* 1 */\n}\n\n/**\n * 1. Add the correct display in IE 9-.\n * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n  display: inline-block; /* 1 */\n  vertical-align: baseline; /* 2 */\n}\n\n/**\n * Remove the default vertical scrollbar in IE.\n */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10-.\n * 2. Remove the padding in IE 10-.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  padding: 0; /* 2 */\n  box-sizing: border-box; /* 1 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n  outline-offset: -2px; /* 2 */\n  -webkit-appearance: textfield; /* 1 */\n}\n\n/**\n * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-cancel-button,\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n  font: inherit; /* 2 */\n  -webkit-appearance: button; /* 1 */\n}\n\n/* Interactive\n   ========================================================================== */\n\n/*\n * Add the correct display in IE 9-.\n * 1. Add the correct display in Edge, IE, and Firefox.\n */\n\ndetails,\n/* 1 */ menu {\n  display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n  display: list-item;\n}\n\n/* Scripting\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n */\n\ncanvas {\n  display: inline-block;\n}\n\n/**\n * Add the correct display in IE.\n */\n\ntemplate {\n  display: none;\n}\n\n/* Hidden\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 10-.\n */\n\n[hidden] {\n  display: none;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_responsive-embed.scss",
    "content": "/* ==========================================================================\n   Responsive Embed\n   Credit: Nicolas Gallagher and SUIT CSS.\n\n   <!-- 16:9 aspect ratio -->\n   <div class=\"embed-responsive embed-responsive-16by9\">\n     <iframe class=\"embed-responsive-item\" src=\"...\"></iframe>\n   </div>\n\n   <!-- 4:3 aspect ratio -->\n   <div class=\"embed-responsive embed-responsive-4by3\">\n     <iframe class=\"embed-responsive-item\" src=\"...\"></iframe>\n   </div>\n   ========================================================================== */\n\n.embed-responsive {\n  display: block;\n  margin-bottom: 1.5rem;\n  overflow: hidden;\n  padding: 0;\n  position: relative;\n  width: 100%;\n\n  &::before {\n    content: \"\";\n    display: block;\n  }\n\n  .embed-responsive-item,\n  iframe,\n  embed,\n  object,\n  video {\n    border: 0;\n    bottom: 0;\n    height: 100%;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n}\n\n.embed-responsive-21by9 {\n  &::before {\n    padding-top: percentage(9 / 21);\n  }\n}\n\n.embed-responsive-16by9 {\n  &::before {\n    padding-top: percentage(9 / 16);\n  }\n}\n\n.embed-responsive-4by3 {\n  &::before {\n    padding-top: percentage(3 / 4);\n  }\n}\n\n.embed-responsive-1by1 {\n  &::before {\n    padding-top: percentage(1 / 1);\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_review-box.scss",
    "content": "/* ==========================================================================\n   REVIEW BOXES\n   ========================================================================== */\n\n.review__wrapper {\n  background-color: $text-color;\n  border-radius: $border-radius;\n  color: #fff;\n  margin-bottom: 1.5rem;\n  padding: 20px;\n  position: relative;\n\n  a {\n    color: $text-color;\n  }\n}\n\nh5.review__title {\n  color: #fff;\n  font-size: ms(1);\n  font-weight: bold;\n  margin: 0;\n}\n\n.review__title-summary {\n  font-size: ms(1);\n  font-weight: bold;\n}\n\n.review__list {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  li {\n    border-bottom: 1px solid #fff;\n    display: flex;\n    font-weight: bold;\n    justify-content: space-between;\n    list-style: none;\n    margin: 0;\n    padding: 10px 0;\n  }\n}\n\n.review__description {\n  a {\n    color: #fff;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_search.scss",
    "content": "/* ==========================================================================\n   SEARCH\n   ========================================================================== */\n\n.search-searchbar {\n  @include margin-top(1);\n  @include margin-bottom(1);\n}\n\n/* Algolia search */\n\n.ais-search-box--input {\n  font-family: $sans-serif-font;\n  font-size: ms(0);\n}\n\n.ais-Highlight {\n  color: $accent-color;\n  background-color: mix(#fff, $accent-color, 90%);\n  font-style: normal;\n}\n\n.ais-hits--item {\n  p {\n    max-width: 35em;\n  }\n\n  :not(pre) > code {\n    background-color: #111;\n  }\n}\n\n.ais-search-box--powered-by-link {\n  // unset SVG background image\n  display: inline;\n  text-indent: initial;\n  overflow: hidden;\n  vertical-align: initial;\n  color: #fff;\n  background-image: none;\n\n  &:hover {\n    text-decoration: underline;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_sections.scss",
    "content": "/* ==========================================================================\n   Sections\n   ========================================================================== */\n\n.sections {\n  margin-bottom: 2rem;\n}\n\n.section {\n  background-color: $section-bg-color;\n\n  .inner {\n    max-width: 80%;\n    padding: 10% 0 10% 5%;\n\n    @include breakpoint($md-up) {\n      max-width: 60%;\n      padding: 5% 0 5% 5%;\n    }\n\n    @include breakpoint($lg-up) {\n      max-width: 50%;\n      padding-left: 10%;\n    }\n  }\n\n  .btn {\n    background-color: $text-color;\n    color: #fff !important;\n\n    &:hover {\n      background-color: mix(#fff, $text-color, 10%);\n    }\n  }\n}\n\n.section__text {\n  /* remove space after last child element */\n  > *:last-child {\n    margin-bottom: 0;\n  }\n\n  /* text links */\n  a:not(.btn) {\n    border-bottom: 1px dotted currentColor;\n    color: currentColor;\n    text-decoration: none;\n\n    &:hover {\n      border-bottom-style: solid;\n    }\n  }\n}\n\n.section__title {\n  .heading {\n    margin-top: 0;\n    @include margin-bottom(1);\n    color: #fff;\n    font-family: $alternate-font;\n    font-weight: 700;\n    font-size: ms(3);\n    font-variant-ligatures: common-ligatures;\n    font-feature-settings: \"kern\" on, \"liga\" on, \"clig\" on, \"calt\" on;\n    line-height: 1.25;\n\n    @include breakpoint($md-up) {\n      padding-right: 5%;\n    }\n\n    @include breakpoint ($lg-up) {\n      font-size: ms(4);\n    }\n\n    span {\n      padding: 0 0.5em;\n      line-height: 1.5;\n      box-decoration-break: clone;\n      background-color: #000;\n    }\n  }\n}\n\n.section__actions {\n  @include list-unstyled;\n\n  li {\n    display: inline-block;\n  }\n}\n\n.section__more {\n  @include breakpoint($lg-up) {\n    font-size: ms(1);\n  }\n}\n\n/*\n   Section specific\n   ========================================================================== */\n\n.section {\n  &__inverse {\n    background-color: $section-dark-bg-color;\n    color: #fff;\n    position: relative;\n\n    .inner {\n      position: relative;\n      z-index: 1; /* fix overlap with scrimgradient */\n    }\n\n    .section__image {\n      background-position: center;\n      background-repeat: no-repeat;\n      background-size: cover;\n      height: 100%;\n      position: absolute;\n      width: 100%;\n\n      &::before {\n        @include scrimgradient(\"to right\", $section-dark-bg-color);\n        content: \"\";\n        height: 100%;\n        left: 0;\n        position: absolute;\n        top: 0;\n        width: 100%;\n      }\n    }\n\n    .section__title,\n    .section__more {\n      text-shadow: 1px 01px 1px rgba($section-dark-bg-color, 0.75);\n    }\n\n    .btn {\n      background-color: #fff;\n      color: $section-dark-bg-color !important;\n\n      &:hover {\n        background-color: mix($section-dark-bg-color, #fff, 10%);\n      }\n    }\n  }\n\n  &__about {\n    background-color: $section-about-bg-color;\n\n    .section__image {\n      &::before {\n        @include scrimgradient(\"to right\", $section-about-bg-color);\n      }\n    }\n\n    .section__title,\n    .section__more {\n      text-shadow: 1px 01px 1px rgba($section-about-bg-color, 0.75);\n    }\n\n    .btn {\n      color: $section-about-bg-color !important;\n\n      &:hover {\n        background-color: mix($section-about-bg-color, #fff, 10%);\n      }\n    }\n  }\n\n  &__work {\n    background-color: $section-work-bg-color;\n\n    .section__image {\n\n      &::before {\n        @include scrimgradient(\"to right\", $section-work-bg-color);\n      }\n    }\n\n\n    .section__title,\n    .section__more {\n      text-shadow: 1px 1px 1px rgba($section-work-bg-color, 0.75);\n    }\n\n    .btn {\n      color: $section-work-bg-color !important;\n\n      &:hover {\n        background-color: mix($section-work-bg-color, #fff, 10%);\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_site.scss",
    "content": "/* ==========================================================================\n   Site\n   ========================================================================== */\n\n.site__header {\n  position: relative;\n  display: flex;\n  align-items: center;\n  @include margin-top(1);\n  @include margin-bottom(1);\n  margin-left: 5%;\n  font-family: $monospace-font;\n  z-index: 150;\n\n  @include breakpoint($md-up) {\n    // grid-column: 3 / 5;\n    // grid-row: 1;\n    // align-self: start;\n    position: absolute;\n  }\n\n  @include breakpoint($lg-up) {\n    // grid-column: 3;\n    margin-left: 10%;\n  }\n}\n\n.site__name {\n  display: inline-block;\n  margin: 0;\n  height: 25px;\n  color: #000;\n  font-family: $alternate-font;\n  font-size: ms(0);\n  font-weight: 700;\n  @include line-height(1);\n  text-transform: uppercase;\n\n  a {\n    color: inherit;\n    text-decoration: none;\n  }\n}\n\n.is--inverted .site__name {\n  color: #fff;\n}\n\n.site__footer {\n  @include margin-top(2);\n  @include margin-bottom(1);\n  margin-left: 5%;\n  margin-right: 5%;\n  color: mix(#fff, $text-color, 40%);\n  font-size: ms(-1);\n\n  @include breakpoint($md-up) {\n    // grid-column: 3 / 8;\n    // grid-row: 7 / span 1;\n    // align-self: center;\n\n    .icon__label {\n      display: none;\n    }\n  }\n\n  @include breakpoint($lg-up) {\n    margin-left: 10%;\n    margin-right: 10%;\n  }\n\n  a {\n    color: inherit;\n    white-space: nowrap;\n  }\n\n  .menu {\n    display: flex;\n    flex-flow: row wrap;\n    margin-bottom: 0;\n    font-family: $sans-serif-font;\n    font-weight: 400;\n    @include list-unstyled();\n\n    li {\n      flex-basis: 50%;\n\n      @include breakpoint($md-up) {\n        flex-basis: auto;\n      }\n\n      &:not(:last-child) {\n        a {\n          @include breakpoint($md-up) {\n            margin-right: 1em;\n          }\n        }\n      }\n\n      a {\n        display: block;\n        margin-bottom: 0;\n\n        @include breakpoint($md-down) {\n          padding: 0.5em 0.5em 0.5em 0;\n        }\n\n        &:hover {\n          text-decoration: underline;\n        }\n      }\n    }\n  }\n\n  .copyright {\n    @include margin-top(0.25);\n    font-family: $monospace-font;\n    font-size: ms(-1);\n\n    p {\n      margin-bottom: 0;\n    }\n\n    a + a {\n      margin-left: 1em;\n    }\n  }\n}\n\n\n.bigfoot-footnote__button {\n  font-family: $monospace-font;\n}\n\n.bigfoot-footnote__content {\n  line-height: 1.625; // match body line-height\n}\n\n.image__outer-wrapper {\n  width: 100%;\n  height: 100%;\n}\n\n.image__wrapper {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  background-color: #eaeaea;\n\n  img {\n    transition: opacity 0.5s ease 0.25s;\n\n    @include breakpoint($md-up) {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n      object-position: center center;\n    }\n\n  }\n}\n\n.image__aspect-ratio {\n  display: none;\n\n  @include breakpoint($md-up) {\n    display: block;\n    content: '';\n    width: 100%;\n    padding-top: (3 / 4) * 100%;\n  }\n}\n\n.image__caption {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  padding: 0.5em 1em;\n  color: #fff;\n  font-size: ms(-3);\n  line-height: 1;\n  text-align: right;\n  background: rgba(0, 0, 0, 0.7);\n\n  a {\n    color: inherit;\n    text-decoration: none;\n  }\n}\n\n.custom-object-fit {\n  position: relative;\n  background-size: cover;\n  background-position: center center;\n\n  .image__outer-wrapper {\n    opacity: 0;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_style-guide.scss",
    "content": "/* ==========================================================================\n   WEBSITE STYLE GUIDE\n   ========================================================================== */\n\n.component {\n  background-color: #fff;\n  border-radius: $border-radius;\n  border: 1px solid $border-color;\n  margin-bottom: 1em;\n  padding: 1em;\n\n  div.highlighter-rouge,\n  figure.highlight {\n    margin: 0;\n    padding: 1em;\n  }\n}\n\n.component__header {\n  h3 {\n    margin-top: 0 !important;\n  }\n\n  p {\n    font-size: ms(-1);\n    margin-top: 0;\n\n    a {\n      border-bottom-width: 0;\n    }\n\n    &.entry--last {\n      margin-bottom: 1em;\n    }\n  }\n}\n\n.component__rendered {\n  &--color {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n\n    @include breakpoint($md-up) {\n      flex-wrap: nowrap;\n    }\n  }\n}\n\n.component__code {\n  clear: both;\n  padding-top: 3em;\n  position: relative;\n\n  &:before {\n    content: \"HTML\";\n    font-size: ms(-1);\n    font-weight: bold;\n    position: absolute;\n    text-transform: uppercase;\n    top: 1.5em;\n  }\n}\n\n/*\n   Color swatches\n   ========================================================================== */\n\n.color__tile {\n  align-items: center;\n  border-radius: $border-radius;\n  border: 1px solid $border-color;\n  display: flex;\n  height: 100px;\n  justify-content: center;\n  margin-bottom: 1%;\n  margin-top: 1%;\n  text-align: center;\n  width: 98%;\n}\n\n.color__name {\n  background-color: #e3e3e3;\n  color: $text-color;\n  font-size: ms(-2);\n  margin: 0 2px;\n  padding: 0 5px;\n  white-space: normal;\n  white-space: nowrap;\n}\n\n/*\n   Background colors\n   ========================================================================== */\n\n$color: (white-bg, #fff),  (black-bg, #000),  (background, $background-color),\n   (text, $text-color),  (accent, $accent-color),  (primary, $primary-color),\n   (success, $success-color),  (warning, $warning-color),\n   (danger, $danger-color),  (info, $info-color),  (border, $border-color),\n   (facebook, $facebook-color),  (flickr, $flickr-color),\n   (github, $github-color),  (google-plus, $google-plus-color),\n   (instagram, $instagram-color),  (rss, $rss-color),  (twitter, $twitter-color),\n   (youtube, $youtube-color);\n\n@each $name, $bgcolor in $color {\n  .color__tile--#{$name} {\n    background-color: $bgcolor;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_syntax-highlighting.scss",
    "content": "/* ==========================================================================\n   Syntax highlighting\n   ========================================================================== */\n\n:not(pre) > code {\n  padding: 0.125em 0.25em;\n  color: inherit;\n  background: #f2f2f2;\n  border-radius: 0.125em;\n  white-space: normal;\n  font-size: ms(-1);\n}\n\ndiv.highlighter-rouge,\nfigure.highlight {\n  position: relative;\n  margin-left: -5vw;\n  margin-right: -5vw;\n  @include margin-bottom(1);\n  padding: 1em 5%;\n  color: $base05;\n  background: $base00;\n  font-family: $monospace-font;\n  font-size: ms(-1);\n\n  @include breakpoint($md-up) {\n    margin-left: 0;\n    margin-right: 0;\n    padding-left: 1em;\n    padding-right: 1em;\n  }\n\n  > pre,\n  pre.highlight {\n    margin: 0;\n  }\n}\n\n.highlight table {\n  margin-bottom: 0;\n  border: 0;\n  font-size: ms(0);\n\n  td {\n    width: calc(100% - 1em);\n    border: 0;\n    padding: 0;\n\n    /* line numbers*/\n    &.gutter {\n      padding-right: 1em;\n      width: 1em;\n      border-right: 1px solid $base04;\n      color: $base04;\n      text-align: right;\n    }\n\n    /* code */\n    &.code {\n      padding-left: 1em;\n    }\n  }\n\n  pre {\n    margin: 0;\n  }\n}\n\n.highlight pre {\n  width: 100%;\n  white-space: pre-wrap;\n  -webkit-overflow-scrolling: touch; // fix momentum scrolling for iOS\n}\n\n.highlight .hll {\n  background-color: $base06;\n}\n.highlight {\n  .c {\n    /* Comment */\n    color: $base04;\n  }\n  .err {\n    /* Error */\n    color: $base08;\n  }\n  .k {\n    /* Keyword */\n    color: $base0e;\n  }\n  .l {\n    /* Literal */\n    color: $base09;\n  }\n  .n {\n    /* Name */\n    color: $base05;\n  }\n  .o {\n    /* Operator */\n    color: $base0c;\n  }\n  .p {\n    /* Punctuation */\n    color: $base05;\n  }\n  .cm {\n    /* Comment.Multiline */\n    color: $base04;\n  }\n  .cp {\n    /* Comment.Preproc */\n    color: $base04;\n  }\n  .c1 {\n    /* Comment.Single */\n    color: $base04;\n  }\n  .cs {\n    /* Comment.Special */\n    color: $base04;\n  }\n  .gd {\n    /* Generic.Deleted */\n    color: $base08;\n  }\n  .ge {\n    /* Generic.Emph */\n    font-style: italic;\n  }\n  .gh {\n    /* Generic.Heading */\n    color: $base05;\n    font-weight: bold;\n  }\n  .gi {\n    /* Generic.Inserted */\n    color: $base0b;\n  }\n  .gp {\n    /* Generic.Prompt */\n    color: $base04;\n    font-weight: bold;\n  }\n  .gs {\n    /* Generic.Strong */\n    font-weight: bold;\n  }\n  .gu {\n    /* Generic.Subheading */\n    color: $base0c;\n    font-weight: bold;\n  }\n  .kc {\n    /* Keyword.Constant */\n    color: $base0e;\n  }\n  .kd {\n    /* Keyword.Declaration */\n    color: $base0e;\n  }\n  .kn {\n    /* Keyword.Namespace */\n    color: $base0c;\n  }\n  .kp {\n    /* Keyword.Pseudo */\n    color: $base0e;\n  }\n  .kr {\n    /* Keyword.Reserved */\n    color: $base0e;\n  }\n  .kt {\n    /* Keyword.Type */\n    color: $base0a;\n  }\n  .ld {\n    /* Literal.Date */\n    color: $base0b;\n  }\n  .m {\n    /* Literal.Number */\n    color: $base09;\n  }\n  .s {\n    /* Literal.String */\n    color: $base0b;\n  }\n  .na {\n    /* Name.Attribute */\n    color: $base0d;\n  }\n  .nb {\n    /* Name.Builtin */\n    color: $base05;\n  }\n  .nc {\n    /* Name.Class */\n    color: $base0a;\n  }\n  .no {\n    /* Name.Constant */\n    color: $base08;\n  }\n  .nd {\n    /* Name.Decorator */\n    color: $base0c;\n  }\n  .ni {\n    /* Name.Entity */\n    color: $base05;\n  }\n  .ne {\n    /* Name.Exception */\n    color: $base08;\n  }\n  .nf {\n    /* Name.Function */\n    color: $base0d;\n  }\n  .nl {\n    /* Name.Label */\n    color: $base05;\n  }\n  .nn {\n    /* Name.Namespace */\n    color: $base0a;\n  }\n  .nx {\n    /* Name.Other */\n    color: $base0d;\n  }\n  .py {\n    /* Name.Property */\n    color: $base05;\n  }\n  .nt {\n    /* Name.Tag */\n    color: $base0c;\n  }\n  .nv {\n    /* Name.Variable */\n    color: $base08;\n  }\n  .ow {\n    /* Operator.Word */\n    color: $base0c;\n  }\n  .w {\n    /* Text.Whitespace */\n    color: $base05;\n  }\n  .mf {\n    /* Literal.Number.Float */\n    color: $base09;\n  }\n  .mh {\n    /* Literal.Number.Hex */\n    color: $base09;\n  }\n  .mi {\n    /* Literal.Number.Integer */\n    color: $base09;\n  }\n  .mo {\n    /* Literal.Number.Oct */\n    color: $base09;\n  }\n  .sb {\n    /* Literal.String.Backtick */\n    color: $base0b;\n  }\n  .sc {\n    /* Literal.String.Char */\n    color: $base05;\n  }\n  .sd {\n    /* Literal.String.Doc */\n    color: $base04;\n  }\n  .s2 {\n    /* Literal.String.Double */\n    color: $base0b;\n  }\n  .se {\n    /* Literal.String.Escape */\n    color: $base09;\n  }\n  .sh {\n    /* Literal.String.Heredoc */\n    color: $base0b;\n  }\n  .si {\n    /* Literal.String.Interpol */\n    color: $base09;\n  }\n  .sx {\n    /* Literal.String.Other */\n    color: $base0b;\n  }\n  .sr {\n    /* Literal.String.Regex */\n    color: $base0b;\n  }\n  .s1 {\n    /* Literal.String.Single */\n    color: $base0b;\n  }\n  .ss {\n    /* Literal.String.Symbol */\n    color: $base0b;\n  }\n  .bp {\n    /* Name.Builtin.Pseudo */\n    color: $base05;\n  }\n  .vc {\n    /* Name.Variable.Class */\n    color: $base08;\n  }\n  .vg {\n    /* Name.Variable.Global */\n    color: $base08;\n  }\n  .vi {\n    /* Name.Variable.Instance */\n    color: $base08;\n  }\n  .il {\n    /* Literal.Number.Integer.Long */\n    color: $base09;\n  }\n}\n\n/* Terminal */\n$terminal-window-height: 30px;\n\ndiv.highlighter-rouge.language-shell_session,\ndiv.highlighter-rouge.language-terminal,\ndiv.highlighter-rouge.language-console {\n  position: relative;\n  @include margin-bottom(1.5);\n  padding: calc(#{$terminal-window-height} + 1em) 1em 1em;\n  background-color: $base-color;\n  border-radius: $border-radius;\n  box-shadow: 0 0.25em 1em rgba($base-color, 0.25);\n\n  &::before {\n    content: \"\\2022\\2022\\2022\";\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: $terminal-window-height;\n    margin: 0;\n    padding: (0.5 * $terminal-window-height) 0;\n    background: mix(#000, #fff, 25%);\n    color: mix(#000, #fff, 50%);\n    font-family: $monospace-font;\n    font-size: $terminal-window-height;\n    line-height: 0;\n    text-indent: (0.5 * $terminal-window-height);\n    border-top-left-radius: $border-radius;\n    border-top-right-radius: $border-radius;\n  }\n\n  .highlight {\n    margin: 0;\n    padding: 0;\n    background-color: initial;\n    color: #fff;\n\n    .go {\n      color: #fff;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_tables.scss",
    "content": "/* ==========================================================================\n   Tables\n   ========================================================================== */\n\ntable {\n  border-collapse: collapse;\n  width: 100%;\n  font-size: ms(-1);\n  /* For Firefox to horizontally scroll wider tables */\n  // scss-lint:disable DuplicateProperty\n  word-break: normal;\n  word-break: keep-all;\n\n  code {\n    word-break: break-all;\n  }\n}\n\ntr th {\n  border-bottom: 1px solid $border-color;\n}\n\ntr:not(:last-child) {\n  td {\n    border-bottom: 1px solid $border-color;\n  }\n}\n\nth {\n  font-weight: bold;\n  padding: 0.5em;\n  text-align: left;\n}\n\ntd {\n  padding: 0.5em;\n}\n\ntr,\ntd,\nth {\n  vertical-align: middle;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_thumbnail-grids.scss",
    "content": "/* ==========================================================================\n   THUMBNAIL GRIDS\n   ========================================================================== */\n\n/* Thumbnail image grid (default content width) */\n\n/**\n *\n * Example usage:\n *  <ul class=\"gallery-thumbnails\">\n *    <li><a href=\"#\"><img src=\"image.jpg\" alt=\"\"></a></li>\n *    <li><a href=\"#\"><img src=\"image.jpg\" alt=\"\"></a></li>\n *    <li><a href=\"#\"><img src=\"image.jpg\" alt=\"\"></a></li>\n *  </ul>\n *\n */\n\n/* list override */\n.list .th-grid a {\n  margin-right: initial;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/_utilities.scss",
    "content": "@import \"utilities/accessibility\";\n@import \"utilities/align\";\n@import \"utilities/browser-frame\";\n@import \"utilities/clearfix\";\n@import \"utilities/float\";\n@import \"utilities/lazyload\";\n@import \"utilities/responsive-video-embed\";\n@import \"utilities/text\";\n@import \"utilities/visibility\";\n"
  },
  {
    "path": "src/assets/stylesheets/_variables.scss",
    "content": "/* ==========================================================================\n   Variables\n   ========================================================================== */\n\n/* Breakpoint widths */\n$sm-up: 576px;\n$md-up: 768px;\n$lg-up: 992px;\n$xl-up: 1200px;\n\n$sm-down: max-width 575.98px;\n$md-down: max-width 767.98px;\n$lg-down: max-width 991.98px;\n$xl-down: max-width 1199.98px;\n\n$xs-only: max-width 575.98px;\n$sm-only: 576px 767.98px;\n$md-only: 768px 991.98px;\n$lg-only: 992px 1199.98px;\n$xl-only: 1200px;\n\n/* Typography */\n$modularscale: (\n  base: 1em,\n  ratio: 1.2,\n  h: (\n    ratio: 1.125\n  )\n);\n\n$base-font-size: 112.5;\n$line-height: 1.45;\n\n$sans-serif-font: Helvetica, Arial, sans-serif;\n$serif-font: \"Spectral\", Georgia, serif;\n$monospace-font: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;\n$alternate-font: \"Alegreya\", serif;\n\n/* Colors */\n$base-color: #393e46;\n$text-color: #111;\n$accent-color: #00638a;\n$background-color: #fff;\n$code-background-color: tint($base-color, 95%);\n$border-color: mix(#fff, $base-color, 80%);\n$overlay-color: $base-color;\n$section-bg-color: mix($base-color, #fff, 10%);\n$section-dark-bg-color: mix(#000, $base-color, 50%);\n$section-about-bg-color: mix(#000, #2a201b, 50%);\n$section-work-bg-color: mix(#000, #6e2364, 50%);\n\n$primary-color: #1c76d6;\n$success-color: #1a882e;\n$warning-color: #92710c;\n$danger-color: #b11313;\n$info-color: #1c7cd6;\n\n/* Syntax highlighting (base16) colors */\n$base00: #f2f2f2;\n$base01: #e3e3e3;\n$base02: #b9b9b9;\n$base03: #ababab;\n$base04: #525252;\n$base05: #464646;\n$base06: #252525;\n$base07: #101010;\n$base08: #7c7c7c;\n$base09: #999999;\n$base0a: #a0a0a0;\n$base0b: #8e8e8e;\n$base0c: #868686;\n$base0d: #686868;\n$base0e: #747474;\n$base0f: #5e5e5e;\n\n$facebook-color: #3b5998;\n$flickr-color: #0063dc;\n$github-color: #181717;\n$google-plus-color: #dc4e41;\n$instagram-color: #e4405f;\n$rss-color: #ffa500;\n$twitter-color: #1da1f2;\n$youtube-color: #cd201f;\n\n/* Bigfoot.js */\n$button-color: #000;\n$button-standard-opacity: 0.1;\n$button-hovered-opacity: 0.5;\n\n/* Border radius */\n$border-radius: 0.125em;\n\n/* Global transition */\n$global-transition: all 0.4s ease;\n\n/* Navicon */\n$navicon-width: 1.75em;\n$navicon-height: 0.25em;\n$navicon-duration: 0.5s;\n$navicon-toggled-size: 1;\n$navicon-content-bg: $text-color;\n$navicon-focus-color: rgba($text-color, 0.25);\n\n/* Site image */\n$site-image-width: 25px;\n$site-image-height: 25px;\n"
  },
  {
    "path": "src/assets/stylesheets/main.scss",
    "content": "/*!\n * Made Mistakes 13.0.1\n * Copyright 2004-2019 Michael Rose - mademistakes.com | @mmistakes\n * https://github.com/mmistakes/made-mistakes-jekyll/blob/master/LICENSE\n*/\n\n/* Variables */\n@import \"variables\";\n\n/* Mixins and functions */\n@import \"node_modules/modularscale-sass/stylesheets/modularscale\";\n@import \"node_modules/breakpoint-sass/stylesheets/breakpoint\";\n@include breakpoint-set(\"to ems\", true);\n@import \"mixins\";\n\n/* Core */\n@import \"reset\";\n@import \"base\";\n@import \"site\";\n@import \"page\";\n@import \"post\";\n@import \"archive\";\n@import \"home\";\n\n/* Vendor components */\n@import \"node_modules/lity/dist/lity\";\n@import \"vendor/bigfoot/bigfoot-number\";\n@import \"vendor/instantsearch/instantsearch\";\n@import \"vendor/instantsearch/instantsearch-theme-algolia\";\n\n/* Components */\n@import \"animations\";\n@import \"buttons\";\n@import \"comments\";\n@import \"entries\";\n@import \"forms\";\n@import \"gallery\";\n@import \"google-search\";\n@import \"icons\";\n@import \"menu\";\n@import \"navicons\";\n@import \"navigation\";\n@import \"notices\";\n@import \"pagination\";\n@import \"paper-color-swatches\";\n@import \"responsive-embed\";\n@import \"review-box\";\n@import \"search\";\n@import \"sections\";\n@import \"style-guide\";\n@import \"syntax-highlighting\";\n@import \"tables\";\n@import \"thumbnail-grids\";\n\n/* Utility classes */\n@import \"utilities\";\n\n/* Print */\n@import \"print\";\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_clearfix.scss",
    "content": "/* ==========================================================================\n   Clearfix Mixin\n   ========================================================================== */\n\n@mixin clearfix() {\n  &::after {\n    display: block;\n    clear: both;\n    content: \"\";\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_color.scss",
    "content": "/* ==========================================================================\n   Color Functions\n   ========================================================================== */\n\n/// Slightly lighten a color\n/// @access public\n/// @param {Color} $color - color to tint\n/// @param {Number} $percentage - percentage of `$color` in returned color\n/// @return {Color}\n@function tint($color, $percentage) {\n  @return mix(#fff, $color, $percentage);\n}\n\n/// Slightly darken a color\n/// @access public\n/// @param {Color} $color - color to shade\n/// @param {Number} $percentage - percentage of `$color` in returned color\n/// @return {Color}\n@function shade($color, $percentage) {\n  @return mix(#000, $color, $percentage);\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_float.scss",
    "content": "/* ==========================================================================\n   Float Mixins\n   ========================================================================== */\n\n@mixin float-left {\n  float: left !important;\n}\n\n@mixin float-right {\n  float: right !important;\n}\n\n@mixin float-none {\n  float: none !important;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_image.scss",
    "content": "/* ==========================================================================\n   Image Mixins\n   - Responsive image\n   - Retina image\n   ========================================================================== */\n\n/*\n   Responsive image\n   Keep images from scaling beyond the width of their parents.\n   ========================================================================== */\n\n@mixin img-fluid {\n  // Part 1: Set a maximum relative to the parent\n  max-width: 100%;\n  // Part 2: Override the height to auto, otherwise images will be stretched\n  // when setting a width and height attribute on the img element.\n  height: auto;\n}\n\n/*\n   Retina image\n   Short retina mixin for setting background-image and -size.\n   ========================================================================== */\n\n@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {\n  background-image: url($file-1x);\n\n  // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,\n  // but doesn't convert dppx=>dpi.\n  // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.\n  // Compatibility info: http://caniuse.com/#feat=css-media-resolution\n  @media only screen and (min-resolution: 192dpi),\n    only screen and (min-resolution: 2dppx) {\n    // Standardized\n    background-image: url($file-2x);\n    background-size: $width-1x $height-1x;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_lists.scss",
    "content": "/* ==========================================================================\n   List Mixins\n   ========================================================================== */\n\n// Unstyled keeps list items block level, just removes default browser padding and list-style\n@mixin list-unstyled {\n  padding-left: 0;\n  list-style: none;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_screen-reader.scss",
    "content": "// Only display content to screen readers\n//\n// See: http://a11yproject.com/posts/how-to-hide-content/\n// See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/\n\n@mixin sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n\n// Use in conjunction with .sr-only to only display content when it's focused.\n//\n// Useful for \"Skip to main content\" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1\n//\n// Credit: HTML5 Boilerplate\n\n@mixin sr-only-focusable {\n  &:active,\n  &:focus {\n    position: static;\n    width: auto;\n    height: auto;\n    overflow: visible;\n    clip: auto;\n    white-space: normal;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_scrim-gradient.scss",
    "content": "/* ==========================================================================\n   Scrim Gradient Mixin\n\n   A simple little SCSS mixin for creating scrim gradients\n   Inspired by Andreas Larson - https://github.com/larsenwork\n   https://css-tricks.com/easing-linear-gradients/\n\n   example: @include scrimGradient('to top', #000);\n   ========================================================================== */\n\n@mixin scrimgradient($direction: \"to bottom\", $startcolor: \"black\") {\n  $scrimcoordinates: (\n    0: 1,\n    19: 0.838,\n    34: 0.741,\n    47: 0.682,\n    56.5: 0.578,\n    65: 0.494,\n    73: 0.326,\n    80.2: 0.175,\n    86.1: 0.042,\n    91: 0.021,\n    95.2: 0.008,\n    98.2: 0.002,\n    100: 0\n  );\n\n  $hue: hue($startcolor);\n  $saturation: saturation($startcolor);\n  $lightness: lightness($startcolor);\n  $stops: ();\n  @each $colorstop, $alphavalue in $scrimcoordinates {\n    $stop: hsla($hue, $saturation, $lightness, $alphavalue)\n      percentage($colorstop / 100);\n    $stops: append($stops, $stop, comma);\n  }\n  background: linear-gradient(unquote($direction), $stops);\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_text-truncate.scss",
    "content": "/* ==========================================================================\n   Text Truncate Mixin\n   Requires inline-block or block for proper styling\n   ========================================================================== */\n\n@mixin text-truncate() {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/mixins/_vertical-rhythm.scss",
    "content": "/* ==========================================================================\n   Vertical Rhythm\n   ========================================================================== */\n\n@mixin line-height($number) {\n  line-height: #{ $number * $line-height + 'rem'};\n}\n\n@mixin margin-top($number) {\n  margin-top: #{ $number * $line-height + 'rem'};\n}\n\n@mixin margin-bottom($number) {\n  margin-bottom: #{ $number * $line-height + 'rem'};\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_accessibility.scss",
    "content": "/* ==========================================================================\n   Accessibility Modules\n   ========================================================================== */\n\n/* Text meant only for screen readers */\n.sr-text,\n.sr-text span,\n.sr-shortcut {\n  position: absolute !important;\n  width: 1px;\n  height: 1px;\n  clip: rect(0, 0, 0, 0);\n  border: 0;\n  overflow: hidden;\n\n  &:focus {\n    display: block;\n    top: 5px;\n    left: 5px;\n    width: auto;\n    height: auto;\n    padding: 0.75em 1em;\n    clip: auto !important;\n    border-radius: 0.125em;\n    background-color: #000;\n    color: #fff;\n    font-weight: bold;\n    line-height: normal;\n    text-decoration: none;\n    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);\n    z-index: 100000;\n  }\n}\n\n.sr-text:focus,\n.sr-shortcut:focus {\n  width: auto;\n  height: auto;\n  clip: auto !important;\n  text-decoration: none;\n  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);\n  z-index: 100000;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_align.scss",
    "content": "/* ==========================================================================\n   Alignment\n   ========================================================================== */\n\n.align-baseline {\n  vertical-align: baseline !important;\n} /* Browser default */\n.align-top {\n  vertical-align: top !important;\n}\n.align-middle {\n  vertical-align: middle !important;\n}\n.align-bottom {\n  vertical-align: bottom !important;\n}\n.align-text-bottom {\n  vertical-align: text-bottom !important;\n}\n.align-text-top {\n  vertical-align: text-top !important;\n}\n\n/*\n   Image Alignment\n   ========================================================================== */\n\n.align-center,\ndiv.align-center,\na img.align-center {\n  display: block;\n  margin-right: auto;\n  margin-left: auto;\n}\n\nfigure.align-center {\n  img {\n    display: block;\n    margin-right: auto;\n    margin-left: auto;\n  }\n\n  figcaption {\n    text-align: center;\n  }\n}\n\nfigure {\n  > p {\n    width: 100%;\n    margin-bottom: 0;\n  }\n\n  .emoji {\n    margin-bottom: 0;\n  }\n}\n\n.align-right,\na img.align-right {\n  margin-bottom: 1rem;\n  margin-left: 1rem;\n  float: right;\n}\n\n.align-left,\na img.align-left {\n  margin-right: 1rem;\n  margin-bottom: 1rem;\n  float: left;\n}\n\n// /*\n//    Sidebar Pusher\n//    ========================================================================== */\n\n// .is--pushed {\n//   transform: translateX(1 * $sidebar-width) !important;\n//   transform-origin: right !important;\n\n//   @include breakpoint($large) {\n//     transform: translateX(1.5 * $sidebar-width) !important;\n//   }\n// }\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_browser-frame.scss",
    "content": "/* ==========================================================================\n   Browser Frame\n   ========================================================================== */\n\n$browser-window-height: 30px;\n$border-radius: 0.125em;\n\n.browser-frame {\n  position: relative;\n  @include margin-bottom(1.5);\n  padding: $browser-window-height 0 0;\n  border: 1px solid #ccc;\n  border-radius: $border-radius;\n  background-color: #fff;\n  box-shadow: 0 0.25em 1em rgba(#000, 0.25);\n\n  &::before {\n    content: \"\\2022\\2022\\2022\";\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: $browser-window-height;\n    margin: 0;\n    padding: (0.5 * $browser-window-height) 0;\n    background: mix(#000, #fff, 25%);\n    color: mix(#000, #fff, 50%);\n    font-family: $monospace-font;\n    font-size: $browser-window-height;\n    line-height: 0;\n    text-indent: (0.5 * $browser-window-height);\n  }\n\n  > * {\n    display: block;\n    vertical-align: bottom;\n    border-radius: 0 0 $border-radius $border-radius;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_clearfix.scss",
    "content": "//\n// Clearfix\n//\n\n.clearfix {\n  @include clearfix();\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_float.scss",
    "content": "/* ==========================================================================\n   Floats\n   ========================================================================== */\n\n.float-left {\n  @include float-left;\n}\n.float-right {\n  @include float-right;\n}\n.float-none {\n  @include float-none;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_lazyload.scss",
    "content": "/* ==========================================================================\n   Lazyload\n   ========================================================================== */\n\n.no-js img.lazyload {\n  display: none;\n}\n\n/* fade image in after load */\n.lazyload,\n.lazyloading {\n\topacity: 0;\n}\n\n.lazyloaded {\n\topacity: 1;\n\ttransition: opacity 300ms;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_responsive-video-embed.scss",
    "content": "/* ==========================================================================\n   Responsive Video Embed\n   ========================================================================== */\n\n.responsive-video-container {\n  position: relative;\n  margin-bottom: 1.5rem;\n  padding-bottom: 56.25%;\n  height: 0;\n  overflow: hidden;\n  max-width: 100%;\n\n  iframe,\n  object,\n  embed {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n  }\n}\n\n// remove margin when embedded inside of a <figure> element\nfigure .responsive-video-container {\n  margin-bottom: 0;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_text.scss",
    "content": "/* ==========================================================================\n   Text\n   ========================================================================== */\n\n/*\n   Alignment\n   ========================================================================== */\n\n.text-justify {\n  text-align: justify !important;\n}\n.text-nowrap {\n  white-space: nowrap !important;\n}\n.text-left {\n  text-align: left !important;\n}\n.text-right {\n  text-align: right !important;\n}\n.text-center {\n  text-align: center !important;\n}\n\n/*\n   Transformation\n   ========================================================================== */\n\n.text-lowercase {\n  text-transform: lowercase !important;\n}\n.text-uppercase {\n  text-transform: uppercase !important;\n}\n.text-capitalize {\n  text-transform: capitalize !important;\n}\n.text-truncate {\n  @include text-truncate;\n}\n\n/*\n   Sizing\n   ========================================================================== */\n\n.small {\n  font-size: 80%;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/utilities/_visibility.scss",
    "content": "/* ==========================================================================\n   Visibility\n   ========================================================================== */\n\n/* http://www.456bereastreet.com/archive/200711/screen_readers_sometimes_ignore_displaynone/ */\n\n.is--hidden,\n.hidden {\n  display: none !important;\n  visibility: hidden !important;\n  opacity: 0;\n}\n\n.is--visible {\n  display: block !important;\n  visibility: visible !important;\n  opacity: 1;\n}\n\n/* https://developer.yahoo.com/blogs/ydn/clip-hidden-content-better-accessibility-53456.html */\n\n.visually-hidden {\n  position: absolute !important;\n  clip: rect(1px, 1px, 1px, 1px);\n  height: 1px !important;\n  width: 1px !important;\n  border: 0 !important;\n  overflow: hidden;\n}\n\nbody:hover .visually-hidden a,\nbody:hover .visually-hidden input,\nbody:hover .visually-hidden button {\n  display: none !important;\n}\n\n/* for preloading images */\n.load {\n  display: none;\n}\n\n.transparent {\n  opacity: 0;\n}\n\n/* for screen-readers */\n.sr-only {\n  @include sr-only();\n}\n\n.sr-only-focusable {\n  @include sr-only-focusable();\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/bigfoot/bigfoot-bottom.scss",
    "content": "// bigfoot - v2.1.2 - 2015.06.03\n\n\n//        ___       ___          ___       ___                      ___          ___\n//       /  /\\     /  /\\        /  /\\     /  /\\         ___        /  /\\        /  /\\\n//      /  /::\\   /  /::\\      /  /::\\   /  /::\\       /__/\\      /  /:/_      /  /::\\\n//     /  /:/\\:\\ /  /:/\\:\\    /  /:/\\:\\ /  /:/\\:\\      \\  \\:\\    /  /:/ /\\    /  /:/\\:\\\n//    /  /:/~/://  /:/  \\:\\  /  /:/~/://  /:/  \\:\\      \\  \\:\\  /  /:/ /:/_  /  /:/~/:/\n//   /__/:/ /://__/:/ \\__\\:\\/__/:/ /://__/:/ \\__\\:\\ ___  \\__\\:\\/__/:/ /:/ /\\/__/:/ /:/___\n//   \\  \\:\\/:/ \\  \\:\\ /  /:/\\  \\:\\/:/ \\  \\:\\ /  /://__/\\ |  |:|\\  \\:\\/:/ /:/\\  \\:\\/:::::/\n//    \\  \\::/   \\  \\:\\  /:/  \\  \\::/   \\  \\:\\  /:/ \\  \\:\\|  |:| \\  \\::/ /:/  \\  \\::/~~~~\n//     \\  \\:\\    \\  \\:\\/:/    \\  \\:\\    \\  \\:\\/:/   \\  \\:\\__|:|  \\  \\:\\/:/    \\  \\:\\\n//      \\  \\:\\    \\  \\::/      \\  \\:\\    \\  \\::/     \\__\\::::/    \\  \\::/      \\  \\:\\\n//       \\__\\/     \\__\\/        \\__\\/     \\__\\/          ~~~~      \\__\\/        \\__\\/\n//\n// These are the key variables for styling the popover.\n// Just set the variable to none if you don't want that styling.\n\n// KEY VARIABLES\n// =============================================================================\n\n// STYLES\n$popover-width:                         22em !default;                           // Ideal width of the popover\n$popover-max-width:                     90% !default;                            // Best as a % to accommodate smaller viewports\n$popover-max-height:                    15em !default;                           // Maximum size of the content area\n$popover-color-background:              rgb(250, 250, 250) !default;             // Color of the popover background\n$popover-border-radius:                 0.5em !default;                          // Radius of the corners of the popover\n$popover-border:                        1px solid rgb(195, 195, 195) !default;   // Border of the popover/ tooltip\n$popover-inactive-opacity:              0 !default;                              // Opacity of the popover when instantiated/ deactivating\n$popover-active-opacity:                0.97 !default;                           // Opacity of the popover when active\n$popover-box-shadow:                    0px 0px 8px rgba(0, 0, 0, 0.3) !default; // Sets the box shadow under the popover/ tooltip\n$popover-bottom-position:               auto !default;                           // Sets the bottom position of the popover. Use only when setting positionPopover to false in the script\n$popover-left-position:                 auto !default;                           // Sets the left position of the popover. Use only when setting positionPopover to false in the script\n$popover-tooltip-size:                  1.3em !default;                          // Sets the side lengths of the tooltip\n$popover-scroll-indicator-width:        0.625em !default;                        // The width of the scroll indicator\n$popover-scroll-indicator-aspect-ratio: (15/12) !default;                        // The ratio of the height over the width of the scroll indicator\n$popover-scroll-indicator-opacity:      0.1 !default;                            // The active opacity of scroll indicators\n$popover-initial-transform-state:       scale(0.1) translateZ(0) !default;       // The initial transform state for the popover\n$popover-active-transform-state:        scale(1) translateZ(0) !default;         // The transform state for the popover once it is fully activated\n\n// OPTIONAL ELEMENTS\n$popover-include-tooltip:               true !default;                           // Adds a tooltip pointing to the footnote button\n$popover-include-scroll-indicator:      true !default;                           // Adds an ellipsis at the bottom of scrollable popovers\n$popover-include-scrolly-fades:         true !default;                           // Fades content in on scrollable popovers\n$popover-scroll-indicator-icon:         url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTIgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pbllNaW4iPgogICAgPGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMS4wMDAwMDApIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiPgogICAgICAgICAgICA8cGF0aCBkPSJNNSwwIEw1LDExLjUiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLjUsNy41IEw1LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjUsNy41IEw5LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lLTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCAxMC4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtMTAuMDAwMDAwKSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=\") !default;\n\n\n// OTHER VARIABLES\n// =============================================================================\n\n// POPOVER\n$popover-margin-top:                             0.1em !default;\n$popover-padding-content-horizontal:             1.3em !default;\n$popover-padding-content-top:                    1.1em !default;\n$popover-padding-content-bottom:                 1.2em !default;\n$popover-z-index:                                10 !default;                         // Set the base so that it's above the other body children\n$popover-initial-transform-origin:               50% 0 !default;\n\n// POPOVER CONTENT WRAPPER\n$popover-content-color-background:               $popover-color-background !default;\n$popover-content-border-radius:                  $popover-border-radius !default;\n\n// OTHER POPOVER ELEMENTS\n$popover-tooltip-background:                     $popover-color-background !default;\n$popover-tooltip-radius:                         0 !default;\n$popover-scroll-indicator-bottom-position:       0.45em !default;\n$popover-scrolly-fade-gradient-start-location:   50% !default;\n$popover-scroll-indicator-padding:               (($popover-padding-content-horizontal/2) - ($popover-scroll-indicator-width/2)) !default;\n\n// TRANSITIONS\n$popover-transition-default-duration:            0.25s !default;\n$popover-scroll-indicator-transition-properties: opacity !default;\n\n// Use none for areas you don't want to transition\n$popover-transition-properties:                  opacity, transform !default;         // no mixin to do proper prefixing of the transform, so I have to do it manually; see mixin below\n$popover-scroll-indicator-transition-properties: opacity !default;\n$popover-scroll-up-transition-delay:             0.4s !default;                       // Sets the delay for the transition of the scroll indicator when scrolling upwards\n$popover-transition-default-timing-function:     ease !default;\n\n\n\n\n\n//                     ___                             ___          ___\n//       _____        /__/\\         ___       ___     /  /\\        /__/\\\n//      /  /::\\       \\  \\:\\       /  /\\     /  /\\   /  /::\\       \\  \\:\\\n//     /  /:/\\:\\       \\  \\:\\     /  /:/    /  /:/  /  /:/\\:\\       \\  \\:\\\n//    /  /:/~/::\\  ___  \\  \\:\\   /  /:/    /  /:/  /  /:/  \\:\\  _____\\__\\:\\\n//   /__/:/ /:/\\:|/__/\\  \\__\\:\\ /  /::\\   /  /::\\ /__/:/ \\__\\:\\/__/::::::::\\\n//   \\  \\:\\/:/~/:/\\  \\:\\ /  /://__/:/\\:\\ /__/:/\\:\\\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\/\n//    \\  \\::/ /:/  \\  \\:\\  /:/ \\__\\/  \\:\\\\__\\/  \\:\\\\  \\:\\  /:/  \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/       \\  \\:\\    \\  \\:\\\\  \\:\\/:/    \\  \\:\\\n//      \\  \\::/      \\  \\::/         \\__\\/     \\__\\/ \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/                           \\__\\/        \\__\\/\n//\n// These are the key variables for styling the button.\n// Just set the variable to none if you don't want that styling.\n\n// KEY VARIABLES\n// =============================================================================\n\n$button-height:                         0.95em !default;                         // The total height of the button\n$button-width:                          auto !default;                           // The total button width (applies only if $button-apply-dimensions is true)\n$button-inner-circle-size:              0.25em !default;                         // Total height/width of the ellipsis circles\n$button-border-radius:                  0.3em !default;                          // Border radius on the button itself\n$button-left-margin:                    0.2em !default;                          // Margin between the button and the text to its left\n$button-right-margin:                   0.1em !default;                          // Margin between the button and the text to its right\n$button-vertical-adjust:                -0.1em !default;                         // Pushes the buttons along the vertical axis to align it with text as desired\n$button-inner-circle-left-margin:       1*$button-inner-circle-size !default;    // Space between the ellipsis circles\n\n$button-color:                          rgb(110, 110, 110) !default;             // Background color of the button\n$button-hovered-color:                  $button-color !default;                  // Background color of the button when being hovered\n$button-activating-color:               $button-color !default;                  // Background color of the button when being clicked\n$button-active-color:                   $button-color !default;                  // Background color of the button when active\n$button-standard-opacity:               0.2 !default;                            // Opacity for when the button is just sittin' there\n$button-hovered-opacity:                0.5 !default;                            // Opacity for when the button is being hovered over\n$button-activating-opacity:             $button-hovered-opacity !default;        // Opacity for when the button is being clicked\n$button-active-opacity:                 1 !default;                              // Opacity for when the button is active\n$button-active-style-delay:             0.1s !default;                           // Delay before applying .active styles; this can be used to match to the popover activation transition\n\n$button-inner-circle-color:             white !default;                          // Background color of the ellipsis circle\n$button-inner-circle-border:            none !default;                           // Border of the ellipsis circle\n\n\n// OTHER VARIABLES\n// =============================================================================\n\n$button-total-padding:              $button-height - $button-inner-circle-size !default;\n$button-per-side-padding:           0.5*$button-total-padding !default;\n$button-transition-properties:      background-color !default;\n\n\n\n// -----\n\n\n//        ___                    ___                     ___          ___\n//       /__/\\       ___        /__/|       ___         /__/\\        /  /\\\n//      |  |::\\     /  /\\      |  |:|      /  /\\        \\  \\:\\      /  /:/_\n//      |  |:|:\\   /  /:/      |  |:|     /  /:/         \\  \\:\\    /  /:/ /\\\n//    __|__|:|\\:\\ /__/::\\    __|__|:|    /__/::\\     _____\\__\\:\\  /  /:/ /::\\\n//   /__/::::| \\:\\\\__\\/\\:\\__/__/::::\\____\\__\\/\\:\\__ /__/::::::::\\/__/:/ /:/\\:\\\n//   \\  \\:\\~~\\__\\/   \\  \\:\\/\\  ~\\~~\\::::/   \\  \\:\\/\\\\  \\:\\~~\\~~\\/\\  \\:\\/:/~/:/\n//    \\  \\:\\          \\__\\::/   |~~|:|~~     \\__\\::/ \\  \\:\\  ~~~  \\  \\::/ /:/\n//     \\  \\:\\         /__/:/    |  |:|       /__/:/   \\  \\:\\       \\__\\/ /:/\n//      \\  \\:\\        \\__\\/     |  |:|       \\__\\/     \\  \\:\\        /__/:/\n//       \\__\\/                  |__|/                   \\__\\/        \\__\\/\n\n@mixin print-styles {\n    // These styles restore the original footnote numbers and texts when the page is printed\n    @media not print {\n        .footnote-print-only {\n            display: none !important;\n        }\n    }\n\n    @media print {\n        .bigfoot-footnote,\n        .bigfoot-footnote__button {\n            display: none !important;\n        }\n    }\n}\n\n\n\n// -----\n\n\n//                     ___                             ___          ___\n//       _____        /__/\\         ___       ___     /  /\\        /__/\\\n//      /  /::\\       \\  \\:\\       /  /\\     /  /\\   /  /::\\       \\  \\:\\\n//     /  /:/\\:\\       \\  \\:\\     /  /:/    /  /:/  /  /:/\\:\\       \\  \\:\\\n//    /  /:/~/::\\  ___  \\  \\:\\   /  /:/    /  /:/  /  /:/  \\:\\  _____\\__\\:\\\n//   /__/:/ /:/\\:|/__/\\  \\__\\:\\ /  /::\\   /  /::\\ /__/:/ \\__\\:\\/__/::::::::\\\n//   \\  \\:\\/:/~/:/\\  \\:\\ /  /://__/:/\\:\\ /__/:/\\:\\\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\/\n//    \\  \\::/ /:/  \\  \\:\\  /:/ \\__\\/  \\:\\\\__\\/  \\:\\\\  \\:\\  /:/  \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/       \\  \\:\\    \\  \\:\\\\  \\:\\/:/    \\  \\:\\\n//      \\  \\::/      \\  \\::/         \\__\\/     \\__\\/ \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/                           \\__\\/        \\__\\/\n\n\n\n//*\n// The button that activates the footnote. By default, this will appear as a\n// flat button that has an ellipse contained inside of it.\n\n// @state .is-active            - The associated popover has been activated and is visible.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__button {\n  // POSITIONING\n  position: relative;\n  z-index: 5;\n  top: $button-vertical-adjust;\n\n  // DISPLAY AND SIZING\n  box-sizing: border-box;\n  -moz-box-sizing: border-box;;\n  display: inline-block;\n  padding: $button-per-side-padding;\n  margin: 0 $button-right-margin 0 $button-left-margin;\n\n  // BACKDROP\n  border: none;\n  border-radius: $button-border-radius;\n  cursor: pointer;\n  background-color: rgba($button-color, $button-standard-opacity);\n  backface-visibility: hidden;\n\n  // TEXT\n  font-size: 1rem;\n  line-height: 0;\n  vertical-align: middle;\n  text-decoration: none;\n  -webkit-font-smoothing: antialiased;\n\n  // TRANSITIONS\n  transition-property: $button-transition-properties;\n  transition-duration: $popover-transition-default-duration;\n\n  &:hover,\n  &:focus {\n    outline: none;\n    background-color: rgba($button-hovered-color, $button-hovered-opacity);\n  }\n\n  &:active {\n    background-color: rgba($button-activating-color, $button-activating-opacity);\n  }\n\n  &.is-active {\n    background-color: rgba($button-active-color, $button-active-opacity);\n    transition-delay: $button-active-style-delay;\n  }\n\n  // Clearfix\n  &:after {\n    content: '';\n    display: table;\n    clear: both;\n  }\n}\n\n\n\n\n\n//       _____         ___                   ___\n//      /  /::\\       /  /\\         ___     /  /\\\n//     /  /:/\\:\\     /  /::\\       /  /\\   /  /:/_\n//    /  /:/  \\:\\   /  /:/\\:\\     /  /:/  /  /:/ /\\\n//   /__/:/ \\__\\:| /  /:/  \\:\\   /  /:/  /  /:/ /::\\\n//   \\  \\:\\ /  /://__/:/ \\__\\:\\ /  /::\\ /__/:/ /:/\\:\\\n//    \\  \\:\\  /:/ \\  \\:\\ /  /://__/:/\\:\\\\  \\:\\/:/~/:/\n//     \\  \\:\\/:/   \\  \\:\\  /:/ \\__\\/  \\:\\\\  \\::/ /:/\n//      \\  \\::/     \\  \\:\\/:/       \\  \\:\\\\__\\/ /:/\n//       \\__\\/       \\  \\::/         \\__\\/  /__/:/\n//                    \\__\\/                 \\__\\/\n\n//*\n// Each of the three circles forming the ellipse within the button.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__button__circle {\n  // DISPLAY AND SIZING\n  display: inline-block;\n  width: $button-inner-circle-size;\n  height: $button-inner-circle-size;\n  margin-right: $button-inner-circle-left-margin;\n  float: left;\n\n  // Gets rid of margin on the last circle\n  &:last-child { margin-right: 0; }\n}\n\n\n\n\n\n//        ___          ___          ___                   ___                     ___\n//       /  /\\        /  /\\        /__/\\         ___     /  /\\       ___         /__/\\\n//      /  /:/       /  /::\\       \\  \\:\\       /  /\\   /  /::\\     /  /\\        \\  \\:\\\n//     /  /:/       /  /:/\\:\\       \\  \\:\\     /  /:/  /  /:/\\:\\   /  /:/         \\  \\:\\\n//    /  /:/  ___  /  /:/  \\:\\  _____\\__\\:\\   /  /:/  /  /:/~/::\\ /__/::\\     _____\\__\\:\\\n//   /__/:/  /  /\\/__/:/ \\__\\:\\/__/::::::::\\ /  /::\\ /__/:/ /:/\\:\\\\__\\/\\:\\__ /__/::::::::\\\n//   \\  \\:\\ /  /:/\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\//__/:/\\:\\\\  \\:\\/:/__\\/   \\  \\:\\/\\\\  \\:\\~~\\~~\\/\n//    \\  \\:\\  /:/  \\  \\:\\  /:/  \\  \\:\\  ~~~ \\__\\/  \\:\\\\  \\::/         \\__\\::/ \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/    \\  \\:\\          \\  \\:\\\\  \\:\\         /__/:/   \\  \\:\\\n//      \\  \\::/      \\  \\::/      \\  \\:\\          \\__\\/ \\  \\:\\        \\__\\/     \\  \\:\\\n//       \\__\\/        \\__\\/        \\__\\/                 \\__\\/                   \\__\\/\n\n//*\n// The container for the button and popover. This is required so that the popover\n// is guaranteed to have a relatively-positioned container, and to help with the\n// positioning calculation.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__container {\n  display: inline-block;\n  position: relative;\n  text-indent: 0;\n}\n\n\n\n\n\n//        ___       ___                     ___\n//       /  /\\     /  /\\       ___         /__/\\         ___\n//      /  /::\\   /  /::\\     /  /\\        \\  \\:\\       /  /\\\n//     /  /:/\\:\\ /  /:/\\:\\   /  /:/         \\  \\:\\     /  /:/\n//    /  /:/~/://  /:/~/:/  /__/::\\     _____\\__\\:\\   /  /:/\n//   /__/:/ /://__/:/ /:/___\\__\\/\\:\\__ /__/::::::::\\ /  /::\\\n//   \\  \\:\\/:/ \\  \\:\\/:::::/   \\  \\:\\/\\\\  \\:\\~~\\~~\\//__/:/\\:\\\n//    \\  \\::/   \\  \\::/~~~~     \\__\\::/ \\  \\:\\  ~~~ \\__\\/  \\:\\\n//     \\  \\:\\    \\  \\:\\         /__/:/   \\  \\:\\          \\  \\:\\\n//      \\  \\:\\    \\  \\:\\        \\__\\/     \\  \\:\\          \\__\\/\n//       \\__\\/     \\__\\/                   \\__\\/\n\n@include print-styles;\n\n\n\n// -----\n\n\n//        ___       ___          ___       ___                      ___          ___\n//       /  /\\     /  /\\        /  /\\     /  /\\         ___        /  /\\        /  /\\\n//      /  /::\\   /  /::\\      /  /::\\   /  /::\\       /__/\\      /  /:/_      /  /::\\\n//     /  /:/\\:\\ /  /:/\\:\\    /  /:/\\:\\ /  /:/\\:\\      \\  \\:\\    /  /:/ /\\    /  /:/\\:\\\n//    /  /:/~/://  /:/  \\:\\  /  /:/~/://  /:/  \\:\\      \\  \\:\\  /  /:/ /:/_  /  /:/~/:/\n//   /__/:/ /://__/:/ \\__\\:\\/__/:/ /://__/:/ \\__\\:\\ ___  \\__\\:\\/__/:/ /:/ /\\/__/:/ /:/___\n//   \\  \\:\\/:/ \\  \\:\\ /  /:/\\  \\:\\/:/ \\  \\:\\ /  /://__/\\ |  |:|\\  \\:\\/:/ /:/\\  \\:\\/:::::/\n//    \\  \\::/   \\  \\:\\  /:/  \\  \\::/   \\  \\:\\  /:/ \\  \\:\\|  |:| \\  \\::/ /:/  \\  \\::/~~~~\n//     \\  \\:\\    \\  \\:\\/:/    \\  \\:\\    \\  \\:\\/:/   \\  \\:\\__|:|  \\  \\:\\/:/    \\  \\:\\\n//      \\  \\:\\    \\  \\::/      \\  \\:\\    \\  \\::/     \\__\\::::/    \\  \\::/      \\  \\:\\\n//       \\__\\/     \\__\\/        \\__\\/     \\__\\/          ~~~~      \\__\\/        \\__\\/\n//\n\n\n\n//*\n// The popover for the footnote. This popover will be, by default, be sized and positioned\n// by the script. However, many of the sizes can be established in this stylesheet and\n// will be respected by the script. `max-width` will limit the width of the popover\n// relative to the viewport. `width` (on `bigfoot-footnote__wrapper`) will set the\n// absolute max width. Max height can be set via a `max-height` property\n// on `bigfoot-footnote__content`.\n\n// By default, the popover has a light gray background, a shadow for some depth,\n// rounded corners, and a tooltip pointing to the footnote button.\n\n// @state .is-active            - The popover has been activated and is visible.\n// @state .is-positioned-top    - The popover is above the button.\n// @state .is-positioned-bottom - The popover is below the button.\n// @state .is-scrollable        - The popover content is greater than the popover height.\n// @state .is-fully-scrolled    - The popover content is scrolled to the bottom.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote {\n  // POSITIONING\n  position: absolute;\n  z-index: $popover-z-index;\n  top: 0; left: 0;\n\n  // DISPLAY AND SIZING\n  display: inline-block;\n  box-sizing: border-box;\n  // Height is set in .footnote-content-wrapper\n  max-width: $popover-max-width;\n  // 1.414213... is to get the diagonal height of the tooltip using pythagorus, yo.\n  margin: ((1.4142135624 * $popover-tooltip-size / 2) + $button-height + $popover-margin-top) 0;\n  // fits the popover to the contents\n\n  // BACKDROP\n  background: $popover-color-background;\n  opacity: $popover-inactive-opacity;\n  border-radius: $popover-border-radius;\n  border: $popover-border;\n  box-shadow: $popover-box-shadow;\n\n  // TEXT\n  line-height: 0;\n\n  // TRANSITIONS\n  transition-property: $popover-transition-properties;\n  transition-duration: $popover-transition-default-duration;\n  transition-timing-function: $popover-transition-default-timing-function;\n\n  // TRANSFORMS\n  transform: $popover-initial-transform-state;\n  transform-origin: $popover-initial-transform-origin;\n\n  &.is-positioned-top {\n    top: auto;\n    bottom: 0;\n  }\n\n  &.is-active {\n    transform: $popover-active-transform-state;\n    opacity: $popover-active-opacity;\n  }\n\n  &.is-bottom-fixed {\n    // POSITIONING\n    position: fixed;\n    bottom: 0; top: auto;\n    left: 0; right: auto;\n    transform: translateY(100%);\n\n    // DISPLAY AND SIZING\n    width: 100%;\n    margin: 0;\n\n    // BACKDROP\n    border-radius: 0;\n    opacity: 1;\n    border-width: 1px 0 0;\n\n    // TRANSITIONS\n    transition: transform 0.3s ease;\n\n    &.is-active {\n      transform: translateY(0);\n    }\n\n    .bigfoot-footnote__wrapper {\n      margin: 0 0 0 50%;\n      transform: translateX(-50%);\n      max-width: 100%;\n    }\n\n    .bigfoot-footnote__wrapper,\n    .bigfoot-footnote__content {\n      border-radius: 0;\n    }\n\n    .bigfoot-footnote__tooltip {\n      display: none;\n    }\n  }\n\n  &.is-scrollable {\n    // A scrollable indicator in the left margin of the popover.\n    &:after {\n      // CONTENT\n      content: '';\n\n      // POSITIONING\n      position: absolute;\n      bottom: $popover-scroll-indicator-padding;\n      left: $popover-scroll-indicator-padding;\n      z-index: ($popover-z-index + 4);\n\n      // DISPLAY AND SIZING\n      display: block;\n      height: ($popover-scroll-indicator-width*$popover-scroll-indicator-aspect-ratio);\n      width: $popover-scroll-indicator-width;\n\n      // BACKDROP\n      background-image: $popover-scroll-indicator-icon;\n      background-size: cover;\n      opacity: $popover-scroll-indicator-opacity;\n      transition-properties: $popover-scroll-indicator-transition-properties;\n      transition-duration: $popover-transition-default-duration;\n      transition-timing-function: $popover-transition-default-timing-function;\n    }\n\n    .bigfoot-footnote__wrapper {\n      &:before,\n      &:after {\n        content: '';\n        position: absolute;\n        width: 100%;\n        // Above the content\n        z-index: ($popover-z-index + 2);\n        left: 0;\n      }\n\n      &:before {\n        top: -1px;\n        height: $popover-padding-content-top;\n        border-radius: $popover-border-radius $popover-border-radius 0 0;\n        background-image: linear-gradient(to bottom, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%);\n      }\n\n      &:after {\n        bottom: -1px;\n        height: $popover-padding-content-bottom;\n        border-radius: 0 0 $popover-border-radius $popover-border-radius;\n        background-image: linear-gradient(to top, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%);\n      }\n    }\n\n    ::-webkit-scrollbar { display: none; }\n  }\n\n  &.is-fully-scrolled {\n    &:after,\n    &:before {\n      opacity: 0;\n      transition-delay: 0;\n    }\n  }\n}\n\n\n\n//*\n// Wraps around the footnote content. This is necessary in order to have an element\n// above the tooltip and that can provide top and bottom indicators that there is\n// additional content on scrollable popovers.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__wrapper {\n  // POSITIONING\n  position: relative;\n  // Above the outer tooltip, below the inner tooltip\n  z-index: ($popover-z-index + 4);\n\n  // DISPLAY AND SIZING\n  width: $popover-width;\n  display: inline-block;\n  box-sizing: inherit;\n  overflow: hidden;\n  margin: 0;\n\n  // BACKDROP\n  background-color: $popover-color-background;\n  border-radius: $popover-border-radius;\n\n  // TEXT\n  line-height: 0;\n}\n\n\n\n//*\n// Contains the actual footnote content. There is very little prescription here\n// on the footnote content itself, except for removing and top margin on the first\n// element and bottom margin on the last child.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__content {\n  // POSITIONING\n  position: relative;\n  z-index: ($popover-z-index - 2); // Below fading bars\n\n  // DISPLAY AND SIZING\n  display: inline-block;\n  max-height: $popover-max-height;\n  padding: $popover-padding-content-top $popover-padding-content-horizontal $popover-padding-content-bottom;\n  box-sizing: inherit;\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n\n  // BACKDROP\n  background: $popover-content-color-background;\n  border-radius: $popover-content-border-radius;\n\n  // TEXT\n  -webkit-font-smoothing: subpixel-antialiased;\n  line-height: normal;\n\n  // INTERIOR ELEMENTS\n  img { max-width: 100%; }\n  *:last-child { margin-bottom: 0 !important; }\n  *:first-child { margin-top: 0 !important; }\n}\n\n\n\n//*\n// A triangular shape pointing towards the footnote button.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__tooltip {\n  // POSITIONING\n  position: absolute;\n  // Above the footnote-main-wrapper and the outer tooltip\n  z-index: ($popover-z-index + 2);\n\n  // DISPLAY AND SIZING\n  box-sizing: border-box;\n  margin-left: (-0.5 * $popover-tooltip-size);\n  // Smaller by one border-width's worth\n  width: $popover-tooltip-size;\n  height: $popover-tooltip-size;\n  transform: rotate(45deg);\n\n  // BACKDROP\n  background: $popover-tooltip-background;\n  border: $popover-border;\n  box-shadow: $popover-box-shadow;\n  border-top-left-radius: $popover-tooltip-radius;\n\n  .is-positioned-bottom & {\n    top: (-0.5 * $popover-tooltip-size);\n  }\n\n  .is-positioned-top & {\n    bottom: (-0.5 * $popover-tooltip-size);\n  }\n}\n\n\n\n// -----\n\n\n//                     ___                             ___          ___\n//       _____        /  /\\         ___       ___     /  /\\        /__/\\\n//      /  /::\\      /  /::\\       /  /\\     /  /\\   /  /::\\      |  |::\\\n//     /  /:/\\:\\    /  /:/\\:\\     /  /:/    /  /:/  /  /:/\\:\\     |  |:|:\\\n//    /  /:/~/::\\  /  /:/  \\:\\   /  /:/    /  /:/  /  /:/  \\:\\  __|__|:|\\:\\\n//   /__/:/ /:/\\:|/__/:/ \\__\\:\\ /  /::\\   /  /::\\ /__/:/ \\__\\:\\/__/::::| \\:\\\n//   \\  \\:\\/:/~/:/\\  \\:\\ /  /://__/:/\\:\\ /__/:/\\:\\\\  \\:\\ /  /:/\\  \\:\\~~\\__\\/\n//    \\  \\::/ /:/  \\  \\:\\  /:/ \\__\\/  \\:\\\\__\\/  \\:\\\\  \\:\\  /:/  \\  \\:\\\n//     \\  \\:\\/:/    \\  \\:\\/:/       \\  \\:\\    \\  \\:\\\\  \\:\\/:/    \\  \\:\\\n//      \\  \\::/      \\  \\::/         \\__\\/     \\__\\/ \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/                           \\__\\/        \\__\\/\n\n\n\n//*\n// A footnote popover that, unlike the default, is not positioned relative to\n// the button, but instead is positioned at the bottom of the page. This popover\n// transitions with a simple slide in from the bottom.\n\n// This style requires that the `positionContent` option of bigfoot is set to false.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote {\n  // POSITIONING\n  position: fixed;\n  bottom: 0; top: auto;\n  left: 0; right: auto;\n  transform: translateY(100%);\n\n  // DISPLAY AND SIZING\n  width: 100%;\n  margin: 0;\n\n  // BACKDROP\n  border-radius: 0;\n  opacity: 1;\n  border-width: 1px 0 0;\n\n  // TRANSITIONS\n  transition: transform 0.3s ease;\n\n  &.is-active {\n    transform: translateY(0);\n  }\n}\n\n.bigfoot-footnote__wrapper {\n  margin: 0 0 0 50%;\n  transform: translateX(-50%);\n  max-width: 100%;\n}\n\n.bigfoot-footnote__wrapper,\n.bigfoot-footnote__content {\n  border-radius: 0;\n}\n\n.bigfoot-footnote__tooltip {\n  display: none;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/bigfoot/bigfoot-default.scss",
    "content": "// bigfoot - v2.1.2 - 2015.06.03\n\n\n//        ___       ___          ___       ___                      ___          ___\n//       /  /\\     /  /\\        /  /\\     /  /\\         ___        /  /\\        /  /\\\n//      /  /::\\   /  /::\\      /  /::\\   /  /::\\       /__/\\      /  /:/_      /  /::\\\n//     /  /:/\\:\\ /  /:/\\:\\    /  /:/\\:\\ /  /:/\\:\\      \\  \\:\\    /  /:/ /\\    /  /:/\\:\\\n//    /  /:/~/://  /:/  \\:\\  /  /:/~/://  /:/  \\:\\      \\  \\:\\  /  /:/ /:/_  /  /:/~/:/\n//   /__/:/ /://__/:/ \\__\\:\\/__/:/ /://__/:/ \\__\\:\\ ___  \\__\\:\\/__/:/ /:/ /\\/__/:/ /:/___\n//   \\  \\:\\/:/ \\  \\:\\ /  /:/\\  \\:\\/:/ \\  \\:\\ /  /://__/\\ |  |:|\\  \\:\\/:/ /:/\\  \\:\\/:::::/\n//    \\  \\::/   \\  \\:\\  /:/  \\  \\::/   \\  \\:\\  /:/ \\  \\:\\|  |:| \\  \\::/ /:/  \\  \\::/~~~~\n//     \\  \\:\\    \\  \\:\\/:/    \\  \\:\\    \\  \\:\\/:/   \\  \\:\\__|:|  \\  \\:\\/:/    \\  \\:\\\n//      \\  \\:\\    \\  \\::/      \\  \\:\\    \\  \\::/     \\__\\::::/    \\  \\::/      \\  \\:\\\n//       \\__\\/     \\__\\/        \\__\\/     \\__\\/          ~~~~      \\__\\/        \\__\\/\n//\n// These are the key variables for styling the popover.\n// Just set the variable to none if you don't want that styling.\n\n// KEY VARIABLES\n// =============================================================================\n\n// STYLES\n$popover-width:                         22em !default;                           // Ideal width of the popover\n$popover-max-width:                     90% !default;                            // Best as a % to accommodate smaller viewports\n$popover-max-height:                    15em !default;                           // Maximum size of the content area\n$popover-color-background:              rgb(250, 250, 250) !default;             // Color of the popover background\n$popover-border-radius:                 0.5em !default;                          // Radius of the corners of the popover\n$popover-border:                        1px solid rgb(195, 195, 195) !default;   // Border of the popover/ tooltip\n$popover-inactive-opacity:              0 !default;                              // Opacity of the popover when instantiated/ deactivating\n$popover-active-opacity:                0.97 !default;                           // Opacity of the popover when active\n$popover-box-shadow:                    0px 0px 8px rgba(0, 0, 0, 0.3) !default; // Sets the box shadow under the popover/ tooltip\n$popover-bottom-position:               auto !default;                           // Sets the bottom position of the popover. Use only when setting positionPopover to false in the script\n$popover-left-position:                 auto !default;                           // Sets the left position of the popover. Use only when setting positionPopover to false in the script\n$popover-tooltip-size:                  1.3em !default;                          // Sets the side lengths of the tooltip\n$popover-scroll-indicator-width:        0.625em !default;                        // The width of the scroll indicator\n$popover-scroll-indicator-aspect-ratio: (15/12) !default;                        // The ratio of the height over the width of the scroll indicator\n$popover-scroll-indicator-opacity:      0.1 !default;                            // The active opacity of scroll indicators\n$popover-initial-transform-state:       scale(0.1) translateZ(0) !default;       // The initial transform state for the popover\n$popover-active-transform-state:        scale(1) translateZ(0) !default;         // The transform state for the popover once it is fully activated\n\n// OPTIONAL ELEMENTS\n$popover-include-tooltip:               true !default;                           // Adds a tooltip pointing to the footnote button\n$popover-include-scroll-indicator:      true !default;                           // Adds an ellipsis at the bottom of scrollable popovers\n$popover-include-scrolly-fades:         true !default;                           // Fades content in on scrollable popovers\n$popover-scroll-indicator-icon:         url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTIgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pbllNaW4iPgogICAgPGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMS4wMDAwMDApIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiPgogICAgICAgICAgICA8cGF0aCBkPSJNNSwwIEw1LDExLjUiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLjUsNy41IEw1LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjUsNy41IEw5LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lLTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCAxMC4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtMTAuMDAwMDAwKSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=\") !default;\n\n\n// OTHER VARIABLES\n// =============================================================================\n\n// POPOVER\n$popover-margin-top:                             0.1em !default;\n$popover-padding-content-horizontal:             1.3em !default;\n$popover-padding-content-top:                    1.1em !default;\n$popover-padding-content-bottom:                 1.2em !default;\n$popover-z-index:                                25 !default;                         // Set the base so that it's above the other body children\n$popover-initial-transform-origin:               50% 0 !default;\n\n// POPOVER CONTENT WRAPPER\n$popover-content-color-background:               $popover-color-background !default;\n$popover-content-border-radius:                  $popover-border-radius !default;\n\n// OTHER POPOVER ELEMENTS\n$popover-tooltip-background:                     $popover-color-background !default;\n$popover-tooltip-radius:                         0 !default;\n$popover-scroll-indicator-bottom-position:       0.45em !default;\n$popover-scrolly-fade-gradient-start-location:   50% !default;\n$popover-scroll-indicator-padding:               (($popover-padding-content-horizontal/2) - ($popover-scroll-indicator-width/2)) !default;\n\n// TRANSITIONS\n$popover-transition-default-duration:            0.25s !default;\n$popover-scroll-indicator-transition-properties: opacity !default;\n\n// Use none for areas you don't want to transition\n$popover-transition-properties:                  opacity, transform !default;         // no mixin to do proper prefixing of the transform, so I have to do it manually; see mixin below\n$popover-scroll-indicator-transition-properties: opacity !default;\n$popover-scroll-up-transition-delay:             0.4s !default;                       // Sets the delay for the transition of the scroll indicator when scrolling upwards\n$popover-transition-default-timing-function:     ease !default;\n\n\n\n\n\n//                     ___                             ___          ___\n//       _____        /__/\\         ___       ___     /  /\\        /__/\\\n//      /  /::\\       \\  \\:\\       /  /\\     /  /\\   /  /::\\       \\  \\:\\\n//     /  /:/\\:\\       \\  \\:\\     /  /:/    /  /:/  /  /:/\\:\\       \\  \\:\\\n//    /  /:/~/::\\  ___  \\  \\:\\   /  /:/    /  /:/  /  /:/  \\:\\  _____\\__\\:\\\n//   /__/:/ /:/\\:|/__/\\  \\__\\:\\ /  /::\\   /  /::\\ /__/:/ \\__\\:\\/__/::::::::\\\n//   \\  \\:\\/:/~/:/\\  \\:\\ /  /://__/:/\\:\\ /__/:/\\:\\\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\/\n//    \\  \\::/ /:/  \\  \\:\\  /:/ \\__\\/  \\:\\\\__\\/  \\:\\\\  \\:\\  /:/  \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/       \\  \\:\\    \\  \\:\\\\  \\:\\/:/    \\  \\:\\\n//      \\  \\::/      \\  \\::/         \\__\\/     \\__\\/ \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/                           \\__\\/        \\__\\/\n//\n// These are the key variables for styling the button.\n// Just set the variable to none if you don't want that styling.\n\n// KEY VARIABLES\n// =============================================================================\n\n$button-height:                         0.95em !default;                         // The total height of the button\n$button-width:                          auto !default;                           // The total button width (applies only if $button-apply-dimensions is true)\n$button-inner-circle-size:              0.25em !default;                         // Total height/width of the ellipsis circles\n$button-border-radius:                  0.3em !default;                          // Border radius on the button itself\n$button-left-margin:                    0.2em !default;                          // Margin between the button and the text to its left\n$button-right-margin:                   0.1em !default;                          // Margin between the button and the text to its right\n$button-vertical-adjust:                -0.1em !default;                         // Pushes the buttons along the vertical axis to align it with text as desired\n$button-inner-circle-left-margin:       1*$button-inner-circle-size !default;    // Space between the ellipsis circles\n\n$button-color:                          rgb(110, 110, 110) !default;             // Background color of the button\n$button-hovered-color:                  $button-color !default;                  // Background color of the button when being hovered\n$button-activating-color:               $button-color !default;                  // Background color of the button when being clicked\n$button-active-color:                   $button-color !default;                  // Background color of the button when active\n$button-standard-opacity:               0.2 !default;                            // Opacity for when the button is just sittin' there\n$button-hovered-opacity:                0.5 !default;                            // Opacity for when the button is being hovered over\n$button-activating-opacity:             $button-hovered-opacity !default;        // Opacity for when the button is being clicked\n$button-active-opacity:                 1 !default;                              // Opacity for when the button is active\n$button-active-style-delay:             0.1s !default;                           // Delay before applying .active styles; this can be used to match to the popover activation transition\n\n$button-inner-circle-color:             white !default;                          // Background color of the ellipsis circle\n$button-inner-circle-border:            none !default;                           // Border of the ellipsis circle\n\n\n// OTHER VARIABLES\n// =============================================================================\n\n$button-total-padding:              $button-height - $button-inner-circle-size !default;\n$button-per-side-padding:           0.5*$button-total-padding !default;\n$button-transition-properties:      background-color !default;\n\n\n\n// -----\n\n\n//        ___                    ___                     ___          ___\n//       /__/\\       ___        /__/|       ___         /__/\\        /  /\\\n//      |  |::\\     /  /\\      |  |:|      /  /\\        \\  \\:\\      /  /:/_\n//      |  |:|:\\   /  /:/      |  |:|     /  /:/         \\  \\:\\    /  /:/ /\\\n//    __|__|:|\\:\\ /__/::\\    __|__|:|    /__/::\\     _____\\__\\:\\  /  /:/ /::\\\n//   /__/::::| \\:\\\\__\\/\\:\\__/__/::::\\____\\__\\/\\:\\__ /__/::::::::\\/__/:/ /:/\\:\\\n//   \\  \\:\\~~\\__\\/   \\  \\:\\/\\  ~\\~~\\::::/   \\  \\:\\/\\\\  \\:\\~~\\~~\\/\\  \\:\\/:/~/:/\n//    \\  \\:\\          \\__\\::/   |~~|:|~~     \\__\\::/ \\  \\:\\  ~~~  \\  \\::/ /:/\n//     \\  \\:\\         /__/:/    |  |:|       /__/:/   \\  \\:\\       \\__\\/ /:/\n//      \\  \\:\\        \\__\\/     |  |:|       \\__\\/     \\  \\:\\        /__/:/\n//       \\__\\/                  |__|/                   \\__\\/        \\__\\/\n\n@mixin print-styles {\n    // These styles restore the original footnote numbers and texts when the page is printed\n    @media not print {\n        .footnote-print-only {\n            display: none !important;\n        }\n    }\n\n    @media print {\n        .bigfoot-footnote,\n        .bigfoot-footnote__button {\n            display: none !important;\n        }\n    }\n}\n\n\n\n// -----\n\n\n//                     ___                             ___          ___\n//       _____        /__/\\         ___       ___     /  /\\        /__/\\\n//      /  /::\\       \\  \\:\\       /  /\\     /  /\\   /  /::\\       \\  \\:\\\n//     /  /:/\\:\\       \\  \\:\\     /  /:/    /  /:/  /  /:/\\:\\       \\  \\:\\\n//    /  /:/~/::\\  ___  \\  \\:\\   /  /:/    /  /:/  /  /:/  \\:\\  _____\\__\\:\\\n//   /__/:/ /:/\\:|/__/\\  \\__\\:\\ /  /::\\   /  /::\\ /__/:/ \\__\\:\\/__/::::::::\\\n//   \\  \\:\\/:/~/:/\\  \\:\\ /  /://__/:/\\:\\ /__/:/\\:\\\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\/\n//    \\  \\::/ /:/  \\  \\:\\  /:/ \\__\\/  \\:\\\\__\\/  \\:\\\\  \\:\\  /:/  \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/       \\  \\:\\    \\  \\:\\\\  \\:\\/:/    \\  \\:\\\n//      \\  \\::/      \\  \\::/         \\__\\/     \\__\\/ \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/                           \\__\\/        \\__\\/\n\n\n\n//*\n// The button that activates the footnote. By default, this will appear as a\n// flat button that has an ellipse contained inside of it.\n\n// @state .is-active            - The associated popover has been activated and is visible.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__button {\n  // POSITIONING\n  position: relative;\n  z-index: 5;\n  top: $button-vertical-adjust;\n\n  // DISPLAY AND SIZING\n  box-sizing: border-box;\n  -moz-box-sizing: border-box;;\n  display: inline-block;\n  padding: $button-per-side-padding;\n  margin: 0 $button-right-margin 0 $button-left-margin;\n\n  // BACKDROP\n  border: none;\n  border-radius: $button-border-radius;\n  cursor: pointer;\n  background-color: rgba($button-color, $button-standard-opacity);\n  backface-visibility: hidden;\n\n  // TEXT\n  font-size: 1rem;\n  line-height: 0;\n  vertical-align: middle;\n  text-decoration: none;\n  -webkit-font-smoothing: antialiased;\n\n  // TRANSITIONS\n  transition-property: $button-transition-properties;\n  transition-duration: $popover-transition-default-duration;\n\n  &:hover,\n  &:focus {\n    outline: none;\n    background-color: rgba($button-hovered-color, $button-hovered-opacity);\n  }\n\n  &:active {\n    background-color: rgba($button-activating-color, $button-activating-opacity);\n  }\n\n  &.is-active {\n    background-color: rgba($button-active-color, $button-active-opacity);\n    transition-delay: $button-active-style-delay;\n  }\n\n  // Clearfix\n  &:after {\n    content: '';\n    display: table;\n    clear: both;\n  }\n}\n\n\n\n\n\n//       _____         ___                   ___\n//      /  /::\\       /  /\\         ___     /  /\\\n//     /  /:/\\:\\     /  /::\\       /  /\\   /  /:/_\n//    /  /:/  \\:\\   /  /:/\\:\\     /  /:/  /  /:/ /\\\n//   /__/:/ \\__\\:| /  /:/  \\:\\   /  /:/  /  /:/ /::\\\n//   \\  \\:\\ /  /://__/:/ \\__\\:\\ /  /::\\ /__/:/ /:/\\:\\\n//    \\  \\:\\  /:/ \\  \\:\\ /  /://__/:/\\:\\\\  \\:\\/:/~/:/\n//     \\  \\:\\/:/   \\  \\:\\  /:/ \\__\\/  \\:\\\\  \\::/ /:/\n//      \\  \\::/     \\  \\:\\/:/       \\  \\:\\\\__\\/ /:/\n//       \\__\\/       \\  \\::/         \\__\\/  /__/:/\n//                    \\__\\/                 \\__\\/\n\n//*\n// Each of the three circles forming the ellipse within the button.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__button__circle {\n  // DISPLAY AND SIZING\n  display: inline-block;\n  width: $button-inner-circle-size;\n  height: $button-inner-circle-size;\n  margin-right: $button-inner-circle-left-margin;\n  float: left;\n\n  // Gets rid of margin on the last circle\n  &:last-child { margin-right: 0; }\n}\n\n\n\n\n\n//        ___          ___          ___                   ___                     ___\n//       /  /\\        /  /\\        /__/\\         ___     /  /\\       ___         /__/\\\n//      /  /:/       /  /::\\       \\  \\:\\       /  /\\   /  /::\\     /  /\\        \\  \\:\\\n//     /  /:/       /  /:/\\:\\       \\  \\:\\     /  /:/  /  /:/\\:\\   /  /:/         \\  \\:\\\n//    /  /:/  ___  /  /:/  \\:\\  _____\\__\\:\\   /  /:/  /  /:/~/::\\ /__/::\\     _____\\__\\:\\\n//   /__/:/  /  /\\/__/:/ \\__\\:\\/__/::::::::\\ /  /::\\ /__/:/ /:/\\:\\\\__\\/\\:\\__ /__/::::::::\\\n//   \\  \\:\\ /  /:/\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\//__/:/\\:\\\\  \\:\\/:/__\\/   \\  \\:\\/\\\\  \\:\\~~\\~~\\/\n//    \\  \\:\\  /:/  \\  \\:\\  /:/  \\  \\:\\  ~~~ \\__\\/  \\:\\\\  \\::/         \\__\\::/ \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/    \\  \\:\\          \\  \\:\\\\  \\:\\         /__/:/   \\  \\:\\\n//      \\  \\::/      \\  \\::/      \\  \\:\\          \\__\\/ \\  \\:\\        \\__\\/     \\  \\:\\\n//       \\__\\/        \\__\\/        \\__\\/                 \\__\\/                   \\__\\/\n\n//*\n// The container for the button and popover. This is required so that the popover\n// is guaranteed to have a relatively-positioned container, and to help with the\n// positioning calculation.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__container {\n  display: inline-block;\n  position: relative;\n  text-indent: 0;\n}\n\n\n\n\n\n//        ___       ___                     ___\n//       /  /\\     /  /\\       ___         /__/\\         ___\n//      /  /::\\   /  /::\\     /  /\\        \\  \\:\\       /  /\\\n//     /  /:/\\:\\ /  /:/\\:\\   /  /:/         \\  \\:\\     /  /:/\n//    /  /:/~/://  /:/~/:/  /__/::\\     _____\\__\\:\\   /  /:/\n//   /__/:/ /://__/:/ /:/___\\__\\/\\:\\__ /__/::::::::\\ /  /::\\\n//   \\  \\:\\/:/ \\  \\:\\/:::::/   \\  \\:\\/\\\\  \\:\\~~\\~~\\//__/:/\\:\\\n//    \\  \\::/   \\  \\::/~~~~     \\__\\::/ \\  \\:\\  ~~~ \\__\\/  \\:\\\n//     \\  \\:\\    \\  \\:\\         /__/:/   \\  \\:\\          \\  \\:\\\n//      \\  \\:\\    \\  \\:\\        \\__\\/     \\  \\:\\          \\__\\/\n//       \\__\\/     \\__\\/                   \\__\\/\n\n@include print-styles;\n\n\n\n// -----\n\n\n//        ___       ___          ___       ___                      ___          ___\n//       /  /\\     /  /\\        /  /\\     /  /\\         ___        /  /\\        /  /\\\n//      /  /::\\   /  /::\\      /  /::\\   /  /::\\       /__/\\      /  /:/_      /  /::\\\n//     /  /:/\\:\\ /  /:/\\:\\    /  /:/\\:\\ /  /:/\\:\\      \\  \\:\\    /  /:/ /\\    /  /:/\\:\\\n//    /  /:/~/://  /:/  \\:\\  /  /:/~/://  /:/  \\:\\      \\  \\:\\  /  /:/ /:/_  /  /:/~/:/\n//   /__/:/ /://__/:/ \\__\\:\\/__/:/ /://__/:/ \\__\\:\\ ___  \\__\\:\\/__/:/ /:/ /\\/__/:/ /:/___\n//   \\  \\:\\/:/ \\  \\:\\ /  /:/\\  \\:\\/:/ \\  \\:\\ /  /://__/\\ |  |:|\\  \\:\\/:/ /:/\\  \\:\\/:::::/\n//    \\  \\::/   \\  \\:\\  /:/  \\  \\::/   \\  \\:\\  /:/ \\  \\:\\|  |:| \\  \\::/ /:/  \\  \\::/~~~~\n//     \\  \\:\\    \\  \\:\\/:/    \\  \\:\\    \\  \\:\\/:/   \\  \\:\\__|:|  \\  \\:\\/:/    \\  \\:\\\n//      \\  \\:\\    \\  \\::/      \\  \\:\\    \\  \\::/     \\__\\::::/    \\  \\::/      \\  \\:\\\n//       \\__\\/     \\__\\/        \\__\\/     \\__\\/          ~~~~      \\__\\/        \\__\\/\n//\n\n\n\n//*\n// The popover for the footnote. This popover will be, by default, be sized and positioned\n// by the script. However, many of the sizes can be established in this stylesheet and\n// will be respected by the script. `max-width` will limit the width of the popover\n// relative to the viewport. `width` (on `bigfoot-footnote__wrapper`) will set the\n// absolute max width. Max height can be set via a `max-height` property\n// on `bigfoot-footnote__content`.\n\n// By default, the popover has a light gray background, a shadow for some depth,\n// rounded corners, and a tooltip pointing to the footnote button.\n\n// @state .is-active            - The popover has been activated and is visible.\n// @state .is-positioned-top    - The popover is above the button.\n// @state .is-positioned-bottom - The popover is below the button.\n// @state .is-scrollable        - The popover content is greater than the popover height.\n// @state .is-fully-scrolled    - The popover content is scrolled to the bottom.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote {\n  // POSITIONING\n  position: absolute;\n  z-index: $popover-z-index;\n  top: 0; left: 0;\n\n  // DISPLAY AND SIZING\n  display: inline-block;\n  box-sizing: border-box;\n  // Height is set in .footnote-content-wrapper\n  max-width: $popover-max-width;\n  // 1.414213... is to get the diagonal height of the tooltip using pythagorus, yo.\n  margin: ((1.4142135624 * $popover-tooltip-size / 2) + $button-height + $popover-margin-top) 0;\n  // fits the popover to the contents\n\n  // BACKDROP\n  background: $popover-color-background;\n  opacity: $popover-inactive-opacity;\n  border-radius: $popover-border-radius;\n  border: $popover-border;\n  box-shadow: $popover-box-shadow;\n\n  // TEXT\n  line-height: 0;\n\n  // TRANSITIONS\n  transition-property: $popover-transition-properties;\n  transition-duration: $popover-transition-default-duration;\n  transition-timing-function: $popover-transition-default-timing-function;\n\n  // TRANSFORMS\n  transform: $popover-initial-transform-state;\n  transform-origin: $popover-initial-transform-origin;\n\n  &.is-positioned-top {\n    top: auto;\n    bottom: 0;\n  }\n\n  &.is-active {\n    transform: $popover-active-transform-state;\n    opacity: $popover-active-opacity;\n  }\n\n  &.is-bottom-fixed {\n    // POSITIONING\n    position: fixed;\n    bottom: 0; top: auto;\n    left: 0; right: auto;\n    transform: translateY(100%);\n\n    // DISPLAY AND SIZING\n    width: 100%;\n    margin: 0;\n\n    // BACKDROP\n    border-radius: 0;\n    opacity: 1;\n    border-width: 1px 0 0;\n\n    // TRANSITIONS\n    transition: transform 0.3s ease;\n\n    &.is-active {\n      transform: translateY(0);\n    }\n\n    .bigfoot-footnote__wrapper {\n      margin: 0 0 0 50%;\n      transform: translateX(-50%);\n      max-width: 100%;\n    }\n\n    .bigfoot-footnote__wrapper,\n    .bigfoot-footnote__content {\n      border-radius: 0;\n    }\n\n    .bigfoot-footnote__tooltip {\n      display: none;\n    }\n  }\n\n  &.is-scrollable {\n    // A scrollable indicator in the left margin of the popover.\n    &:after {\n      // CONTENT\n      content: '';\n\n      // POSITIONING\n      position: absolute;\n      bottom: $popover-scroll-indicator-padding;\n      left: $popover-scroll-indicator-padding;\n      z-index: ($popover-z-index + 4);\n\n      // DISPLAY AND SIZING\n      display: block;\n      height: ($popover-scroll-indicator-width*$popover-scroll-indicator-aspect-ratio);\n      width: $popover-scroll-indicator-width;\n\n      // BACKDROP\n      background-image: $popover-scroll-indicator-icon;\n      background-size: cover;\n      opacity: $popover-scroll-indicator-opacity;\n      transition-properties: $popover-scroll-indicator-transition-properties;\n      transition-duration: $popover-transition-default-duration;\n      transition-timing-function: $popover-transition-default-timing-function;\n    }\n\n    .bigfoot-footnote__wrapper {\n      &:before,\n      &:after {\n        content: '';\n        position: absolute;\n        width: 100%;\n        // Above the content\n        z-index: ($popover-z-index + 2);\n        left: 0;\n      }\n\n      &:before {\n        top: -1px;\n        height: $popover-padding-content-top;\n        border-radius: $popover-border-radius $popover-border-radius 0 0;\n        background-image: linear-gradient(to bottom, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%);\n      }\n\n      &:after {\n        bottom: -1px;\n        height: $popover-padding-content-bottom;\n        border-radius: 0 0 $popover-border-radius $popover-border-radius;\n        background-image: linear-gradient(to top, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%);\n      }\n    }\n\n    ::-webkit-scrollbar { display: none; }\n  }\n\n  &.is-fully-scrolled {\n    &:after,\n    &:before {\n      opacity: 0;\n      transition-delay: 0;\n    }\n  }\n}\n\n\n\n//*\n// Wraps around the footnote content. This is necessary in order to have an element\n// above the tooltip and that can provide top and bottom indicators that there is\n// additional content on scrollable popovers.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__wrapper {\n  // POSITIONING\n  position: relative;\n  // Above the outer tooltip, below the inner tooltip\n  z-index: ($popover-z-index + 4);\n\n  // DISPLAY AND SIZING\n  width: $popover-width;\n  display: inline-block;\n  box-sizing: inherit;\n  overflow: hidden;\n  margin: 0;\n\n  // BACKDROP\n  background-color: $popover-color-background;\n  border-radius: $popover-border-radius;\n\n  // TEXT\n  line-height: 0;\n}\n\n\n\n//*\n// Contains the actual footnote content. There is very little prescription here\n// on the footnote content itself, except for removing and top margin on the first\n// element and bottom margin on the last child.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__content {\n  // POSITIONING\n  position: relative;\n  z-index: ($popover-z-index - 2); // Below fading bars\n\n  // DISPLAY AND SIZING\n  display: inline-block;\n  max-height: $popover-max-height;\n  padding: $popover-padding-content-top $popover-padding-content-horizontal $popover-padding-content-bottom;\n  box-sizing: inherit;\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n\n  // BACKDROP\n  background: $popover-content-color-background;\n  border-radius: $popover-content-border-radius;\n\n  // TEXT\n  -webkit-font-smoothing: subpixel-antialiased;\n  line-height: normal;\n\n  // INTERIOR ELEMENTS\n  img { max-width: 100%; }\n  *:last-child { margin-bottom: 0 !important; }\n  *:first-child { margin-top: 0 !important; }\n}\n\n\n\n//*\n// A triangular shape pointing towards the footnote button.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__tooltip {\n  // POSITIONING\n  position: absolute;\n  // Above the footnote-main-wrapper and the outer tooltip\n  z-index: ($popover-z-index + 2);\n\n  // DISPLAY AND SIZING\n  box-sizing: border-box;\n  margin-left: (-0.5 * $popover-tooltip-size);\n  // Smaller by one border-width's worth\n  width: $popover-tooltip-size;\n  height: $popover-tooltip-size;\n  transform: rotate(45deg);\n\n  // BACKDROP\n  background: $popover-tooltip-background;\n  border: $popover-border;\n  box-shadow: $popover-box-shadow;\n  border-top-left-radius: $popover-tooltip-radius;\n\n  .is-positioned-bottom & {\n    top: (-0.5 * $popover-tooltip-size);\n  }\n\n  .is-positioned-top & {\n    bottom: (-0.5 * $popover-tooltip-size);\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/bigfoot/bigfoot-number.scss",
    "content": "// bigfoot - v2.1.4 - 2016.02.11\n\n\n//        ___       ___          ___       ___                      ___          ___\n//       /  /\\     /  /\\        /  /\\     /  /\\         ___        /  /\\        /  /\\\n//      /  /::\\   /  /::\\      /  /::\\   /  /::\\       /__/\\      /  /:/_      /  /::\\\n//     /  /:/\\:\\ /  /:/\\:\\    /  /:/\\:\\ /  /:/\\:\\      \\  \\:\\    /  /:/ /\\    /  /:/\\:\\\n//    /  /:/~/://  /:/  \\:\\  /  /:/~/://  /:/  \\:\\      \\  \\:\\  /  /:/ /:/_  /  /:/~/:/\n//   /__/:/ /://__/:/ \\__\\:\\/__/:/ /://__/:/ \\__\\:\\ ___  \\__\\:\\/__/:/ /:/ /\\/__/:/ /:/___\n//   \\  \\:\\/:/ \\  \\:\\ /  /:/\\  \\:\\/:/ \\  \\:\\ /  /://__/\\ |  |:|\\  \\:\\/:/ /:/\\  \\:\\/:::::/\n//    \\  \\::/   \\  \\:\\  /:/  \\  \\::/   \\  \\:\\  /:/ \\  \\:\\|  |:| \\  \\::/ /:/  \\  \\::/~~~~\n//     \\  \\:\\    \\  \\:\\/:/    \\  \\:\\    \\  \\:\\/:/   \\  \\:\\__|:|  \\  \\:\\/:/    \\  \\:\\\n//      \\  \\:\\    \\  \\::/      \\  \\:\\    \\  \\::/     \\__\\::::/    \\  \\::/      \\  \\:\\\n//       \\__\\/     \\__\\/        \\__\\/     \\__\\/          ~~~~      \\__\\/        \\__\\/\n//\n// These are the key variables for styling the popover.\n// Just set the variable to none if you don't want that styling.\n\n// KEY VARIABLES\n// =============================================================================\n\n// STYLES\n$popover-width:                         22em !default;                           // Ideal width of the popover\n$popover-max-width:                     90% !default;                            // Best as a % to accommodate smaller viewports\n$popover-max-height:                    15em !default;                           // Maximum size of the content area\n$popover-color-background:              rgb(250, 250, 250) !default;             // Color of the popover background\n$popover-border-radius:                 0.5em !default;                          // Radius of the corners of the popover\n$popover-border:                        1px solid rgb(195, 195, 195) !default;   // Border of the popover/ tooltip\n$popover-inactive-opacity:              0 !default;                              // Opacity of the popover when instantiated/ deactivating\n$popover-active-opacity:                0.97 !default;                           // Opacity of the popover when active\n$popover-box-shadow:                    0px 0px 8px rgba(0, 0, 0, 0.3) !default; // Sets the box shadow under the popover/ tooltip\n$popover-bottom-position:               auto !default;                           // Sets the bottom position of the popover. Use only when setting positionPopover to false in the script\n$popover-left-position:                 auto !default;                           // Sets the left position of the popover. Use only when setting positionPopover to false in the script\n$popover-tooltip-size:                  1.3em !default;                          // Sets the side lengths of the tooltip\n$popover-scroll-indicator-width:        0.625em !default;                        // The width of the scroll indicator\n$popover-scroll-indicator-aspect-ratio: (15/12) !default;                        // The ratio of the height over the width of the scroll indicator\n$popover-scroll-indicator-opacity:      0.1 !default;                            // The active opacity of scroll indicators\n$popover-initial-transform-state:       scale(0.1) translateZ(0) !default;       // The inital transform state for the popover\n$popover-active-transform-state:        scale(1) translateZ(0) !default;         // The transform state for the popover once it is fully activated\n\n// OPTIONAL ELEMENTS\n$popover-include-tooltip:               true !default;                           // Adds a tooltip pointing to the footnote button\n$popover-include-scroll-indicator:      true !default;                           // Adds an elipsis at the bottom of scrollable popovers\n$popover-include-scrolly-fades:         true !default;                           // Fades content in on scrollable popovers\n$popover-scroll-indicator-icon:         url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTIgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pbllNaW4iPgogICAgPGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMS4wMDAwMDApIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiPgogICAgICAgICAgICA8cGF0aCBkPSJNNSwwIEw1LDExLjUiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLjUsNy41IEw1LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjUsNy41IEw5LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lLTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCAxMC4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtMTAuMDAwMDAwKSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=\") !default;\n\n\n// OTHER VARIABLES\n// =============================================================================\n\n// POPOVER\n$popover-margin-top:                             0.1em !default;\n$popover-padding-content-horizontal:             1.3em !default;\n$popover-padding-content-top:                    1.1em !default;\n$popover-padding-content-bottom:                 1.2em !default;\n$popover-z-index:                                10 !default;                         // Set the base so that it's above the other body children\n$popover-initial-transform-origin:               50% 0 !default;\n\n// POPOVER CONTENT WRAPPER\n$popover-content-color-background:               $popover-color-background !default;\n$popover-content-border-radius:                  $popover-border-radius !default;\n\n// OTHER POPOVER ELEMENTS\n$popover-tooltip-background:                     $popover-color-background !default;\n$popover-tooltip-radius:                         0 !default;\n$popover-scroll-indicator-bottom-position:       0.45em !default;\n$popover-scrolly-fade-gradient-start-location:   50% !default;\n$popover-scroll-indicator-padding:               (($popover-padding-content-horizontal/2) - ($popover-scroll-indicator-width/2)) !default;\n\n// TRANSITIONS\n$popover-transition-default-duration:            0.25s !default;\n$popover-scroll-indicator-transition-properties: opacity !default;\n\n// Use none for areas you don't want to transition\n$popover-transition-properties:                  opacity, transform !default;         // no mixin to do proper prefixing of the transform, so I have to do it manually; see mixin below\n$popover-scroll-indicator-transition-properties: opacity !default;\n$popover-scroll-up-transition-delay:             0.4s !default;                       // Sets the delay for the transition of the scroll indicator when scrolling upwards\n$popover-transition-default-timing-function:     ease !default;\n\n\n\n\n\n//                     ___                             ___          ___\n//       _____        /__/\\         ___       ___     /  /\\        /__/\\\n//      /  /::\\       \\  \\:\\       /  /\\     /  /\\   /  /::\\       \\  \\:\\\n//     /  /:/\\:\\       \\  \\:\\     /  /:/    /  /:/  /  /:/\\:\\       \\  \\:\\\n//    /  /:/~/::\\  ___  \\  \\:\\   /  /:/    /  /:/  /  /:/  \\:\\  _____\\__\\:\\\n//   /__/:/ /:/\\:|/__/\\  \\__\\:\\ /  /::\\   /  /::\\ /__/:/ \\__\\:\\/__/::::::::\\\n//   \\  \\:\\/:/~/:/\\  \\:\\ /  /://__/:/\\:\\ /__/:/\\:\\\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\/\n//    \\  \\::/ /:/  \\  \\:\\  /:/ \\__\\/  \\:\\\\__\\/  \\:\\\\  \\:\\  /:/  \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/       \\  \\:\\    \\  \\:\\\\  \\:\\/:/    \\  \\:\\\n//      \\  \\::/      \\  \\::/         \\__\\/     \\__\\/ \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/                           \\__\\/        \\__\\/\n//\n// These are the key variables for styling the button.\n// Just set the variable to none if you don't want that styling.\n\n// KEY VARIABLES\n// =============================================================================\n\n$button-height:                         0.95em !default;                         // The total height of the button\n$button-width:                          auto !default;                           // The total button width (applies only if $button-apply-dimensions is true)\n$button-inner-circle-size:              0.25em !default;                         // Total height/width of the ellipsis circles\n$button-border-radius:                  0.3em !default;                          // Border radius on the button itself\n$button-left-margin:                    0.2em !default;                          // Margin between the button and the text to its left\n$button-right-margin:                   0.1em !default;                          // Margin between the button and the text to its right\n$button-vertical-adjust:                -0.1em !default;                         // Pushes the buttons along the vertical axis to align it with text as desired\n$button-inner-circle-left-margin:       1*$button-inner-circle-size !default;    // Space between the ellipsis circles\n\n$button-color:                          rgb(110, 110, 110) !default;           // Background color of the button\n$button-hovered-color:                  $button-color !default;                  // Background color of the button when being hovered\n$button-activating-color:               $button-color !default;                  // Background color of the button when being clicked\n$button-active-color:                   $button-color !default;                  // Background color of the button when active\n$button-standard-opacity:               0.2 !default;                            // Opacity for when the button is just sittin' there\n$button-hovered-opacity:                0.5 !default;                            // Opacity for when the button is being hovered over\n$button-activating-opacity:             $button-hovered-opacity !default;        // Opacity for when the button is being clicked\n$button-active-opacity:                 1 !default;                              // Opacity for when the button is active\n$button-active-style-delay:             0.1s !default;                           // Delay before applying .active styles; this can be used to match to the popover activation transition\n\n$button-inner-circle-color:             white !default;                        // Background color of the ellipsis circle\n$button-inner-circle-border:            none !default;                           // Border of the ellipsis circle\n\n\n// OTHER VARIABLES\n// =============================================================================\n\n$button-total-padding:              $button-height - $button-inner-circle-size !default;\n$button-per-side-padding:           0.5*$button-total-padding !default;\n$button-transition-properties:      background-color !default;\n\n\n\n// -----\n\n\n//        ___                    ___                     ___          ___\n//       /__/\\       ___        /__/|       ___         /__/\\        /  /\\\n//      |  |::\\     /  /\\      |  |:|      /  /\\        \\  \\:\\      /  /:/_\n//      |  |:|:\\   /  /:/      |  |:|     /  /:/         \\  \\:\\    /  /:/ /\\\n//    __|__|:|\\:\\ /__/::\\    __|__|:|    /__/::\\     _____\\__\\:\\  /  /:/ /::\\\n//   /__/::::| \\:\\\\__\\/\\:\\__/__/::::\\____\\__\\/\\:\\__ /__/::::::::\\/__/:/ /:/\\:\\\n//   \\  \\:\\~~\\__\\/   \\  \\:\\/\\  ~\\~~\\::::/   \\  \\:\\/\\\\  \\:\\~~\\~~\\/\\  \\:\\/:/~/:/\n//    \\  \\:\\          \\__\\::/   |~~|:|~~     \\__\\::/ \\  \\:\\  ~~~  \\  \\::/ /:/\n//     \\  \\:\\         /__/:/    |  |:|       /__/:/   \\  \\:\\       \\__\\/ /:/\n//      \\  \\:\\        \\__\\/     |  |:|       \\__\\/     \\  \\:\\        /__/:/\n//       \\__\\/                  |__|/                   \\__\\/        \\__\\/\n\n@mixin print-styles {\n    // These styles restore the original footnote numbers and texts when the page is printed\n    @media not print {\n        .footnote-print-only {\n            display: none !important;\n        }\n    }\n\n    @media print {\n        .bigfoot-footnote,\n        .bigfoot-footnote__button {\n            display: none !important;\n        }\n    }\n}\n\n\n\n// -----\n\n\n//                     ___                             ___          ___\n//       _____        /__/\\         ___       ___     /  /\\        /__/\\\n//      /  /::\\       \\  \\:\\       /  /\\     /  /\\   /  /::\\       \\  \\:\\\n//     /  /:/\\:\\       \\  \\:\\     /  /:/    /  /:/  /  /:/\\:\\       \\  \\:\\\n//    /  /:/~/::\\  ___  \\  \\:\\   /  /:/    /  /:/  /  /:/  \\:\\  _____\\__\\:\\\n//   /__/:/ /:/\\:|/__/\\  \\__\\:\\ /  /::\\   /  /::\\ /__/:/ \\__\\:\\/__/::::::::\\\n//   \\  \\:\\/:/~/:/\\  \\:\\ /  /://__/:/\\:\\ /__/:/\\:\\\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\/\n//    \\  \\::/ /:/  \\  \\:\\  /:/ \\__\\/  \\:\\\\__\\/  \\:\\\\  \\:\\  /:/  \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/       \\  \\:\\    \\  \\:\\\\  \\:\\/:/    \\  \\:\\\n//      \\  \\::/      \\  \\::/         \\__\\/     \\__\\/ \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/                           \\__\\/        \\__\\/\n\n\n\n//*\n// The button that activates the footnote. By default, this will appear as a\n// flat button that has an ellipse contained inside of it.\n\n// @state .is-active            - The associated popover has been activated and is visible.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__button {\n  // POSITIONING\n  position: relative;\n  z-index: 5;\n  top: $button-vertical-adjust;\n\n  // DISPLAY AND SIZING\n  box-sizing: border-box;\n  -moz-box-sizing: border-box;;\n  display: inline-block;\n  padding: $button-per-side-padding;\n  margin: 0 $button-right-margin 0 $button-left-margin;\n\n  // BACKDROP\n  border: none;\n  border-radius: $button-border-radius;\n  cursor: pointer;\n  background-color: rgba($button-color, $button-standard-opacity);\n  backface-visibility: hidden;\n\n  // TEXT\n  font-size: 1rem;\n  line-height: 0;\n  vertical-align: middle;\n  text-decoration: none;\n  -webkit-font-smoothing: antialiased;\n\n  // TRANSITIONS\n  transition-property: $button-transition-properties;\n  transition-duration: $popover-transition-default-duration;\n\n  &:hover,\n  &:focus {\n    outline: none;\n    background-color: rgba($button-hovered-color, $button-hovered-opacity);\n  }\n\n  &:active {\n    background-color: rgba($button-activating-color, $button-activating-opacity);\n  }\n\n  &.is-active {\n    background-color: rgba($button-active-color, $button-active-opacity);\n    transition-delay: $button-active-style-delay;\n  }\n\n  // Clearfix\n  &:after {\n    content: '';\n    display: table;\n    clear: both;\n  }\n}\n\n\n\n\n\n//       _____         ___                   ___\n//      /  /::\\       /  /\\         ___     /  /\\\n//     /  /:/\\:\\     /  /::\\       /  /\\   /  /:/_\n//    /  /:/  \\:\\   /  /:/\\:\\     /  /:/  /  /:/ /\\\n//   /__/:/ \\__\\:| /  /:/  \\:\\   /  /:/  /  /:/ /::\\\n//   \\  \\:\\ /  /://__/:/ \\__\\:\\ /  /::\\ /__/:/ /:/\\:\\\n//    \\  \\:\\  /:/ \\  \\:\\ /  /://__/:/\\:\\\\  \\:\\/:/~/:/\n//     \\  \\:\\/:/   \\  \\:\\  /:/ \\__\\/  \\:\\\\  \\::/ /:/\n//      \\  \\::/     \\  \\:\\/:/       \\  \\:\\\\__\\/ /:/\n//       \\__\\/       \\  \\::/         \\__\\/  /__/:/\n//                    \\__\\/                 \\__\\/\n\n//*\n// Each of the three circles forming the ellipse within the button.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__button__circle {\n  // DISPLAY AND SIZING\n  display: inline-block;\n  width: $button-inner-circle-size;\n  height: $button-inner-circle-size;\n  margin-right: $button-inner-circle-left-margin;\n  float: left;\n\n  // Gets rid of margin on the last circle\n  &:last-child { margin-right: 0; }\n}\n\n\n\n\n\n//        ___          ___          ___                   ___                     ___\n//       /  /\\        /  /\\        /__/\\         ___     /  /\\       ___         /__/\\\n//      /  /:/       /  /::\\       \\  \\:\\       /  /\\   /  /::\\     /  /\\        \\  \\:\\\n//     /  /:/       /  /:/\\:\\       \\  \\:\\     /  /:/  /  /:/\\:\\   /  /:/         \\  \\:\\\n//    /  /:/  ___  /  /:/  \\:\\  _____\\__\\:\\   /  /:/  /  /:/~/::\\ /__/::\\     _____\\__\\:\\\n//   /__/:/  /  /\\/__/:/ \\__\\:\\/__/::::::::\\ /  /::\\ /__/:/ /:/\\:\\\\__\\/\\:\\__ /__/::::::::\\\n//   \\  \\:\\ /  /:/\\  \\:\\ /  /:/\\  \\:\\~~\\~~\\//__/:/\\:\\\\  \\:\\/:/__\\/   \\  \\:\\/\\\\  \\:\\~~\\~~\\/\n//    \\  \\:\\  /:/  \\  \\:\\  /:/  \\  \\:\\  ~~~ \\__\\/  \\:\\\\  \\::/         \\__\\::/ \\  \\:\\  ~~~\n//     \\  \\:\\/:/    \\  \\:\\/:/    \\  \\:\\          \\  \\:\\\\  \\:\\         /__/:/   \\  \\:\\\n//      \\  \\::/      \\  \\::/      \\  \\:\\          \\__\\/ \\  \\:\\        \\__\\/     \\  \\:\\\n//       \\__\\/        \\__\\/        \\__\\/                 \\__\\/                   \\__\\/\n\n//*\n// The container for the button and popover. This is required so that the popover\n// is guaranteed to have a relatively-positioned container, and to help with the\n// positioning calculation.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__container {\n  display: inline-block;\n  position: relative;\n  text-indent: 0;\n}\n\n\n\n\n\n//        ___       ___                     ___\n//       /  /\\     /  /\\       ___         /__/\\         ___\n//      /  /::\\   /  /::\\     /  /\\        \\  \\:\\       /  /\\\n//     /  /:/\\:\\ /  /:/\\:\\   /  /:/         \\  \\:\\     /  /:/\n//    /  /:/~/://  /:/~/:/  /__/::\\     _____\\__\\:\\   /  /:/\n//   /__/:/ /://__/:/ /:/___\\__\\/\\:\\__ /__/::::::::\\ /  /::\\\n//   \\  \\:\\/:/ \\  \\:\\/:::::/   \\  \\:\\/\\\\  \\:\\~~\\~~\\//__/:/\\:\\\n//    \\  \\::/   \\  \\::/~~~~     \\__\\::/ \\  \\:\\  ~~~ \\__\\/  \\:\\\n//     \\  \\:\\    \\  \\:\\         /__/:/   \\  \\:\\          \\  \\:\\\n//      \\  \\:\\    \\  \\:\\        \\__\\/     \\  \\:\\          \\__\\/\n//       \\__\\/     \\__\\/                   \\__\\/\n\n@include print-styles;\n\n\n\n// -----\n\n\n//        ___       ___          ___       ___                      ___          ___\n//       /  /\\     /  /\\        /  /\\     /  /\\         ___        /  /\\        /  /\\\n//      /  /::\\   /  /::\\      /  /::\\   /  /::\\       /__/\\      /  /:/_      /  /::\\\n//     /  /:/\\:\\ /  /:/\\:\\    /  /:/\\:\\ /  /:/\\:\\      \\  \\:\\    /  /:/ /\\    /  /:/\\:\\\n//    /  /:/~/://  /:/  \\:\\  /  /:/~/://  /:/  \\:\\      \\  \\:\\  /  /:/ /:/_  /  /:/~/:/\n//   /__/:/ /://__/:/ \\__\\:\\/__/:/ /://__/:/ \\__\\:\\ ___  \\__\\:\\/__/:/ /:/ /\\/__/:/ /:/___\n//   \\  \\:\\/:/ \\  \\:\\ /  /:/\\  \\:\\/:/ \\  \\:\\ /  /://__/\\ |  |:|\\  \\:\\/:/ /:/\\  \\:\\/:::::/\n//    \\  \\::/   \\  \\:\\  /:/  \\  \\::/   \\  \\:\\  /:/ \\  \\:\\|  |:| \\  \\::/ /:/  \\  \\::/~~~~\n//     \\  \\:\\    \\  \\:\\/:/    \\  \\:\\    \\  \\:\\/:/   \\  \\:\\__|:|  \\  \\:\\/:/    \\  \\:\\\n//      \\  \\:\\    \\  \\::/      \\  \\:\\    \\  \\::/     \\__\\::::/    \\  \\::/      \\  \\:\\\n//       \\__\\/     \\__\\/        \\__\\/     \\__\\/          ~~~~      \\__\\/        \\__\\/\n//\n\n\n\n//*\n// The popover for the footnote. This popover will be, by default, be sized and positioned\n// by the script. However, many of the sizes can be established in this stylesheet and\n// will be respected by the script. `max-width` will limit the width of the popover\n// relative to the viewport. `width` (on `bigfoot-footnote__wrapper`) will set the\n// absolute max width. Max height can be set via a `max-height` property\n// on `bigfoot-footnote__content`.\n\n// By default, the popover has a light gray background, a shadow for some depth,\n// rounded corners, and a tooltip pointing to the footnote button.\n\n// @state .is-active            - The popover has been activated and is visible.\n// @state .is-positioned-top    - The popover is above the button.\n// @state .is-positioned-bottom - The popover is below the button.\n// @state .is-scrollable        - The popover content is greater than the popover height.\n// @state .is-fully-scrolled    - The popover content is scrolled to the bottom.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote {\n  // POSITIONING\n  position: absolute;\n  z-index: $popover-z-index;\n  top: 0; left: 0;\n\n  // DISPLAY AND SIZING\n  display: inline-block;\n  box-sizing: border-box;\n  // Height is set in .footnote-content-wrapper\n  max-width: $popover-max-width;\n  // 1.414213... is to get the diagonal height of the tooltip using pythagorus, yo.\n  margin: ((1.4142135624 * $popover-tooltip-size / 2) + $button-height + $popover-margin-top) 0;\n  // fits the popover to the contents\n\n  // BACKDROP\n  background: $popover-color-background;\n  opacity: $popover-inactive-opacity;\n  border-radius: $popover-border-radius;\n  border: $popover-border;\n  box-shadow: $popover-box-shadow;\n\n  // TEXT\n  line-height: 0;\n\n  // TRANSITIONS\n  transition-property: $popover-transition-properties;\n  transition-duration: $popover-transition-default-duration;\n  transition-timing-function: $popover-transition-default-timing-function;\n\n  // TRANSFORMS\n  transform: $popover-initial-transform-state;\n  transform-origin: $popover-initial-transform-origin;\n\n  &.is-positioned-top {\n    top: auto;\n    bottom: 0;\n  }\n\n  &.is-active {\n    transform: $popover-active-transform-state;\n    opacity: $popover-active-opacity;\n  }\n\n  &.is-bottom-fixed {\n    // POSITIONING\n    position: fixed;\n    bottom: 0; top: auto;\n    left: 0; right: auto;\n    transform: translateY(100%);\n\n    // DISPLAY AND SIZING\n    width: 100%;\n    margin: 0;\n\n    // BACKDROP\n    border-radius: 0;\n    opacity: 1;\n    border-width: 1px 0 0;\n\n    // TRANSITIONS\n    transition: transform 0.3s ease;\n\n    &.is-active {\n      transform: translateY(0);\n    }\n\n    .bigfoot-footnote__wrapper {\n      margin: 0 0 0 50%;\n      transform: translateX(-50%);\n      max-width: 100%;\n    }\n\n    .bigfoot-footnote__wrapper,\n    .bigfoot-footnote__content {\n      border-radius: 0;\n    }\n\n    .bigfoot-footnote__tooltip {\n      display: none;\n    }\n  }\n\n  &.is-scrollable {\n    // A scrollable indicator in the left margin of the popover.\n    &:after {\n      // CONTENT\n      content: '';\n\n      // POSITIONING\n      position: absolute;\n      bottom: $popover-scroll-indicator-padding;\n      left: $popover-scroll-indicator-padding;\n      z-index: ($popover-z-index + 4);\n\n      // DISPLAY AND SIZING\n      display: block;\n      height: ($popover-scroll-indicator-width*$popover-scroll-indicator-aspect-ratio);\n      width: $popover-scroll-indicator-width;\n\n      // BACKDROP\n      background-image: $popover-scroll-indicator-icon;\n      background-size: cover;\n      opacity: $popover-scroll-indicator-opacity;\n      transition-properties: $popover-scroll-indicator-transition-properties;\n      transition-duration: $popover-transition-default-duration;\n      transition-timing-function: $popover-transition-default-timing-function;\n    }\n\n    .bigfoot-footnote__wrapper {\n      &:before,\n      &:after {\n        content: '';\n        position: absolute;\n        width: 100%;\n        // Above the content\n        z-index: ($popover-z-index + 2);\n        left: 0;\n      }\n\n      &:before {\n        top: -1px;\n        height: $popover-padding-content-top;\n        border-radius: $popover-border-radius $popover-border-radius 0 0;\n        background-image: linear-gradient(to bottom, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%);\n      }\n\n      &:after {\n        bottom: -1px;\n        height: $popover-padding-content-bottom;\n        border-radius: 0 0 $popover-border-radius $popover-border-radius;\n        background-image: linear-gradient(to top, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%);\n      }\n    }\n\n    ::-webkit-scrollbar { display: none; }\n  }\n\n  &.is-fully-scrolled {\n    &:after,\n    &:before {\n      opacity: 0;\n      transition-delay: 0;\n    }\n  }\n}\n\n\n\n//*\n// Wraps around the footnote content. This is necessary in order to have an element\n// above the tooltip and that can provide top and bottom indicators that there is\n// additional content on scrollable popovers.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__wrapper {\n  // POSITIONING\n  position: relative;\n  // Above the outer tooltip, below the inner tooltip\n  z-index: ($popover-z-index + 4);\n\n  // DISPLAY AND SIZING\n  width: $popover-width;\n  display: inline-block;\n  box-sizing: inherit;\n  overflow: hidden;\n  margin: 0;\n\n  // BACKDROP\n  background-color: $popover-color-background;\n  border-radius: $popover-border-radius;\n\n  // TEXT\n  line-height: 0;\n}\n\n\n\n//*\n// Contains the actual footnote content. There is very little prescription here\n// on the footnote content itself, except for removing and top margin on the first\n// element and bottom margin on the last child.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__content {\n  // POSITIONING\n  position: relative;\n  z-index: ($popover-z-index - 2); // Below fading bars\n\n  // DISPLAY AND SIZING\n  display: inline-block;\n  max-height: $popover-max-height;\n  padding: $popover-padding-content-top $popover-padding-content-horizontal $popover-padding-content-bottom;\n  box-sizing: inherit;\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n\n  // BACKDROP\n  background: $popover-content-color-background;\n  border-radius: $popover-content-border-radius;\n\n  // TEXT\n  -webkit-font-smoothing: subpixel-antialiased;\n  line-height: normal;\n\n  // INTERIOR ELEMENTS\n  img { max-width: 100%; }\n  *:last-child { margin-bottom: 0 !important; }\n  *:first-child { margin-top: 0 !important; }\n}\n\n\n\n//*\n// A triangular shape pointing towards the footnote button.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__tooltip {\n  // POSITIONING\n  position: absolute;\n  // Above the footnote-main-wrapper and the outer tooltip\n  z-index: ($popover-z-index + 2);\n\n  // DISPLAY AND SIZING\n  box-sizing: border-box;\n  margin-left: (-0.5 * $popover-tooltip-size);\n  // Smaller by one border-width's worth\n  width: $popover-tooltip-size;\n  height: $popover-tooltip-size;\n  transform: rotate(45deg);\n\n  // BACKDROP\n  background: $popover-tooltip-background;\n  border: $popover-border;\n  box-shadow: $popover-box-shadow;\n  border-top-left-radius: $popover-tooltip-radius;\n\n  .is-positioned-bottom & {\n    top: (-0.5 * $popover-tooltip-size);\n  }\n\n  .is-positioned-top & {\n    bottom: (-0.5 * $popover-tooltip-size);\n  }\n}\n\n\n\n// -----\n\n\n//        ___          ___          ___                       ___          ___\n//       /__/\\        /__/\\        /__/\\        _____        /  /\\        /  /\\\n//       \\  \\:\\       \\  \\:\\      |  |::\\      /  /::\\      /  /:/_      /  /::\\\n//        \\  \\:\\       \\  \\:\\     |  |:|:\\    /  /:/\\:\\    /  /:/ /\\    /  /:/\\:\\\n//    _____\\__\\:\\  ___  \\  \\:\\  __|__|:|\\:\\  /  /:/~/::\\  /  /:/ /:/_  /  /:/~/:/\n//   /__/::::::::\\/__/\\  \\__\\:\\/__/::::| \\:\\/__/:/ /:/\\:|/__/:/ /:/ /\\/__/:/ /:/___\n//   \\  \\:\\~~\\~~\\/\\  \\:\\ /  /:/\\  \\:\\~~\\__\\/\\  \\:\\/:/~/:/\\  \\:\\/:/ /:/\\  \\:\\/:::::/\n//    \\  \\:\\  ~~~  \\  \\:\\  /:/  \\  \\:\\       \\  \\::/ /:/  \\  \\::/ /:/  \\  \\::/~~~~\n//     \\  \\:\\       \\  \\:\\/:/    \\  \\:\\       \\  \\:\\/:/    \\  \\:\\/:/    \\  \\:\\\n//      \\  \\:\\       \\  \\::/      \\  \\:\\       \\  \\::/      \\  \\::/      \\  \\:\\\n//       \\__\\/        \\__\\/        \\__\\/        \\__\\/        \\__\\/        \\__\\/\n\n\n\n//*\n// A button that has no ellipse, but instead shows the footnote's number on the\n// page. Note that the number will be reset to 1 depending on the selector passed\n// to bigfoot's `numberResetSelector` option.\n\n// @since 2.1.0\n// @author Chris Sauve\n\n.bigfoot-footnote__button {\n  position: relative;\n  height: $button-height;\n  width: 1.5em;\n  border-radius: $button-height/2;\n\n  &:after {\n    // CONTENT\n    content: attr(data-footnote-number);\n\n    // POSITION\n    position: absolute;\n    top: 50%; left: 50%;\n    transform: translate(-50%, -50%);\n\n    // DISPLAY AND SIZING\n    display: block;\n\n    // TEXT\n    font-size: $button-height*0.6;\n    font-weight: bold;\n    color: rgba($button-color, 0.5);\n\n    // TRANSITIONS\n    transition: color $popover-transition-default-duration $popover-transition-default-timing-function;\n  }\n\n  &:hover,\n  &.is-active {\n    &:after {\n      color: white;\n    }\n  }\n}\n\n.bigfoot-footnote__button__circle {\n  display: none;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/_base.scss",
    "content": "@mixin block($block) {\n  .ais-#{$block} {\n    @content;\n  }\n}\n\n@mixin element($element) {\n  &--#{$element} {\n    @content;\n  }\n}\n\n@mixin modifier($modifier) {\n  &__#{$modifier} {\n    @content;\n  }\n}\n\n@mixin bem($block, $element, $modifier: \"\") {\n  @include block($block) {\n    @include element($element) {\n      @if $modifier != \"\" {\n        @include modifier($modifier) {\n          @content;\n        }\n      } @else {\n        @content;\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/debug.css",
    "content": "/**\n * This file can be included in your page to help you debug which `ais-*`\n * classes are added to the widgets.\n * It will outline every added node and display the class name on hover\n **/\n[class^=ais-] {\n  outline: 1px solid red !important;\n  position: relative;\n}\n[class^=ais-]:hover:after {\n  background: red;\n  color: black;\n  content: attr(class);\n  font-size: 1rem;\n  height: 20px;\n  left: 0;\n  padding: .5rem;\n  position: absolute;\n  top: 0;\n  white-space: nowrap;\n  z-index: 10;\n  font-weight: normal;\n}\n[class^=ais-] [class^=ais-] {\n  outline: 1px solid orange !important;\n  position: relative;\n}\n[class^=ais-] [class^=ais-]:hover:after {\n  background: orange;\n  top: 20px;\n  z-index: 100;\n}\n[class^=ais-] [class^=ais-] [class^=ais-] {\n  outline: 1px solid yellow !important;\n  position: relative;\n}\n[class^=ais-] [class^=ais-] [class^=ais-]:hover:after {\n  background: yellow;\n  top: 40px;\n  z-index: 1000;\n}\n[class^=ais-] [class^=ais-] [class^=ais-] [class^=ais-] {\n  outline: 1px solid cyan !important;\n  position: relative;\n}\n[class^=ais-] [class^=ais-] [class^=ais-] [class^=ais-]:hover:after {\n  background: cyan;\n  top: 40px;\n  z-index: 1100;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_breadcrumb.scss",
    "content": ".ais-breadcrumb--label,\n.ais-breadcrumb--separator,\n.ais-breadcrumb--home {\n  display: inline;\n  color: #3369E7;\n}\n\n.ais-breadcrumb--item {\n  display: inline;\n}\n\n.ais-breadcrumb--disabledLabel {\n  color: rgb(68, 68, 68);\n  display: inline;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_clear-all.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(clear-all) {\n  @include element(header) {\n    /* widget header */\n  }\n\n  @include element(body) {\n    /* widget body */\n  }\n\n  @include element(link) {\n    /* widget link */\n  }\n\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_current-refined-values.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(current-refined-values) {\n  @include element(header) {\n    /* widget header */\n  }\n\n  @include element(body) {\n    /* widget body */\n  }\n\n  @include element(clear-all) {\n    /* widget clearAll link */\n  }\n\n  @include element(list) {\n    /* widget list */\n  }\n\n  @include element(item) {\n    /* widget item */\n  }\n\n  @include element(link) {\n    /* widget link */\n  }\n\n  @include element(count) {\n    /* widget count */\n  }\n\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_geo-search.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(geo-search) {\n  /* root element */\n  height: 100%;\n\n  @include element(map) {\n    /* map element */\n    height: 100%;\n  }\n  @include element(controls) {\n    /* map controls */\n  }\n  @include element(clear) {\n    /* clear button */\n  }\n  @include element(control) {\n    /* refine control */\n  }\n  @include element(toggle-label) {\n    /* toggle label */\n    display: flex;\n    align-items: center;\n  }\n  @include element(toggle-input) {\n    /* toggle input */\n  }\n  @include element(redo) {\n    /* redo button */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_header-footer.scss",
    "content": ".ais-root__collapsible .ais-header {\n  cursor: pointer;\n}\n\n.ais-root__collapsed .ais-body, .ais-root__collapsed .ais-footer {\n  display: none;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_hierarchical-menu.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(hierarchical-menu) {\n  @include element(header) {\n    /* widget header */\n  }\n  @include element(body) {\n    /* widget body */\n  }\n  @include element(list) {\n    /* item list */\n    @include modifier(lvl0) {\n      /* item list level 0 */\n    }\n    @include modifier(lvl1) {\n      /* item list level 1 */\n      margin-left: 10px;\n    }\n    @include modifier(lvl2) {\n      /* item list level 0 */\n      margin-left: 10px;\n    }\n  }\n\n  @include element(item) {\n    /* list item */\n    @include modifier(active) {\n      /* active list item */\n    }\n  }\n\n  @include element(link) {\n    /* item link */\n  }\n  @include element(count) {\n    /* item count */\n  }\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_hits.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(hits) {\n  @include modifier(empty) {\n    /* empty container */\n  }\n  @include element(item) {\n    /* hit item */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_menu.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(menu) {\n  @include element(header) {\n    /* widget header */\n  }\n  @include element(body) {\n    /* widget body */\n  }\n  @include element(list) {\n    /* item list */\n  }\n  @include element(item) {\n    /* list item */\n    @include modifier(active) {\n      /* active list item */\n    }\n  }\n  @include element(link) {\n    /* item link */\n  }\n  @include element(count) {\n    /* item count */\n  }\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_pagination.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(pagination) {\n  @include element(item) {\n    /* pagination item */\n    display: inline-block;\n    padding: 3px;\n    @include modifier(disabled) {\n      /* disabled pagination item */\n      visibility: hidden;\n    }\n    @include modifier(active) {\n      /* active pagination item */\n    }\n    @include modifier(first) {\n      /* first pagination item */\n    }\n    @include modifier(previous) {\n      /* previous pagination item */\n    }\n    @include modifier(page) {\n      /* page pagination item */\n    }\n    @include modifier(next) {\n      /* next pagination item */\n    }\n    @include modifier(last) {\n      /* last pagination item */\n    }\n  }\n  @include element(link) {\n    /* pagination link */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_price-ranges.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(price-ranges) {\n  @include element(header) {\n    /* widget header */\n  }\n  @include element(body) {\n    /* widget body */\n  }\n  @include element(footer) {\n    /* widget footer */\n  }\n  @include element(list) {\n    /* item list */\n  }\n  @include element(item) {\n    /* list item */\n    @include modifier(active) {\n      /* active list item */\n    }\n  }\n\n  @include element(link) {\n    /* item link */\n  }\n  @include element(form) {\n    /* custom form */\n  }\n  @include element(label) {\n    /* custom form label */\n  }\n  @include element(currency) {\n    /* currency */\n  }\n  @include element(input) {\n    /* custom form input */\n  }\n  @include element(separator) {\n    /* custom form separator */\n  }\n  @include element(button) {\n    /* custom form button */\n  }\n}\n\n\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_range-input.scss",
    "content": "@import \"../base\";\n@import \"variables\";\n\n$input-min-width: 165px;\n\n@include block(range-input) {\n  @include element(fieldset) {\n    /* custom fieldset */\n    margin: 0;\n    padding: 0;\n    border: 0;\n  }\n  @include element(labelMin) {\n    /* custom label min */\n    display: inline-block;\n  }\n  @include element(inputMin) {\n    /* custom input min */\n    min-width: $input-min-width;\n\n    &:hover:disabled {\n      cursor: not-allowed;\n    }\n  }\n  @include element(separator) {\n    /* separator */\n    margin: 0 5px;\n  }\n  @include element(labelMax) {\n    /* custom label max */\n    display: inline-block;\n  }\n  @include element(inputMax) {\n    /* custom input max */\n    min-width: $input-min-width;\n\n    &:hover:disabled {\n      cursor: not-allowed;\n    }\n  }\n  @include element(submit) {\n    /* custom form button */\n    margin-left: 5px;\n\n    &:disabled,\n    &:hover:disabled {\n      cursor: not-allowed;\n      background-color: #C9C9C9;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_range-slider.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n$range-slider-handle-size: 20px;\n$range-slider-target-height: 6px;\n$range-slider-bg: $gray-light;\n$range-slider-marker-bg: #DDD;\n$range-slider-bar-color: $blue-light;\n$range-slider-handle-bg: $white;\n\n@include block(range-slider) {\n  .ais-range-slider--disabled {\n    cursor: not-allowed;\n\n    .ais-range-slider--handle {\n      border-color: $range-slider-marker-bg;\n      cursor: not-allowed;\n    }\n\n    .rheostat-horizontal .rheostat-progress {\n      background-color: $range-slider-marker-bg;\n    }\n  }\n\n  .rheostat {\n    overflow: visible;\n    margin-top: 2em;\n    margin-bottom: 2em;\n  }\n\n  .rheostat-background {\n    background-color: $range-slider-handle-bg;\n    border-top: 1px solid $range-slider-marker-bg;\n    border-bottom: 1px solid $range-slider-marker-bg;\n    border-left: 2px solid $range-slider-marker-bg;\n    border-right: 2px solid $range-slider-marker-bg;\n    position: relative;\n  }\n\n  .rheostat-horizontal {\n    .rheostat-background {\n      height: 6px;\n      top: 0;\n      width: 100%;\n    }\n\n    .rheostat-progress {\n      background-color: $range-slider-bar-color;\n      position: absolute;\n      height: 4px;\n      top: 1px;\n    }\n\n    .rheostat-handle {\n      margin-left: -12px;\n      top: -7px;\n\n      .ais-range-slider--tooltip {\n        text-align: center;\n        margin-left: -10px;\n        width: 40px;\n      }\n    }\n\n    .rheostat-handle {\n      &::before,\n      &::after {\n        top: 7px;\n        height: 10px;\n        width: 1px;\n      }\n\n      &::before { left: 10px; }\n      &::after { left: 13px; }\n    }\n  }\n\n  @include element(handle) {\n    width: $range-slider-handle-size;\n    height: $range-slider-handle-size;\n    position: relative;\n    z-index: 1;\n    background: $range-slider-handle-bg;\n    border: 1px solid $range-slider-bar-color;\n    border-radius: 50%;\n    cursor: pointer;\n  }\n\n  @include element(tooltip) {\n    position: absolute;\n    background: $white;\n    top: -$range-slider-handle-size - 2px;\n    font-size: .8em;\n  }\n\n  @include element(value) {\n    width: $range-slider-handle-size * 2;\n    position: absolute;\n    text-align: center;\n    margin-left: -$range-slider-handle-size;\n    padding-top: 15px;\n    font-size: .8em;\n  }\n\n  @include element(marker) {\n    position: absolute;\n    background: $range-slider-marker-bg;\n    margin-left: -1px;\n    width: 1px;\n    height: 5px;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_refinement-list.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(refinement-list) {\n  @include element(header) {\n    /* widget header */\n  }\n  @include element(body) {\n    /* wudget footer */\n  }\n  @include element(list) {\n    /* item list */\n  }\n  @include element(item) {\n    /* list item */\n    @include modifier(active) {\n      /* active list item */\n    }\n  }\n  @include element(label) {\n    /* item label */\n  }\n  @include element(checkbox) {\n    /* item checkbox */\n  }\n  @include element(count) {\n    /* item count */\n  }\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n\n/* Sub block for the show more of the refinement list */\n@include block(show-more) {\n  @include modifier(active) {\n    /* Show more button is activated */\n  }\n  @include modifier(inactive) {\n    /* Show more button is deactivated */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_refinement-searchbox.scss",
    "content": "// sass-lint:disable no-vendor-prefixes\n$config-sffv: (\n  input-width: 100%,\n  input-height: 25px,\n  border-width: 1px,\n  border-radius: 3px,\n  input-border-color: #CCCCCC,\n  input-focus-border-color: #337AB7,\n  input-background: #FFFFFF,\n  input-focus-background: #FFFFFF,\n  font-size: 14px,\n  placeholder-color: #BBBBBB,\n  icon-size: 14px,\n  icon-position: left,\n  icon-color: #337AB7,\n  icon-background: #FFFFFF,\n  icon-background-opacity: 0,\n  icon-clear-size: 14px\n);\n\n\n@function even-px($value) {\n  @if type-of($value) == 'number' {\n    @if (unitless($value)) {\n      $value: $value * 1px;\n    } @else if unit($value) == 'em' {\n      $value: ($value / 1em * 16px);\n    } @else if unit($value) == 'pts' {\n      $value: $value * 1.3333 * 1px;\n    } @else if unit($value) == '%' {\n      $value: $value * 16 / 100% * 1px;\n    };\n    $value: round($value);\n    @if ($value % 2 != 0) {\n      $value: $value + 1;\n    }\n    @return $value;\n  }\n}\n\n@mixin searchbox(\n  $font-size: 90%,\n  $input-width: 350px,\n  $input-height: $font-size * 2.4,\n  $border-width: 1px,\n  $border-radius: $input-height / 2,\n  $input-border-color: #CCC,\n  $input-focus-border-color: #1EC9EA,\n  $input-background: #F8F8F8,\n  $input-focus-background: #FFF,\n  $placeholder-color: #AAA,\n  $icon: 'sbx-icon-search-1',\n  $icon-size: $input-height / 1.6,\n  $icon-position: left,\n  $icon-color: #888,\n  $icon-background: $input-focus-border-color,\n  $icon-background-opacity: .1,\n  $icon-clear: 'sbx-icon-clear-1',\n  $icon-clear-size: $font-size / 1.1\n) {\n  display: inline-block;\n  position: relative;\n  width: $input-width;\n  height: even-px($input-height);\n  white-space: nowrap;\n  box-sizing: border-box;\n  font-size: $font-size;\n\n  &__wrapper {\n    width: 100%;\n    height: 100%;\n  }\n\n  &__input {\n    display: inline-block;\n    transition: box-shadow .4s ease, background .4s ease;\n    border: 0;\n    border-radius: even-px($border-radius);\n    box-shadow: inset 0 0 0 $border-width $input-border-color;\n    background: $input-background;\n    padding: 0;\n    padding-right: if($icon-position == 'right', even-px($input-height) + even-px($icon-clear-size) + 8px, even-px($input-height * .8)) + if($icon-background-opacity == 0, 0, even-px($font-size));\n    padding-left: if($icon-position == 'right', even-px($font-size / 2) + even-px($border-radius / 2), even-px($input-height) + if($icon-background-opacity == 0, 0, even-px($font-size * 1.2)));\n    width: 100%;\n    height: 100%;\n    vertical-align: middle;\n    white-space: normal;\n    font-size: inherit;\n    appearance: none;\n\n    &::-webkit-search-decoration,\n    &::-webkit-search-cancel-button,\n    &::-webkit-search-results-button,\n    &::-webkit-search-results-decoration {\n      display: none;\n    }\n\n    &:hover {\n      box-shadow: inset 0 0 0 $border-width darken($input-border-color, 10%);\n    }\n\n    &:focus,\n    &:active {\n      outline: 0;\n      box-shadow: inset 0 0 0 $border-width $input-focus-border-color;\n      background: $input-focus-background;\n    }\n\n    &::placeholder {\n      color: $placeholder-color;\n    }\n\n  }\n\n  &__submit {\n    position: absolute;\n    top: 0;\n    @if $icon-position == 'right' {\n      right: 0;\n      left: inherit;\n    } @else {\n      right: inherit;\n      left: 0;\n    }\n    margin: 0;\n    border: 0;\n    border-radius: if($icon-position == 'right', 0 $border-radius $border-radius 0, $border-radius 0 0 $border-radius);\n    background-color: rgba($icon-background, $icon-background-opacity);\n    padding: 0;\n    width: even-px($input-height) + if($icon-background-opacity == 0, 0, even-px($font-size / 2));\n    height: 100%;\n    vertical-align: middle;\n    text-align: center;\n    font-size: inherit;\n    user-select: none;\n\n    // Helper for vertical alignement of the icon\n    &::before {\n      display: inline-block;\n      margin-right: -4px;\n      height: 100%;\n      vertical-align: middle;\n      content: '';\n    }\n\n    &:hover,\n    &:active {\n      cursor: pointer;\n    }\n\n    &:focus {\n      outline: 0;\n    }\n\n    svg {\n      width: even-px($icon-size);\n      height: even-px($icon-size);\n      vertical-align: middle;\n      fill: $icon-color;\n    }\n  }\n\n  &__reset {\n    display: none;\n    position: absolute;\n    top: (even-px($input-height) - even-px($icon-clear-size)) / 2 - 4px;\n    right: if($icon-position == 'right',\n      even-px($input-height) + if($icon-background-opacity == 0, 0 , even-px($font-size)),\n      (even-px($input-height) - even-px($icon-clear-size)) / 2 - 4px);\n    margin: 0;\n    border: 0;\n    background: none;\n    cursor: pointer;\n    padding: 0;\n    font-size: inherit;\n    user-select: none;\n    fill: rgba(#000, .5);\n\n    &:focus {\n      outline: 0;\n    }\n\n    svg {\n      display: block;\n      margin: 4px;\n      width: even-px($icon-clear-size);\n      height: even-px($icon-clear-size);\n    }\n  }\n\n  &__input:valid ~ &__reset { // sass-lint:disable-line force-pseudo-nesting\n    display: block;\n    animation-name: sbx-reset-in;\n    animation-duration: .15s;\n  }\n\n  @at-root {\n    @keyframes sbx-reset-in {\n      0% {\n        transform: translate3d(-20%, 0, 0);\n        opacity: 0;\n      }\n\n      100% {\n        transform: none;\n        opacity: 1;\n      }\n    }\n  }\n}\n\n.sbx-sffv {\n  @include searchbox($config-sffv...);\n}\n\n.ais-refinement-list--item em {\n  font-style: normal;\n  font-weight: bold;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_search-box.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(search-box) {\n  position: relative;\n  max-width: 300px;\n  width: 100%;\n\n  @include element(input) {\n    /* search input */\n    padding-left: 24px;\n    height: 100%;\n    width: 100%;\n  }\n\n  @include element(magnifier) {\n    background: transparent;\n    position: absolute;\n    user-select: none;\n    top: 4px;\n    left: 7px;\n\n    svg {\n      display: block;\n      vertical-align: middle;\n      height: 14px;\n      width: 14px;\n    }\n  }\n\n  @include element(loading-indicator-wrapper) {\n    display: none;\n    background: transparent;\n    position: absolute;\n    user-select: none;\n    top: 4px;\n    left: 7px;\n\n    svg {\n      vertical-align: middle;\n      height: 14px;\n      width: 14px;\n    }\n  }\n\n  @include element(reset) {\n    background: none;\n    cursor: pointer;\n    position: absolute;\n    top: 5px;\n    right: 5px;\n    margin: 0;\n    border: 0;\n    padding: 0;\n    user-select: none;\n\n    svg {\n      display: block;\n      width: 12px;\n      height: 12px;\n    }\n  }\n\n  @include element(powered-by) {\n    font-size: .8em;\n    text-align: right;\n    margin-top: 2px;\n  }\n  //\n  // Image replacement technique used:\n  // http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/\n  //\n  @include element(powered-by-link) {\n    display: inline-block;\n    width: 45px;\n    height: 16px;\n    text-indent: 101%;\n    overflow: hidden;\n    white-space: nowrap;\n    background-image: url('data:image/svg+xml;utf8,<svg width=\"169\" height=\"54\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1366 362\"><linearGradient id=\"a\" x1=\"428.3\" x2=\"434.1\" y1=\"404.1\" y2=\"409.9\" gradientTransform=\"matrix(94.045 0 0 -94.072 -40381.5 38479.5)\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0\" stop-color=\"%2300aeff\"/><stop offset=\"1\" stop-color=\"%233369e7\"/></linearGradient><path fill=\"url(%23a)\" d=\"M61.8 15.4h242.8A43.4 43.4 0 0 1 348 58.8v242.9a43.4 43.4 0 0 1-43.4 43.4H61.8a43.4 43.4 0 0 1-43.4-43.4v-243a43.3 43.3 0 0 1 43.4-43.3z\"/><path fill=\"%23fff\" d=\"M187 98.7a93.1 93.1 0 1 0 0 186.3 93.1 93.1 0 0 0 0-186.3zm0 158.8a65.6 65.6 0 1 1 0-131.3 65.6 65.6 0 0 1 0 131.3zm0-117.8v48.9c0 1.4 1.5 2.4 2.8 1.7l43.4-22.5c1-.5 1.3-1.7.8-2.7a54 54 0 0 0-45-27.3c-1 0-2 .8-2 1.9zm-60.8-35.9l-5.7-5.7a14.2 14.2 0 0 0-20.2 0l-6.8 6.8a14.2 14.2 0 0 0 0 20.2l5.6 5.6c.9.9 2.2.7 3-.2a110 110 0 0 1 23.8-23.8c1-.6 1.1-2 .3-2.9zM217.5 89V77.7c0-7.9-6.4-14.3-14.3-14.3h-33.3c-7.9 0-14.3 6.4-14.3 14.3v11.6c0 1.3 1.2 2.2 2.5 1.9a104.2 104.2 0 0 1 57-.3 2 2 0 0 0 2.4-1.9z\"/><path fill=\"%23182359\" d=\"M842.5 267.6c0 26.7-6.8 46.2-20.5 58.6-13.7 12.4-34.6 18.6-62.8 18.6-10.3 0-31.7-2-48.8-5.8l6.3-31c14.3 3 33.2 3.8 43.1 3.8 15.7 0 26.9-3.2 33.6-9.6s10-15.9 10-28.5v-6.4c-3.9 1.9-9 3.8-15.3 5.8a75.7 75.7 0 0 1-21.8 2.9 82 82 0 0 1-29.5-5.1 61.7 61.7 0 0 1-37.7-39.8 144.7 144.7 0 0 1 .3-78.3 72.1 72.1 0 0 1 42.8-43.3 96.3 96.3 0 0 1 35.5-6.7 214 214 0 0 1 35.8 3.5c11.4 1.9 21.1 3.9 29 6.1v155.2zm-108.7-77.2c0 16.4 3.6 34.6 10.8 42.2a36.7 36.7 0 0 0 27.9 11.4 59.5 59.5 0 0 0 31-8.7v-97.1c-2.8-.6-14.5-3-25.8-3.3a39 39 0 0 0-32.6 14.7c-7.5 9.3-11.3 25.6-11.3 40.8zm294.3 0c0 13.2-1.9 23.2-5.8 34.1s-9.4 20.2-16.5 27.9c-7.1 7.7-15.6 13.7-25.6 17.9s-25.4 6.6-33.1 6.6a102 102 0 0 1-32.9-6.6 74.5 74.5 0 0 1-25.5-17.9 92.8 92.8 0 0 1-22.6-62 107 107 0 0 1 5.8-36.7c4-10.8 9.6-20 16.8-27.7s15.8-13.6 25.6-17.8c9.9-4.2 20.8-6.2 32.6-6.2s22.7 2.1 32.7 6.2a71.5 71.5 0 0 1 25.6 17.8 82.5 82.5 0 0 1 16.6 27.7c4.2 10.8 6.3 23.5 6.3 36.7zm-40 .1c0-16.9-3.7-31-10.9-40.8a35.2 35.2 0 0 0-30.2-14.8c-12.9 0-23 4.9-30.2 14.8a69 69 0 0 0-10.7 40.8c0 17.1 3.6 28.6 10.8 38.5a35 35 0 0 0 30.2 14.9c12.9 0 23-5 30.2-14.9a61.4 61.4 0 0 0 10.8-38.5zm127.1 86.4c-64.1.3-64.1-51.8-64.1-60.1L1051 32l39.1-6.2v183.6c0 4.7 0 34.5 25.1 34.6v32.9zm68.9 0h-39.3V108.1l39.3-6.2v175zm-19.7-193.5a23.7 23.7 0 0 0 0-47.4 23.7 23.7 0 1 0 0 47.4zm117.4 18.6c12.9 0 23.8 1.6 32.6 4.8 8.8 3.2 15.9 7.7 21.1 13.4s8.9 13.5 11.1 21.7a100 100 0 0 1 3.4 27.1v100.6c-6 1.3-15.1 2.8-27.3 4.6s-25.9 2.7-41.1 2.7c-10.1 0-19.4-1-27.7-2.9-8.4-1.9-15.5-5-21.5-9.3a45 45 0 0 1-13.9-16.6c-3.3-6.8-5-16.4-5-26.4 0-9.6 1.9-15.7 5.6-22.3 3.8-6.6 8.9-12 15.3-16.2a65.8 65.8 0 0 1 22.4-9 128.3 128.3 0 0 1 55.4.8v-6.4c0-4.5-.5-8.8-1.6-12.8-1.1-4.1-3-7.6-5.6-10.7-2.7-3.1-6.2-5.5-10.6-7.2s-10-3-16.7-3a142.7 142.7 0 0 0-43.1 6.9l-4.7-32.1a170.2 170.2 0 0 1 51.9-7.7zm3.3 141.9c12 0 20.9-.7 27.1-1.9v-39.8a93.2 93.2 0 0 0-36.1-1.9c-4.4.6-8.4 1.8-11.9 3.5s-6.4 4.1-8.5 7.2a13.6 13.6 0 0 0-3.2 9.6c0 9.2 3.2 14.5 9 18a44.9 44.9 0 0 0 23.6 5.3zM512.9 103c12.9 0 23.8 1.6 32.6 4.8a52.2 52.2 0 0 1 21.1 13.4 52.1 52.1 0 0 1 11.1 21.7 100 100 0 0 1 3.4 27.1v100.6c-6 1.3-15.1 2.8-27.3 4.6a283.4 283.4 0 0 1-41.1 2.7c-10.1 0-19.4-1-27.7-2.9-8.4-1.9-15.5-5-21.5-9.3a45 45 0 0 1-13.9-16.6c-3.3-6.8-5-16.4-5-26.4 0-9.6 1.9-15.7 5.6-22.3 3.8-6.6 8.9-12 15.3-16.2a65.8 65.8 0 0 1 22.4-9 128.3 128.3 0 0 1 55.4.8v-6.4c0-4.5-.5-8.8-1.6-12.8-1.1-4.1-3-7.6-5.6-10.7a26.3 26.3 0 0 0-10.6-7.2c-4.4-1.7-10-3-16.7-3a142.7 142.7 0 0 0-43.1 6.9l-4.7-32.1c4.9-1.7 12.2-3.4 21.6-5.1 9.4-1.8 19.5-2.6 30.3-2.6zm3.4 142c12 0 20.9-.7 27.1-1.9v-39.8a93.2 93.2 0 0 0-36.1-1.9c-4.4.6-8.4 1.8-11.9 3.5s-6.4 4.1-8.5 7.2a13.6 13.6 0 0 0-3.2 9.6c0 9.2 3.2 14.5 9 18s13.7 5.3 23.6 5.3zm158.5 31.9c-64.1.3-64.1-51.8-64.1-60.1L610.6 32l39.1-6.2v183.6c0 4.7 0 34.5 25.1 34.6v32.9z\"/></svg>');\n    background-repeat: no-repeat;\n    background-size: contain;\n    vertical-align: middle;\n  }\n}\n\n.ais-search-box.ais-stalled-search {\n  .ais-search-box--magnifier-wrapper {\n    display: none;\n  }\n\n  .ais-search-box--loading-indicator-wrapper {\n    display: block;\n  }\n}\n\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_sort-by-selector.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(sort-by-selector) {\n  @include element(item) {\n    /* selector item */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_star-rating.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n$stars-color: #FBAE00;\n$stars-color-disabled: #C9C9C9;\n\n@include block(star-rating) {\n  @include element(header) {\n    /* widget header */\n  }\n  @include element(body) {\n    /* wudget footer */\n  }\n  @include element(list) {\n    /* item list */\n  }\n  @include element(item) {\n    /* list item */\n    vertical-align: middle;\n\n    @include modifier(active) {\n      /* active list item */\n      font-weight: bold;\n    }\n  }\n  @include element(star) {\n    /* item star */\n    display: inline-block;\n    width: 1em;\n    height: 1em;\n\n    &::before {\n      content: '\\2605';\n      color: $stars-color;\n    }\n\n    @include modifier(empty) {\n      /* empty star */\n      display: inline-block;\n      width: 1em;\n      height: 1em;\n\n      &::before {\n        content: '\\2606';\n        color: $stars-color;\n      }\n    }\n  }\n  @include element(link) {\n    /* item link */\n    @include modifier(disabled) {\n      /* disabled list item */\n      @include bem(star-rating, star) {\n        &::before {\n          color: $stars-color-disabled;\n        }\n      }\n      @include bem(star-rating, star, empty) {\n        &::before {\n          color: $stars-color-disabled;\n        }\n      }\n    }\n  }\n  @include element(count) {\n    /* item count */\n  }\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_stats.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(stats) {\n  @include element(header) {\n    /* widget header */\n  }\n  @include element(body) {\n    /* widget body */\n  }\n  @include element(time) {\n    /* processing time */\n  }\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_toggle.scss",
    "content": "// sass-lint:disable no-empty-rulesets\n@import \"../base\";\n@import \"variables\";\n\n@include block(toggle) {\n  @include element(header) {\n    /* widget header */\n  }\n  @include element(body) {\n    /* wudget body */\n  }\n  @include element(list) {\n    /* item list */\n  }\n  @include element(item) {\n    /* list item */\n    @include modifier(active) {\n      /* active list item */\n    }\n  }\n  @include element(label) {\n    /* item label */\n  }\n  @include element(checkbox) {\n    /* item checkbox */\n  }\n  @include element(count) {\n    /* item count */\n  }\n  @include element(footer) {\n    /* widget footer */\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/default/_variables.scss",
    "content": "$white: #FFFFFF;\n$gray-light: #F3F4F7;\n$blue-dark: #1F3B5D;\n$blue-light: #46AEDA;\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/instantsearch-theme-algolia.scss",
    "content": "@import 'theme/base';\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/instantsearch.scss",
    "content": "@import \"base\";\n@import \"default/search-box\";\n@import \"default/refinement-searchbox\";\n@import \"default/stats\";\n@import \"default/sort-by-selector\";\n@import \"default/hits\";\n@import \"default/pagination\";\n@import \"default/refinement-list\";\n@import \"default/menu\";\n@import \"default/toggle\";\n@import \"default/hierarchical-menu\";\n@import \"default/range-input\";\n@import \"default/range-slider\";\n@import \"default/star-rating\";\n@import \"default/price-ranges\";\n@import \"default/clear-all\";\n@import \"default/current-refined-values\";\n@import \"default/header-footer\";\n@import \"default/breadcrumb\";\n@import \"default/geo-search\";\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_base.scss",
    "content": "@import 'variables';\n@import 'clear-all';\n@import 'current-refined-values';\n@import 'hierarchical-menu';\n@import 'hits-per-page';\n@import 'menu';\n@import 'refinement-list';\n@import 'numeric-selector';\n@import 'pagination';\n@import 'price-ranges';\n@import 'range-input';\n@import 'range-slider';\n@import 'search-box';\n@import 'sort-by-selector';\n@import 'star-rating';\n@import 'stats';\n@import 'toggle';\n@import 'menu-select';\n@import 'breadcrumb';\n@import 'geo-search';\n\n[class^=\"ais-\"] {\n  box-sizing: border-box;\n\n  & > *,\n  & > *::after,\n  & > *::before {\n    box-sizing: border-box;\n  }\n}\n\n.ais-header {\n  border-bottom: 2px solid #EEE;\n  font-size: .8em;\n  margin: 0 0 6px;\n  padding: 0 0 6px;\n  text-transform: uppercase;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_breadcrumb.scss",
    "content": ".ais-breadcrumb--root {\n  .ais-breadcrumb--label,\n  .ais-breadcrumb--separator,\n  .ais-breadcrumb--home {\n    display: inline;\n    color: #3369E7;\n\n    div {\n      display: inline;\n    }\n  }\n\n  .ais-breadcrumb--disabledLabel {\n    color: rgb(68, 68, 68);\n    display: inline;\n  }\n\n  .ais-breadcrumb--separator {\n    position: relative;\n    display: inline-block;\n    height: 14px;\n    width: 14px;\n    &::after {\n      background: url(\"data:image/svg+xml;utf8,<svg viewBox='0 0 8 13' xmlns='http://www.w3.org/2000/svg'><path d='M1.5 1.5l5 4.98-5 5.02' stroke='%23697782' stroke-width='1.5' fill='none' fill-rule='evenodd' stroke-linecap='round' opacity='.4'/></svg>\") no-repeat center center / contain;\n      content: ' ';\n      display: block;\n      position: absolute;\n      top: 2px;\n      height: 14px;\n      width: 14px;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_clear-all.scss",
    "content": ".ais-clear-all {\n  &--link {\n    color: $white;\n    display: inline-block;\n    background: $blue;\n    border-radius: $border-radius;\n    font-size: $font-size;\n    text-decoration: none;\n    padding: 4px 8px;\n\n    &:hover {\n      text-decoration: none;\n      color: $white;\n      background: $dark-blue;\n    }\n  }\n\n  &--link-disabled {\n    opacity: .5;\n    pointer-events: none;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_current-refined-values.scss",
    "content": ".ais-current-refined-values {\n  &--clear-all {\n    @extend .ais-clear-all--link;\n    margin-bottom: 5px;\n  }\n\n  &--clear-all-disabled {\n    @extend .ais-clear-all--link-disabled;\n  }\n\n  &--item {\n    font-size: $font-size + 2px;\n    line-height: $font-size * 2.5;\n  }\n\n  &--link {\n    color: $light-blue;\n    text-decoration: none;\n\n    &:hover {\n      color: $dark-blue;\n      text-decoration: none;\n    }\n  }\n\n  &--count {\n    background: rgba(39, 81, 175, 0.1);\n    border-radius: 31px;\n    color: $light-blue;\n    padding: 2px 10px;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_geo-search.scss",
    "content": ".ais-geo-search {\n  position: relative;\n}\n\n.ais-geo-search--clear {\n  @extend .ais-clear-all--link;\n  box-shadow: 0 1px 1px 0 rgba(85, 95, 110, 0.2);\n  border: solid 1px #D4D8E3;\n  border-radius: $border-radius;\n  padding: 8px 15px;\n  position: absolute;\n  bottom: 20px;\n  left: 50%;\n  transform: translateX(-50%);\n\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n.ais-geo-search--control {\n  position: absolute;\n  top: 10px;\n  left: 50px;\n}\n\n.ais-geo-search--toggle-label {\n  @extend .ais-current-refined-values--item;\n  @extend .ais-refinement-list--label;\n  font-size: $font-size;\n  background: #FFFFFF;\n  box-shadow: 0 1px 1px 0 rgba(85, 95, 110, 0.2);\n  border: solid 1px #D4D8E3;\n  border-radius: $border-radius;\n  padding: 0 15px;\n}\n\n.ais-geo-search--redo {\n  @extend .ais-clear-all--link;\n  box-shadow: 0 1px 1px 0 rgba(85, 95, 110, 0.2);\n  border: solid 1px #D4D8E3;\n  border-radius: $border-radius;\n  padding: 8px 15px;\n\n  &:hover {\n    cursor: pointer;\n  }\n\n  &:disabled {\n    background: #A0B8F3;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_hierarchical-menu.scss",
    "content": ".ais-hierarchical-menu {\n  &--item {\n    @extend .ais-current-refined-values--item;\n\n    &__active > div > .ais-hierarchical-menu--link {\n      font-weight: bold;\n\n      &::after {\n        transform: rotate(90deg);\n      }\n    }\n  }\n\n  &--link {\n    @extend .ais-current-refined-values--link;\n    position: relative;\n\n    &::after {\n      background: url(\"data:image/svg+xml;utf8,<svg viewBox='0 0 8 13' xmlns='http://www.w3.org/2000/svg'><path d='M1.5 1.5l5 4.98-5 5.02' stroke='%23697782' stroke-width='1.5' fill='none' fill-rule='evenodd' stroke-linecap='round' opacity='.4'/></svg>\") no-repeat center center/contain;\n      content: ' ';\n      display: block;\n      position: absolute;\n      top: calc(50% - 14px / 2);\n      right: -22px;\n      height: 14px;\n      width: 14px;\n    }\n  }\n\n  &--count {\n    @extend .ais-current-refined-values--count;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_hits-per-page.scss",
    "content": "select.ais-hits-per-page-selector { // sass-lint:disable-line no-qualifying-elements\n  appearance: none;\n\n  background: $white url(\"data:image/svg+xml;utf8,<svg viewBox='0 0 12 7' xmlns='http://www.w3.org/2000/svg'><path d='M11 1L6.02 6 1 1' stroke-width='1.5' stroke='%23BFC7D8' fill='none' fill-rule='evenodd' stroke-linecap='round'/></svg>\") no-repeat center right 16px/10px;\n  box-shadow: 0 1px 1px 0 rgba(85, 95, 110, 0.2) !important;\n  border: solid 1px #D4D8E3 !important;\n  border-radius: $border-radius;\n  color: $grey;\n  font-size: $font-size;\n  transition: background 0.2s ease, box-shadow 0.2s ease;\n  padding: 8px 32px 8px 16px;\n  outline: none;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_menu-select.scss",
    "content": "select.ais-menu-select--select { // sass-lint:disable-line no-qualifying-elements\n  @extend select.ais-hits-per-page-selector; // sass-lint:disable-line no-qualifying-elements\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_menu.scss",
    "content": ".ais-menu {\n  &--item {\n    @extend .ais-current-refined-values--item;\n\n    &__active > div > .ais-menu--link {\n      font-weight: bold;\n    }\n  }\n\n  &--link {\n    @extend .ais-current-refined-values--link;\n  }\n\n  &--count {\n    @extend .ais-current-refined-values--count;\n  }\n\n  button {\n    background: transparent;\n    border: 0;\n    cursor: pointer;\n    font-size: $font-size - 1px;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_numeric-selector.scss",
    "content": "select.ais-numeric-selector { // sass-lint:disable-line no-qualifying-elements\n  @extend select.ais-hits-per-page-selector; // sass-lint:disable-line no-qualifying-elements\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_pagination.scss",
    "content": ".ais-pagination {\n  background: $white;\n  box-shadow: 0 1px 1px 0 rgba(85, 95, 110, 0.2);\n  border: solid 1px #D4D8E3;\n  border-radius: $border-radius;\n  display: inline-block;\n  padding: 8px 16px;\n  width: auto;\n\n  &--item {\n    border-radius: $border-radius;\n    font-size: $font-size + 2px;\n    text-align: center;\n    width: 28px;\n\n    &:hover {\n      background: rgba(39, 81, 175, .1);\n    }\n\n    &__disabled {\n      color: #BBB;\n      opacity: .5;\n      pointer-events: none;\n      visibility: visible;\n    }\n\n    &__active {\n      background: $blue;\n\n      .ais-pagination--link {\n        color: $white;\n      }\n    }\n  }\n\n  &--link {\n    color: $grey;\n    display: block;\n    text-decoration: none;\n    width: 100%;\n\n    &:hover {\n      color: $blue;\n      text-decoration: none;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_price-ranges.scss",
    "content": ".ais-price-ranges {\n  &--item {\n    font-size: $font-size + 2px;\n    line-height: $font-size * 2;\n\n    &__active {\n      font-weight: bold;\n    }\n  }\n\n  &--link {\n    @extend .ais-current-refined-values--link;\n  }\n\n  &--form {\n    margin-top: 10px;\n  }\n\n  &--input {\n    background: $white;\n    box-shadow: inset 0 1px 1px 0 rgba(85, 95, 110, 0.2);\n    border: solid 1px #D4D8E3;\n    border-radius: $border-radius;\n    outline: none;\n  }\n\n  &--button {\n    @extend .ais-clear-all--link;\n    border: 0;\n    outline: none;\n    margin-left: 5px;\n    position: relative;\n    top: -2px;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_range-input.scss",
    "content": ".ais-range-input {\n  &--inputMin,\n  &--inputMax {\n    background: $white;\n    box-shadow: inset 0 1px 1px 0 rgba(85, 95, 110, 0.2);\n    border: solid 1px #D4D8E3;\n    border-radius: $border-radius;\n    outline: none;\n  }\n\n  &--submit {\n    @extend .ais-clear-all--link;\n    border: none;\n    outline: none;\n    margin-left: 5px;\n    position: relative;\n    top: -2px;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_range-slider.scss",
    "content": ".ais-range-slider {\n  &--handle {\n    border: 1px solid $blue;\n  }\n\n  .rheostat-progress {\n    background-color: $blue !important;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_refinement-list.scss",
    "content": ".ais-refinement-list {\n  &--item {\n    @extend .ais-current-refined-values--item;\n    line-height: $font-size * 2;\n\n    &__active > div > .ais-refinement-list--label {\n      font-weight: bold;\n    }\n  }\n\n  &--label {\n    @extend .ais-current-refined-values--link;\n    cursor: pointer;\n\n    input[type=\"radio\"], // sass-lint:disable-line no-qualifying-elements force-attribute-nesting\n    input[type=\"checkbox\"] { // sass-lint:disable-line no-qualifying-elements force-attribute-nesting\n      margin-right: 5px;\n    }\n  }\n\n  &--count {\n    @extend .ais-current-refined-values--count;\n  }\n\n  div > button {\n    background: transparent;\n    border: 0;\n    cursor: pointer;\n    font-size: $font-size - 1px;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_search-box.scss",
    "content": ".ais-search-box {\n  display: inline-block;\n  position: relative;\n  height: 46px;\n  white-space: nowrap;\n  font-size: 14px;\n\n\n  &--input {\n    appearance: none;\n    font: inherit;\n    background: $white;\n    color: $black;\n    display: inline-block;\n    border: 1px solid #D4D8E3;\n    border-radius: $border-radius;\n    box-shadow: 0 1px 1px 0 rgba(85, 95, 110, 0.2);\n    transition: box-shadow .4s ease, background .4s ease;\n    padding: 10px 10px 10px 35px;\n    vertical-align: middle;\n    white-space: normal;\n    height: 100%;\n    width: 100%;\n\n    &:focus {\n      box-shadow: none;\n      outline: 0;\n    }\n  }\n\n  &--reset {\n    fill: #BFC7D8;\n    top: calc(50% - 12px / 2);\n    right: 13px;\n  }\n\n  &--magnifier {\n    fill: #BFC7D8;\n    left: 12px;\n    top: calc(50% - 18px / 2);\n\n    svg {\n      height: 18px;\n      width: 18px;\n    }\n  }\n\n  &--loading-indicator-wrapper {\n    fill: #BFC7D8;\n    left: 12px;\n    top: calc(50% - 18px / 2);\n\n    svg {\n      height: 18px;\n      width: 18px;\n    }\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_sort-by-selector.scss",
    "content": "select.ais-sort-by-selector { // sass-lint:disable-line no-qualifying-elements\n  @extend select.ais-hits-per-page-selector; // sass-lint:disable-line no-qualifying-elements\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_star-rating.scss",
    "content": ".ais-star-rating {\n  &--item {\n    @extend .ais-current-refined-values--item;\n  }\n\n  &--link {\n    @extend .ais-current-refined-values--link;\n  }\n\n  &--count {\n    @extend .ais-current-refined-values--count;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_stats.scss",
    "content": ".ais-stats {\n  color: $grey;\n  font-size: $font-size + 2px;\n  opacity: .6;\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_toggle.scss",
    "content": ".ais-toggle {\n  &--item {\n    @extend .ais-current-refined-values--item;\n\n    &__active {\n      font-weight: bold;\n    }\n  }\n\n  &--label {\n    @extend .ais-refinement-list--label;\n  }\n\n  &--count {\n    @extend .ais-current-refined-values--count;\n  }\n}\n"
  },
  {
    "path": "src/assets/stylesheets/vendor/instantsearch/theme/_variables.scss",
    "content": "// +--------+\n// | LAYOUT |\n// +--------+\n$border-radius: 4px;\n$font-size: 12px;\n\n// +--------+\n// | COLORS |\n// +--------+\n$white: #FFFFFF;\n$black: #000000;\n$light-blue: #3E82F7;\n$blue: #3369E7;\n$dark-blue: #184ECD;\n$grey: #697782;\n"
  },
  {
    "path": "src/atom.xml",
    "content": "---\nlayout: atom_feed\nlimit: 25\ntitle: \"Feed\"\nsitemap: false\n---\n"
  },
  {
    "path": "src/browserconfig.xml",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<browserconfig>\n  <msapplication>\n    <tile>\n      <square150x150logo src=\"/assets/images/mstile-150x150.png?v=9BPnoQEY43\"/>\n      <TileColor>#000000</TileColor>\n    </tile>\n  </msapplication>\n</browserconfig>\n"
  },
  {
    "path": "src/feed.json",
    "content": "---\nlayout: json_feed\nlimit: 25\ntitle: \"Feed\"\nsitemap: false\n---\n"
  },
  {
    "path": "src/humans.txt",
    "content": "---\n---\n_  ________ ____   _  ______________  _________\n|\\/||__||  \\|___   |\\/||[__  | |__||_/ |___[__\n|  ||  ||__/|___   |  ||___] | |  || \\_|______]\n\n  MADEMISTAKES.COM\n\n  Designer:     Michael Rose\n  Twitter:      @mmistakes\n  Location:     Buffalo, New York USA\n\n  Last updated: {{ site.time }}\n  Language:     English\n  Built with:   Jekyll {{ jekyll.version }} <https://jekyllrb.com>\n                Visual Studio Code <https://code.visualstudio.com>\n                Adobe Creative Suite\n                Gulp <https://gulpjs.com>\n                Netlify CI <https://www.netlify.com/>\n                SimpleIcon <http://www.flaticon.com>\n                Noun Project <https://thenounproject.com>\n                Algolia <https://www.algolia.com>\n"
  },
  {
    "path": "src/index.md",
    "content": "---\nlayout: home\nexcerpt: \"Making stuff one mistake at a time.\"\nsection:\n  - title: \"A faux pas\"\n    class: \"section__inverse section__about\"\n    image: /assets/images/michael-rose-glitched-feature.jpg\n    introduction: |\n      I'm just another boring, tattooed, *time traveling designer* from Buffalo New York. I enjoy eating chicken wings, sketching on an iPad Pro, and playing console games.\n    actions:\n      - label: \"about Michael →\"\n        url: \"/about/\"\n  - title: \"Writing\"\n    class: \"section__inverse section__articles\"\n    image: /assets/images/blog-articles.jpg\n    introduction: |\n      A collection of thoughts, inspiration, mistakes, and other minutia I've written. Topics covered include [*web development*](tag/web-development/), [*Jekyll tutorials*](/tag/jekyll/), [*Mastering Paper*](/mastering-paper/), [*design*](/tag/design/), [#TIL](/tag/til/), and [more](/tag/).\n    actions:\n      - label: \"the archives →\"\n        url: \"/articles/\"\n  - title: \"Works\"\n    class: \"section__inverse section__work\"\n    image: /assets/images/procreate-paintings-glitched-feature.jpg\n    introduction: |\n      A hand-picked selection of things I've designed, illustrated, and developed.\n    actions:\n      - label: \"see more →\"\n        url: \"/work/\"\nimage:\n  facebook: \"/assets/images/android-chrome-384x384.png\"\n  twitter: \"/assets/images/android-chrome-384x384.png\"\ntwitter:\n  card: summary\ndate: 2016-08-26\nlast_modified_at: 2019-02-16T10:21:51-05:00\n---\n"
  },
  {
    "path": "src/mastering-paper.xml",
    "content": "---\nlayout: atom_feed\ncategory_limit: mastering-paper\nlimit: 25\ntitle: \"Mastering Paper for iOS Feed\"\nsitemap: false\n---\n"
  },
  {
    "path": "src/notes.xml",
    "content": "---\nlayout: atom_feed\ncategory_limit: notes\nlimit: 25\ntitle: \"Notes Feed\"\nsitemap: false\n---\n"
  },
  {
    "path": "src/paperfaces.xml",
    "content": "---\nlayout: atom_feed\ncategory_limit: paperfaces\nlimit: 25\ntitle: \"PaperFaces Feed\"\nsitemap: false\n---\n"
  },
  {
    "path": "src/procreate-paintings.xml",
    "content": "---\nlayout: atom_feed\ncategory_limit: procreate-paintings\nlimit: 25\ntitle: \"Procreate Paintings Feed\"\nsitemap: false\n---\n"
  },
  {
    "path": "src/robots.txt",
    "content": "---\n---\nUser-agent: *\nDisallow: /cdn-cgi/\nSitemap: {{ site.url }}/sitemap.xml\n"
  },
  {
    "path": "src/site.webmanifest",
    "content": "{\n  \"name\": \"Made Mistakes\",\n  \"short_name\": \"Made Mistakes\",\n  \"icons\": [\n    {\n      \"src\": \"/assets/images/android-chrome-192x192.png?v=9BPnoQEY43\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image/png\"\n    },\n    {\n      \"src\": \"/assets/images/android-chrome-256x256.png?v=9BPnoQEY43\",\n      \"sizes\": \"256x256\",\n      \"type\": \"image/png\"\n    }\n  ],\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#000000\"\n}\n"
  },
  {
    "path": "staticman.yml",
    "content": "# Name of the property. You can have multiple properties with completely\n# different config blocks for different sections of your site.\n# For example, you can have one property to handle comment submission and\n# another one to handle posts.\n# To encrypt strings use the following endpoint:\n# https://api.staticman.net/v2/encrypt/{TEXT TO BE ENCRYPTED}\n\ncomments:\n  # (*) REQUIRED\n  #\n  # Names of the fields the form is allowed to submit. If a field that is\n  # not here is part of the request, an error will be thrown.\n  allowedFields: [\"name\", \"email\", \"url\", \"message\", \"replying_to\"]\n\n  # (*) REQUIRED WHEN USING NOTIFICATIONS\n  #\n  # When allowedOrigins is defined, only requests sent from one of the domains\n  # listed will be accepted. The origin is sent as part as the `options` object\n  # (e.g. <input name=\"options[origin]\" value=\"http://yourdomain.com/post1\")\n  allowedOrigins: [\"mademistakes.com\"]\n\n  # (*) REQUIRED\n  #\n  # Name of the branch being used. Must match the one sent in the URL of the\n  # request.\n  branch: \"master\"\n\n  commitMessage: \"New comment by {fields.name}\"\n\n  # (*) REQUIRED\n  #\n  # Destination path (filename) for the data files. Accepts placeholders.\n  filename: \"comment-{@timestamp}\"\n\n  # The format of the generated data files. Accepted values are \"json\", \"yaml\"\n  # or \"frontmatter\"\n  format: \"yaml\"\n\n  # List of fields to be populated automatically by Staticman and included in\n  # the data file. Keys are the name of the field. The value can be an object\n  # with a `type` property, which configures the generated field, or any value\n  # to be used directly (e.g. a string, number or array)\n  generatedFields:\n    date:\n      type: \"date\"\n      options:\n        format: \"iso8601\"\n\n  # Whether entries need to be approved before they are published to the main\n  # branch. If set to `true`, a pull request will be created for your approval.\n  # Otherwise, entries will be published to the main branch automatically.\n  moderation: true\n\n  # Akismet spam detection.\n  # akismet:\n  #   enabled: true\n  #   author: \"name\"\n  #   authorEmail: \"email\"\n  #   authorUrl: \"url\"\n  #   content: \"message\"\n  #   type: \"comment\"\n\n  # Name of the site. Used in notification emails.\n  name: \"mademistakes.com\"\n\n  # Notification settings. When enabled, users can choose to receive notifications\n  # via email when someone adds a reply or a new comment. This requires an account\n  # with Mailgun, which you can get for free at http://mailgun.com.\n  notifications:\n    # Enable notifications\n    enabled: true\n\n    # (!) ENCRYPTED\n    #\n    # Mailgun API key\n    # apiKey: \"z49fOBsWoIHdVjIOEVWF/zx6wfUgsNdCoJkjB+9bzrd97Tis1OpE87k9vFmHEb7I9FfDMSW9KV+TbB6SSfT8l+EP9WKVH5/u/SxaBRz212a3QZzQVGqQB7PrfmYcgtsgOO0Wb59ApWwRGRHSZilMKXHg+wV2pqCno13RrrejRQU=\"\n\n    # (!) ENCRYPTED\n    #\n    # Mailgun domain (encrypted)\n    # domain: \"WNnxjkTBQjlZvGmm95NXKL7iCy2ConWTaL1wkUoO4LJcOuWX0iKz0aDmKZdsl0MTH1TAjGLAEbCMIEzDkcaJFkbxNDwouRADfa57/jGWx+PTRhGs4C3nLEHMGNjxnOzjnQR/2x79SpVVmvosMy+g6EgqxlvVxKkqbjUaaWF4zSE=\"\n\n  # (*) REQUIRED\n  #\n  # Destination path (directory) for the data files. Accepts placeholders.\n  path: \"src/_data/comments/{options.slug}\"\n\n  # Names of required files. If any of these isn't in the request or is empty,\n  # an error will be thrown.\n  requiredFields: [\"name\", \"email\", \"message\"]\n\n  # List of transformations to apply to any of the fields supplied. Keys are\n  # the name of the field and values are possible transformation types.\n  transforms:\n    email: md5\n\n  # reCaptcha\n  reCaptcha:\n    enabled: true\n    siteKey: \"6LdRBykTAAAAAFB46MnIu6ixuxwu9W1ihFF8G60Q\"\n    secret: \"PznnZGu3P6eTHRPLORniSq+J61YEf+A9zmColXDM5icqF49gbunH51B8+h+i2IvewpuxtA9TFoK68TuhUp/X3YKmmqhXasegHYabY50fqF9nJh9npWNhvITdkQHeaOqnFXUIwxfiEeUt49Yoa2waRR7a5LdRAP3SVM8hz0KIBT4=\"\n"
  }
]