{"id":289,"date":"2016-10-02T23:26:00","date_gmt":"2016-10-03T06:26:00","guid":{"rendered":"http:\/\/miriamposner.com\/classes\/dh101f16\/?p=289"},"modified":"2016-10-03T11:18:26","modified_gmt":"2016-10-03T18:18:26","slug":"week-1-post-reverse-engineer-inventing-abstraction","status":"publish","type":"post","link":"https:\/\/miriamposner.com\/classes\/dh101f16\/2016\/10\/02\/week-1-post-reverse-engineer-inventing-abstraction\/","title":{"rendered":"Week 1 Post: Reverse Engineer &#8220;Inventing Abstraction&#8221;"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" class=\"alignleft wp-image-290 size-medium\" src=\"http:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.20.11-PM-300x188.png\" alt=\"screen-shot-2016-10-02-at-11-20-11-pm\" width=\"300\" height=\"188\" srcset=\"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.20.11-PM-300x188.png 300w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.20.11-PM-768x480.png 768w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.20.11-PM-1024x640.png 1024w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.20.11-PM-1200x750.png 1200w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.20.11-PM.png 1440w\" sizes=\"auto, (max-width: 300px) 85vw, 300px\" \/><br \/>\n<a href=\"http:\/\/www.moma.org\/interactives\/exhibitions\/2012\/inventingabstraction\/?page=home\">Inventing Abstraction (1910-1925)<\/a> is an accompanying website for the Museum of Modern Art\u2019s exhibition \u201cInventing Abstraction, 1910-1925\u201d. While the exhibition aims to bring together works across countries and genres during the early years of abstraction to demonstrate how the style has emerged and developed, the website expands the framework by focusing on the relationships between the abstract artists behind the works and how their creativities might be sparkled within the intertwining network of their personal connections.<\/p>\n<p>Various sources build up the content of the website. First, diversified portfolios consisting of images of artistic works like paintings or sculptures, audio recording of poems, video extract of non-narrative dances, a few supplemented by audio guides that give additional commentaries on the works. While the audio guides are exclusively provided by Acoustiguide, a company creating interactive guide tours for museums or historical sites, the sources of the portfolios are from not only the Museum of Modern Art but also private collections, museums and institutions around the world. Besides the portfolios, texts that elaborate on the artists\u2019 biographies are created by the team at the Museum of Modern Art, along with podcasts and videos that shed more light on other artists\u2019 views of the exhibits and the inspiration behind the website project respectively.<\/p>\n<p>The sources are then processed by the computer. Basic processes include digitization of photos, sounds, and videos under each artist\u2019s portfolio. To construct the network between artists, their names are entered into an excel spreadsheet that marks whether a relationship exists between one and another. The data exported from the spreadsheet forms the basis of the network graph where people with more connections are differentiated from those with less, a characteristic underscored by further visualizations in design. The artists are tagged with geographical and personal markers including \u201cyear of birth and death\u201d, \u201cbirthplace\u201d, \u201cplaces worked\u201d, and \u201cinterests\u201d that, along with the portfolio, make up a full artist profile. Their names are also catalogued in alphabetical orders. The whole data are then modeled based on the software created by Columbia University.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignleft wp-image-291 size-medium\" src=\"http:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.22.15-PM-300x188.png\" width=\"300\" height=\"188\" srcset=\"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.22.15-PM-300x188.png 300w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.22.15-PM-768x480.png 768w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.22.15-PM-1024x640.png 1024w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.22.15-PM-1200x750.png 1200w, https:\/\/miriamposner.com\/classes\/dh101f16\/wp-content\/uploads\/sites\/5\/2016\/10\/Screen-Shot-2016-10-02-at-11.22.15-PM.png 1440w\" sizes=\"auto, (max-width: 300px) 85vw, 300px\" \/>The interface of the website delivers an intuitive experience for the users. When one first enters the website, the home page introduces the early emergence of abstraction across different media, hinting at the idea conveyed later by the network graph that connections between artists of different fields lead to the development of abstraction. The button \u201cExplore Connections\u201d is placed in the lower right corner, a space arrangement that guides users to read the introductory texts in the middle first and thus equips users with the background knowledge to comprehend the significance of the network graph. The network graph is the heart of the website. The moment users leave the home page, they are taken to the page with the graph, with an \u201cOverview\u201d pane only automatically opened once that explains the logics behind the graph. The exploration of the network graph overall is a nonintrusive experience as buttons on the bottom navigation bar and on artists&#8217; names\u00a0on the network graph as nodes do not lead\u00a0to separate webpages but the contents open side-by-side with the graph. Besides the UX design, the UI design also delivers an intuitive\u00a0experience. The designers behind the project use Adobe Illustrator to construct the visual design of the contents. The color theme of \u201cred\u201d, \u201civory\u201d and \u201cblack\u201d is used consistently throughout the design of the website and of the graph. \u201cRed&#8221; marks only certain names\u00a0within the artist catalogue and their corresponding nodes within the network graph to emphasize\u00a0artists who have the most\u00a0connections, or also the node of an artist that\u00a0users click on, which then\u00a0becomes the central node of his or her personal connections. The combination of UX and UI design therefore guides the users to understand the significance of the network structure behind the emergence\u00a0of abstraction and how being in a network can foster creativity.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Inventing Abstraction (1910-1925) is an accompanying website for the Museum of Modern Art\u2019s exhibition \u201cInventing Abstraction, 1910-1925\u201d. While the exhibition aims to bring together works across countries and genres during &hellip; <a href=\"https:\/\/miriamposner.com\/classes\/dh101f16\/2016\/10\/02\/week-1-post-reverse-engineer-inventing-abstraction\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Week 1 Post: Reverse Engineer &#8220;Inventing Abstraction&#8221;&#8221;<\/span><\/a><\/p>\n","protected":false},"author":74,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[1],"tags":[],"class_list":["post-289","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/posts\/289","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/users\/74"}],"replies":[{"embeddable":true,"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/comments?post=289"}],"version-history":[{"count":0,"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/posts\/289\/revisions"}],"wp:attachment":[{"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/media?parent=289"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/categories?post=289"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/miriamposner.com\/classes\/dh101f16\/wp-json\/wp\/v2\/tags?post=289"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}