Generates screenshots of a website based on git history

screen, capture, video
pip install polished==0.0.15



Polished Example Video

The goal of polished is to show the awesome progression and amount of tweaks that go into any website. My resume is a good example, dozens of hours of work and tweaking to come up with this pretty basic final product. Showing that blood, sweat and hilarious tears in between should be pretty entertaining. Watch pages undulate, stretch, break, grow, and shrink into place.

More explanation available on my blog.

Table of Contents

  1. How does it work?
  2. Installing
  3. Usage
  4. Configuring
  5. Backends
  6. Custom Backend Example
  7. Polishing ugly screenshots
  8. Known Issues
  9. Acknowledgements

How does polished work?

  1. Fires up selected backend (for example, PelicanBackend if you use the Pelican blog site generator)
  2. Gets the git revision history
  3. Iterates through that history, prepares the page, screen caps it
  4. Converts images to video
  5. OPTIONALLY: If after reviewing the images/video you find bugs, inherit a backend and @polish out the kinks so it's a nice smooth video



  1. Mac/Linux
  2. NodeJS
  3. PhantomJS
  4. ffmpeg


> pip install polished


For a static website with no .html generation needed and index.html is in the same dir:

> polished

For a static website with index.html in another location

> polished "some/path/to/index.html"

For a pelican blog:

> polished "output/index.html" --backend polished.backends.pelican.PelicanBackend

Configuring behavior

The default backend is SimpleBackend which (with no path specified) looks for "index.html" in current directory and expects static html without any steps needed to generate the page. This default setup probably doesn't work for most projects.

To expand the behavior, call polished my/output/index.html --backend my.backend.Backend



The most basic backend, assumes no steps are needed to generate HTML.



For the Pelican blogging system, calls make html between screenshots.



For the Django framework, calls python syncdb --migrate


Custom backend example

Generally, on a simple website these backends will care of you, however you may have to inherit them and add custom behavior

from polished.backends import PelicanBackend

class SomeWeirdBehaviorRequired(PelicanBackend):
    def prepare(self):
        Prepare your general stuff here! Generate HTML, setup static files, etc.

    def cleanup(self):
        Clean up after yourself, delete static files if you need to

Polishing ugly screenshots

Use the @polish decorator:

from import By
from import WebDriverWait
from import expected_conditions as EC

from polished.backends import PelicanBackend
from polished.decorators import polish

class SomeWeirdBehaviorRequired(PelicanBackend):
    def _patch_image_srcs(self):
        wait = WebDriverWait(self.DRIVER, 10)
        element = wait.until(EC.visibility_of_element_located((By.TAG_NAME, 'img')))

            var img_array = document.getElementsByTagName('img');

            for(var i=0; i<img_array.length; i++) {
                var href_replaced = img_array[i].getAttribute('src').replace(
                img_array[i].setAttribute("src", href_replaced);

    @polish(urls=["output/pages/about.html"], commit_indexes=range(112, 135))
    def fix_about_me_broken_images(self):

    @polish(urls=["output/pages/resume.html"], commit_indexes=range(68,134))
    def fix_resume_page_broken_images(self):

@polish range of commit indexes

def some_func():
    # Polish commits 20 through 30

@polish certain pages

@polish(urls=["index.html", "about.html"])
def some_func():
    # Fix up something with "index.html" and "about.html"

@polish certain pages of certain commits

@polish(urls=["index.html", "about.html"], commit_indexes=range(20,30))
def some_func():
    # Fix up something with "index.html" and "about.html", but only in commits 20 through 30

Known issues

  • It leaves a ton of processes still running for some reason
  • Web fonts don't work right with PhantomJS


Couldn't have done it without this screenshot script by Aamir Adnan

Thanks Levi Thomason for always listening to me, encouraging me to improve, and helping me out in all aspects of life