{"id":29606,"date":"2022-02-03T13:02:53","date_gmt":"2022-02-03T18:02:53","guid":{"rendered":"https:\/\/studentwork.prattsi.org\/infovis\/?p=29606"},"modified":"2022-02-03T13:05:07","modified_gmt":"2022-02-03T18:05:07","slug":"visualizing-the-history-of-studio-ghibli","status":"publish","type":"post","link":"https:\/\/studentwork.prattsi.org\/infovis\/labs\/timelines\/visualizing-the-history-of-studio-ghibli\/","title":{"rendered":"Visualizing the History of Studio Ghibli"},"content":{"rendered":"\n

Introduction<\/strong><\/h2>\n\n\n\n

When we were given the task of creating a timeline, I selected animation which lies at the intersection of human imagination, design, and technology. One often thinks of Disney and Pixar in this field, but a studio that has surpassed the cultural and geographic bounds to capture people\u2019s imagination is Studio Ghibli. The word Ghibli is Italian for \u201cHot Saharan Wind\u201d and the founders Miyazaki Hayao and Takahata Isao and producer Suzuki Toshio wanted it to blow a new wind in the world of animation. <\/p>\n\n\n\n

After 20 films and multiple accolades which include winning the Academy Award and Golden Bear, the studio has explored storytelling in almost a poetic way that explores the depth of human experiences. This timeline traces the growth of the studio and tracks the milestones that have led to the massive fandom and clout that it has today.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
\n
View the tIMELINE<\/a><\/div>\n<\/div>\n\n\n\n

<\/p>\n\n\n\n

<\/p>\n\n\n\n

Materials<\/strong><\/h2>\n\n\n\n

The timeline was built using Timeline.js by Knight Labs which allows you to build visually rich representations using a google spreadsheet. The data needs to be manually entered in the respective fields and linked to the tool. It also allows you to integrate media from a variety of sources like Youtube, Vimeo, Giphy, Wikipedia, etc. <\/p>\n\n\n\n

\"\"
The Google spreadsheet used to input the data & media<\/figcaption><\/figure>\n\n\n\n

<\/p>\n\n\n\n

Process<\/strong><\/h2>\n\n\n\n

The process of creating the timeline started with collecting data and researching the studio\u2019s history. A few of the articles consulted were:<\/p>\n\n\n\n

\"\"
The Articles referenced for creating the timeline<\/figcaption><\/figure>\n\n\n\n

Based on this data, I organized the information into chronological order and researched further to fill in any gaps. This Data was then added to the Timeline.js spreadsheet. After this, I found the media corresponding to each data point and added that too. In order to make this experience more immersive, the background for each slide was based on the individual color palette of each movie or topic. I found an interesting article which had studied the studio ghibli colors and extracted the palette from here.<\/p>\n\n\n\n

\"\"
Color Palette extracted for each movie referenced by Nygren, B. E. (2015, March 25). The Colors of Studio Ghibli<\/em>. Design Made in Japan. http:\/\/designmadeinjapan.com\/magazine\/graphic-design\/the-rich-colors-of-studio-ghibli\/<\/figcaption><\/figure>\n\n\n\n

<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n

<\/p>\n\n\n\n

Results<\/strong><\/h2>\n\n\n\n

The idea behind the timeline was to take the viewer on a journey across Studio Ghibli\u2019s history which would convey the mood and experience of each milestone. This was achieved through the use of media like images, videos, and gifs and also by the visual representation using colors.<\/p>\n\n\n\n

\"\"
http:\/\/spiritedaway15.com<\/figcaption><\/figure>\n\n\n\n

The milestones were the movies released by the studio since its inception in 1985. Each movie had a complex theme associated with it whether it was the search for independence in Kiki\u2019s delivery service<\/em> or Anti War sentiment in Howl\u2019s moving castle<\/em>. Some movies propelled the studio to success like Kiki\u2019s delivery service<\/em> which was the studio\u2019s first major blockbuster and Spirited Away<\/em> which won an Academy Award and Golden Bear award. Whereas some like Grave of Fireflies<\/em> even though very cinematically acclaimed brought the studio to the brink of bankruptcy.<\/p>\n\n\n\n

The timeline allowed me to explore the growth of the studio and represent how animated movies even though targeted towards children often have extremely complex and thought-provoking themes. <\/p>\n\n\n\n

\"\"
http:\/\/spiritedaway15.com<\/figcaption><\/figure>\n\n\n\n

Reflection<\/strong><\/h2>\n\n\n\n

Looking back at this project I enjoyed using this tool and found this to be interactive and visually appealing for representing chronological information. I struggled mainly with understanding how to integrate media in the timeline and resisting the urge to refresh the page immediately after integrating changes and expecting it to reflect in a split second. I would also like if changing the typefaces was easier in this tool to give more flexibility while designing along with the ability to modify media placement.<\/p>\n\n\n\n

In terms of future scope, I would like to cover this topic more exhaustively and cover more milestones. I would also like to experiment with the styling more and modify the CSS of the timeline. <\/p>\n\n\n\n

<\/p>\n\n\n\n

References<\/strong><\/h2>\n\n\n\n

Bauer, P. (n.d.). Studio Ghibli | History, Film, & Facts<\/em>. Encyclopedia Britannica. https:\/\/www.britannica.com\/topic\/Studio-Ghibli<\/p>\n\n\n\n

Beghin, C. (2020, March 18). Studio Ghibli: Everything to know about the Japanese animation studio<\/em>. Vogue France. https:\/\/www.vogue.fr\/fashion-culture\/article\/studio-ghibli-everything-to-know-japanese-animation<\/p>\n\n\n\n

Lawson, K. (2017, December 9). A Brief History of Studio Ghibli<\/em>. The Film Magazine. https:\/\/www.thefilmagazine.com\/a-brief-history-of-studio-ghibli\/<\/p>\n\n\n\n

Nygren, B. E. (2015, March 25). The Colors of Studio Ghibli<\/em>. Design Made in Japan. http:\/\/designmadeinjapan.com\/magazine\/graphic-design\/the-rich-colors-of-studio-ghibli\/<\/p>\n\n\n\n

Taggart, E. (2021, January 21). Studio Ghibli: Everything You Need To Know About Legendary Japanese Animation House<\/em>. My Modern Met. https:\/\/mymodernmet.com\/history-of-studio-ghibli\/<\/p>\n","protected":false},"excerpt":{"rendered":"

Introduction When we were given the task of creating a timeline, I selected animation which lies at the intersection of human imagination, design, and technology. One often thinks of Disney and Pixar in this field, but a studio that has surpassed the cultural and geographic bounds to capture people\u2019s imagination is Studio Ghibli. The word Ghibli…<\/p>\n","protected":false},"author":3963,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[339],"tags":[],"coauthors":[1749],"class_list":["post-29606","post","type-post","status-publish","format-standard","hentry","category-timelines"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/paBdcV-7Hw","_links":{"self":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/29606","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/users\/3963"}],"replies":[{"embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/comments?post=29606"}],"version-history":[{"count":23,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/29606\/revisions"}],"predecessor-version":[{"id":29730,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/posts\/29606\/revisions\/29730"}],"wp:attachment":[{"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/media?parent=29606"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/categories?post=29606"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/tags?post=29606"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/studentwork.prattsi.org\/infovis\/wp-json\/wp\/v2\/coauthors?post=29606"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}