rasagy / 500days

Visualizing the narrative of 500 Days of Summer (Movie)

Home Page:http://rasagy.in/500days

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

500 days of Summer

Visualizing the narrative of 500 Days of Summer (Movie)

Final Visualization: http://rasagy.in/500days

Read more about the process here: Visualizing 500 days of Summer: Process

How to run locally

  1. Use git clone, Github Desktop or download the repository

image

  1. Navigate to the directory you saved/cloned the repo in via command prompt (Windows)/terminal (Mac) and start a Python server

image

If you’re on Windows:

  • Install Python
  • Open command prompt (Win+R → cmd (press enter))
  • Navigate to the folder
  • Run either python3 -m http.server (Python 3+) or python -m SimpleHTTPServer (Python 2)

If you’re on Mac:

  • Open terminal
  • Navigate to the folder
  • Run python -m SimpleHTTPServer

You’ll get the url that this is hosted on locally — in the screenshot above it is http://0.0.0.0:8000/ . This will run this as if it’s running on a server (thus allowing you to use the .js files that might not work otherwise).

Future directions

  • Add Play button instead of auto-play
  • Add description during animation (Desc/quotes/short text) (HT Prakhar)
  • Add Explanatory text below the viz (What/How/Who)
  • Create Print poster (A4?)
  • Create Physical Visualization (HT Venkat)
  • Add icons for each scene (Maybe!)
  • Consolidate the findings into a paper (HT Venkat)

About

Visualizing the narrative of 500 Days of Summer (Movie)

http://rasagy.in/500days


Languages

Language:HTML 49.1%Language:JavaScript 36.0%Language:CSS 14.9%