Difference between revisions of "Publisher:Reinvented"
| (3 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
= | =REINVENTED.WDKA.NL= | ||
'''The Art School Reinvented: Autonomous, Commercial, and Social Practices''' | '''The Art School Reinvented: Autonomous, Commercial, and Social Practices'''<br /> | ||
Developed by Lasse van den Bosch Christensen and Marlon Harder. | |||
[http://template01.info (Template)] | |||
<br /> | <br /> | ||
<br /> | <br /> | ||
[[File:Reinvented.jpg| | [[File:Reinvented.jpg|250px|thumb|left]] [[File:Reinvented Web.png|250px|thumb|left]] | ||
The Art School Reinvented is a hybrid publication that serves as a showcase for Willem de Kooning Academy’s practices programme. It contains a selection of student work created within the autonomous, commercial and social majors. In 2013 the academy published Reinventing the Art School, 21st Century, a selection of critical texts that contextualize the schools updated programme. Reinvented presents some of the first results of this restructure. | |||
''The Art School Reinvented'' is a hybrid publication that serves as a showcase for Willem de Kooning Academy’s practices programme. It contains a selection of student work created within the autonomous, commercial and social majors. In 2013 the academy published ''Reinventing the Art School, 21st Century'', a selection of critical texts that contextualize the schools updated programme. Reinvented presents some of the first results of this restructure. | |||
We worked together with WdKA’s Hybrid Publishing to create an ongoing online and offline publication. A website with articles that can be sorted, selected, combined and printed at any time. At different intervals this website will bring about a printed publication, showcasing not just the work of recent graduates, but also the publishing and printing facilities of the school. | We worked together with WdKA’s Hybrid Publishing to create an ongoing online and offline publication. A website with articles that can be sorted, selected, combined and printed at any time. At different intervals this website will bring about a printed publication, showcasing not just the work of recent graduates, but also the publishing and printing facilities of the school. | ||
'''BACK AND FRONTEND''' | |||
'''BACK AND FRONTEND''' | |||
The starting point of the publication is a list of articles, be it introductions to the different practices or descriptions in text and image of graduation projects. On the backend side, each article is a Wordpress blog post. These posts are organized by type – introduction, project and dialogue. And they’re also split up into four categories, consisting of autonomous, commercial and social practices or WdKA in general. Creating these types and categories allows us to give the posts on the frontend website specific styling and sorting options. | The starting point of the publication is a list of articles, be it introductions to the different practices or descriptions in text and image of graduation projects. On the backend side, each article is a Wordpress blog post. These posts are organized by type – introduction, project and dialogue. And they’re also split up into four categories, consisting of autonomous, commercial and social practices or WdKA in general. Creating these types and categories allows us to give the posts on the frontend website specific styling and sorting options. | ||
The Art School Reinvented’s | The Art School Reinvented’s frontend<ref>http://reinvented.wdka.nl/ | ||
</ref> streams content from the wordpress backend and is written in HTML/Javascript/CSS. The streaming of content is made possible by a plugin (rest-api) that provides the Wordpress content as JSON-format<ref>“JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate.” (from JSON.org) | |||
</ref>. This is then manipulated and visually presented with Javascript. From the start we had a larger scale in mind. Instead of going the more logical route of making a Wordpress theme, we isolated the frontend completely from the Wordpress backend. Using the rest-api plugin, it is possible to connect any WP blog to the print-from-web site. Simply tagging a post as being part of ''Reinvented'', would make it show up on the frontend website. In principle this makes the project mobile and usable with any Wordpress, no matter what theme it might run. | |||
Using Javascript (or to be more specific, JS helper libraries jQuery and list.js) allowed us to create a frontend website that not just displays the list of articles, but add a simple printing toolkit as well. It’s possible to read each article seperately, but you can also add them to ‘your selection’. This selection combines each article into a printable A4 publication. Which can then be printed straight from the browser. | Using Javascript (or to be more specific, JS helper libraries jQuery and list.js) allowed us to create a frontend website that not just displays the list of articles, but add a simple printing toolkit as well. It’s possible to read each article seperately, but you can also add them to ‘your selection’. This selection combines each article into a printable A4 publication. Which can then be printed straight from the browser. | ||
For this hybrid publication, we decided against generating the publication (in PDF-format) on the backend side. This has its own requirements and can be unstable. Instead we stuck with utilizing the printing dialogue from the browser window. Most browsers offer a print preview, which allows for more customization on the visitors side. We wanted to keep the printing flexible, without forcing anyone to download a file to print as is. This way we make a suggestion for the prefered printing layout, yet each user can make their own adjustments. Whether its changing the margins and page size or adding pagenumbers and footers. | For this hybrid publication, we decided against generating the publication (in PDF-format) on the backend side. This has its own requirements and can be unstable. Instead we stuck with utilizing the printing dialogue from the browser window. Most browsers offer a print preview, which allows for more customization on the visitors side. We wanted to keep the printing flexible, without forcing anyone to download a file to print ''as is''. This way we make a suggestion for the prefered printing layout, yet each user can make their own adjustments. Whether its changing the margins and page size or adding pagenumbers and footers. | ||
'''PRINT''' | |||
Printing from web requires letting go of some perfectionism and to not waste time on fine tuning. An extra word here or a <br> break there and the look of the entire publication is altered. So it’s best to keep the printable layout as simple as possible. | |||
Each type of article in Reinvented has a different styling. We adjusted headings, font sizes and the number of columns. Typography and page layouting for print is still a tricky thing to do in HTML, meaning you somewhat have to let go of finetuning, micro-type and detailed work. | |||
But we put restrictions on making specific style changes for those issues. Meaning that we did not allow ourselves any hard coded 'hacks' to observe typography principles. Small quirks are part of the charm of automated design. | But we put restrictions on making specific style changes for those issues. Meaning that we did not allow ourselves any hard coded 'hacks' to observe typography principles. Small quirks are part of the charm of automated design. | ||
Online tools: | Online tools: | ||
* rest-api Wordpress plugin + related | |||
* endnotes Wordpress | * rest-api Wordpress plugin + related plugins<ref>https://wordpress.org/plugins/rest-api/</ref> | ||
* The frontend website is a table with sorting options. Created using Javascript library list. | * endnotes Wordpress plugin<ref>https://wordpress.org/plugins/endnotes/</ref> (allows for footnotes) | ||
* The frontend website is a table with sorting options. Created using Javascript library ''list.js''<ref>http://listjs.com/</ref> and a lot of CSS styling | |||
* The print selection is all CSS media queries (@media print {}), and involves a lot of ‘display: none’. | * The print selection is all CSS media queries (@media print {}), and involves a lot of ‘display: none’. | ||
Most of the concept for the offline publication was taken from the web version. We decided on printing the articles single sided on A4. This makes it possible for anyone to print the publication the way we intended, from home. To give this first edition something extra, we designed four letterheads. Pictures of student work that were not posted to the website we combined in a glossy paged booklet. All elements were binded into a publication using a simple metal paper fastener. | Most of the concept for the offline publication was taken from the web version. We decided on printing the articles single sided on A4. This makes it possible for anyone to print the publication the way we intended, from home. To give this first edition something extra, we designed four letterheads. Pictures of student work that were not posted to the website we combined in a glossy paged booklet. All elements were binded into a publication using a simple metal paper fastener. | ||
'''References'''<br /> | |||
<references /> | |||
Latest revision as of 03:19, 27 March 2017
REINVENTED.WDKA.NL
The Art School Reinvented: Autonomous, Commercial, and Social Practices
Developed by Lasse van den Bosch Christensen and Marlon Harder.
(Template)
The Art School Reinvented is a hybrid publication that serves as a showcase for Willem de Kooning Academy’s practices programme. It contains a selection of student work created within the autonomous, commercial and social majors. In 2013 the academy published Reinventing the Art School, 21st Century, a selection of critical texts that contextualize the schools updated programme. Reinvented presents some of the first results of this restructure.
We worked together with WdKA’s Hybrid Publishing to create an ongoing online and offline publication. A website with articles that can be sorted, selected, combined and printed at any time. At different intervals this website will bring about a printed publication, showcasing not just the work of recent graduates, but also the publishing and printing facilities of the school.
BACK AND FRONTEND
The starting point of the publication is a list of articles, be it introductions to the different practices or descriptions in text and image of graduation projects. On the backend side, each article is a Wordpress blog post. These posts are organized by type – introduction, project and dialogue. And they’re also split up into four categories, consisting of autonomous, commercial and social practices or WdKA in general. Creating these types and categories allows us to give the posts on the frontend website specific styling and sorting options.
The Art School Reinvented’s frontend[1] streams content from the wordpress backend and is written in HTML/Javascript/CSS. The streaming of content is made possible by a plugin (rest-api) that provides the Wordpress content as JSON-format[2]. This is then manipulated and visually presented with Javascript. From the start we had a larger scale in mind. Instead of going the more logical route of making a Wordpress theme, we isolated the frontend completely from the Wordpress backend. Using the rest-api plugin, it is possible to connect any WP blog to the print-from-web site. Simply tagging a post as being part of Reinvented, would make it show up on the frontend website. In principle this makes the project mobile and usable with any Wordpress, no matter what theme it might run.
Using Javascript (or to be more specific, JS helper libraries jQuery and list.js) allowed us to create a frontend website that not just displays the list of articles, but add a simple printing toolkit as well. It’s possible to read each article seperately, but you can also add them to ‘your selection’. This selection combines each article into a printable A4 publication. Which can then be printed straight from the browser.
For this hybrid publication, we decided against generating the publication (in PDF-format) on the backend side. This has its own requirements and can be unstable. Instead we stuck with utilizing the printing dialogue from the browser window. Most browsers offer a print preview, which allows for more customization on the visitors side. We wanted to keep the printing flexible, without forcing anyone to download a file to print as is. This way we make a suggestion for the prefered printing layout, yet each user can make their own adjustments. Whether its changing the margins and page size or adding pagenumbers and footers.
Printing from web requires letting go of some perfectionism and to not waste time on fine tuning. An extra word here or a <br> break there and the look of the entire publication is altered. So it’s best to keep the printable layout as simple as possible.
Each type of article in Reinvented has a different styling. We adjusted headings, font sizes and the number of columns. Typography and page layouting for print is still a tricky thing to do in HTML, meaning you somewhat have to let go of finetuning, micro-type and detailed work.
But we put restrictions on making specific style changes for those issues. Meaning that we did not allow ourselves any hard coded 'hacks' to observe typography principles. Small quirks are part of the charm of automated design.
Online tools:
- rest-api Wordpress plugin + related plugins[3]
- endnotes Wordpress plugin[4] (allows for footnotes)
- The frontend website is a table with sorting options. Created using Javascript library list.js[5] and a lot of CSS styling
- The print selection is all CSS media queries (@media print {}), and involves a lot of ‘display: none’.
Most of the concept for the offline publication was taken from the web version. We decided on printing the articles single sided on A4. This makes it possible for anyone to print the publication the way we intended, from home. To give this first edition something extra, we designed four letterheads. Pictures of student work that were not posted to the website we combined in a glossy paged booklet. All elements were binded into a publication using a simple metal paper fastener.
References
- ↑ http://reinvented.wdka.nl/
- ↑ “JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate.” (from JSON.org)
- ↑ https://wordpress.org/plugins/rest-api/
- ↑ https://wordpress.org/plugins/endnotes/
- ↑ http://listjs.com/
