Compare commits

...

16 Commits

44 changed files with 334 additions and 112 deletions

View File

@ -36,7 +36,7 @@ module.exports = (config) => {
// add collection for pages
config.addCollection('categories', (collection) => {
// let categories = collection.getFilteredByGlob('**')
let categories = fs.readdirSync('_content')
categories = categories.filter(c => !c.match(/\.[^/.]{1,4}$/i))
@ -46,7 +46,7 @@ module.exports = (config) => {
let sorted = []
let unsorted = []
let pages = collection.getFilteredByGlob(`_content/${cat}/*.md`)
let pages = collection.getFilteredByGlob(`src/_content/work/${cat}/*.md`)
for (let page of pages) {
if (page.data.sort) {
@ -64,7 +64,17 @@ module.exports = (config) => {
_cat[cat] = sorted.concat(unsorted)
})
return _cat
let _p = collection.getFilteredByGlob('_content/*.md')
let pages = {}
// _cat = { ..._cat, ...pages }
_p.forEach(p => {
if (p.data.title != 'index') {
pages[p.data.title] = p
}
})
return { ..._cat, ...pages }
})
// custom filters
@ -77,6 +87,9 @@ module.exports = (config) => {
// added passthrough for global assets
config.addPassthroughCopy('assets')
// backend
config.addPassthroughCopy('office')
// added passthrough for images in their respective folders
config.addPassthroughCopy('_content/**/images/**')

View File

@ -2,16 +2,14 @@
title: alternative echelons
---
<div style="padding:56.25% 0 0 0;position:relative;">
<iframe src="https://player.vimeo.com/video/394133870?color=ffffff&amp;portrait=0" style="position:absolute;top:0;left:0;width:100%;height:100%;" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="" frameborder="0"></iframe>
</div>
<script src="https://player.vimeo.com/api/player.js"></script>
# alternative echelons
Sound design for [alternative echelons](http://www.amypickles.co.uk/research-ing/alternative-echelons-1) by [Amy Pickles](https://www.amypickles.co.uk/). _alternative echelons_ is a research project to challenge colonial occupation and corporate, capitalist listening.
Sound design for [alternative echelons](http://www.amypickles.co.uk/research-ing/alternative-echelons-1) by [amy pickles](https://www.amypickles.co.uk/). _alternative echelons_ is a research project to challenge colonial occupation and corporate, capitalist listening.
The video above is the trailer to the live performance, and projection that was to happen in November 2020. An improvised soundtrack was performed live and consisted of pre-recorded and synthesised material. Documentation of the performance can be watched on [vimeo](https://vimeo.com/495285427)

View File

@ -1,5 +1,4 @@
{
"category": "audio",
"published": true,
"layout": "page.webc"
}

View File

@ -12,7 +12,7 @@ title: dirtc
Workshop experimenting with mobile phones and live real time conferencing protocol. Individual's phones joined voice, performed and environmental noises in a dirty feedback.
Texts collated by [Amy Pickles](http://amypickles.co.uk/) discussing the first recording of a human voice, an unknown female, and texts that considered how we record, what is lost, edited, removed and forgotten were the source.
Texts collated by [amy pickles](http://amypickles.co.uk/) discussing the first recording of a human voice, an unknown female, and texts that considered how we record, what is lost, edited, removed and forgotten were the source.
The acoustic output was being performed more by digital noise cancelling, and network interference, curated via a custom performance software instrument through looping and time manngling.

View File

@ -7,7 +7,7 @@ gallery:
# Read my lips : No New Taxes
A collaboration with artist Amy Pickles developing and performing part of the sound component. Custom developed a looper mangler using open source software and hardware. The project text :
A collaboration with artist [amy pickles](http://amypickles.co.uk) developing and performing part of the sound component. Custom developed a looper mangler using open source software and hardware. The project text :
<iframe scrolling="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/615639498&amp;color=%23333333&amp;auto_play=false&amp;hide_related=true&amp;show_comments=false&amp;show_user=true&amp;show_reposts=false&amp;show_teaser=true&amp;visual=true" width="100%" height="300" frameborder="no"></iframe>

View File

@ -23,7 +23,7 @@ Bachelor Jazz Performance (Saxophone) &amp; Creative Sound Engineering
### Teaching
_Willem de Kooning Academie_<br>
2020 - current // Rotterdam, NL<br>
2020 - 2023 // Rotterdam, NL<br>
Tutor within the Graphic Design Major
_Paris College of Art_<br>
@ -38,6 +38,80 @@ _École Européenne des Métiers de l'Internet_<br>
2018 - 2019 // Paris, FR<br>
Faculty Member within the Graphic Design department
### Freelance
_Meredith Monk : Rooms for Listening & Looking_<br>
Oude Kerk<br>
2023 // Amsterdam, NL<br>
Development of application to showcase video and audio work
_Fondation Meyer_<br>
2022 // Paris, FR<br>
Website development
_Green-Shoots_<br>
NOOR Images<br>
2022 // Paris, FR<br>
Website development
_World Press Photo_<br>
2021 // Paris, FR<br>
Website development for online exhibition
_Performance Lab Workshop Series_<br>
2019 // Rotterdam, NL<br>
Website design & development
### Sound
#### Performances
_alternative echelons_<br>
2020 // UBIK, Rotterdam, NL<br>
_Design Days Finnisage_<br>
Espace 15<br>
2019 // Paris, FR
_Read My Lips: No New Taxes_<br>
Galerie Lecq<br>
2019 // Rotterdam, NL
_E-ARTHA_<br>
DePlayer<br>
2018 // Rotterdam, NL
_North Sea Jazz Around Town_<br>
VARIA<br>
2018 // Rotterdam, NL
_POST TOAST_<br>
Red Light Radio<br>
2018 // Amsterdam, NL
#### Soundtracks
_Dragon Hunt_<br>
by _Marko Gutić Mižimakov_<br>
2023 // Brussels, BE<br>
_alternative echelons_ (trailer)<br>
by Amy Pickles<br>
2019
_Ghost Terminal_<br>
by Ryan Cherewaty<br>
2019
_Memory of Death's Dream_<br>
by Ryan Cherewaty<br>
2019
#### Studio Experience
_Linear Recording_<br>
2009 2010 // Sydney, AU<br>
Assistant Sound Engineer
### Selected Exhibitions & Events
_Sounds to See_<br>
@ -75,7 +149,7 @@ _Barcu Art Fair_<br>
2015 // Bogota, CO<br>
Presentation via Skype on Collaborative Art, Interactivity and Improvisation.
### Recent PRogrammes & Resdencies
### Recent Programmes & Resdencies
_Thresholds of the Algorithmic_<br>
Algorithms that Matter<br>
@ -86,57 +160,3 @@ _Get a Room Residency_<br>
Frontyard<br>
2018 // Sydney, AU<br>
Research residency around Master's research on Software and Improvisation.
### Sound
#### Performances
_alternative echelons_<br>
2020 // UBIK, Rotterdam, NL<br>
_Design Days Finnisage_<br>
Espace 15<br>
2019 // Paris, FR
_Read My Lips: No New Taxes_<br>
Galerie Lecq
2019 // Rotterdam, NL
_E-ARTHA_<br>
DePlayer
2018 // Rotterdam, NL
_North Sea Jazz Around Town_<br>
VARIA<br>
2018 // Rotterdam, NL
_POST TOAST_<br>
Red Light Radio<br>
2018 // Amsterdam, NL
#### Soundtracks
_alternative echelons_ (trailer)<br>
by Amy Pickles<br>
2019
_Ghost Terminal_<br>
by Ryan Cherewaty<br>
2019
_Memory of Death's Dream_<br>
by Ryan Cherewaty<br>
2019
### Professional Experience
_Willem de Kooning Academie_<br>
2018 // Rotterdam, NL<br>
Publication Station teaching and technical assistant
_Freelance Graphic Designer_<br>
2009 2014 // Sydney, AU<br>
Web-design, poster and album design
_Linear Recording_<br>
2009 2010 // Sydney, AU<br>
Assistant Sound Engineer</p>

5
_content/dev/dev.json Normal file
View File

@ -0,0 +1,5 @@
{
"category": "dev",
"layout": "page.webc",
"published": true
}

View File

@ -0,0 +1,30 @@
---
title: Fondation Meyer
url: https://www.fondationmeyer.org/
git: https://github.com/m3astwood/11ty.meyer
tags:
- frontend
- development
- design
summary: Website design and development for a cultural funding foundation in France.
order: 2
imgFeat:
gallery:
- /dev/images/fondation_meyer_home.png
- /dev/images/fondation_meyer_conservatoire.png
- /dev/images/fondation_meyer_beneficiaries_2000.png
- /dev/images/fondation_meyer_beneficiaries_search.png
- /dev/images/fondation_meyer_prix_jean-nicod.png
---
# Fondation Meyer
[website]({{url}}) / [git]({{git}})
---
This project was developed with [Theo Goedert](https://www.theogoedert.com/) who was approached by Fondation Meyer. The primary requirements were that their outdated website be modernised for mobile devices, and that the funding recipients for the _Conservatoire de Paris_ were more easily searchable.
For this project we worked with [11ty](https://11ty.dev/) to develop a lightweight and performant solution. For the search I developed a simple interface using [AlpineJS](https://alpinejs.dev/) and the IndexDB browser API through [dexie](https://dexie.org/).
![](/dev/images/fondation_meyer_video.gif)

View File

@ -0,0 +1,27 @@
---
title: Green-Shoots
url: https://green-shoots.eu/
tags:
- frontend
- development
summary: Development of online platform highlighting green initiatives accross the EU through photography.
order: 4
imgFeat:
gallery:
- /dev/images/green-shoots_project_full.png
- /dev/images/green-shoots_image.png
---
# Green-Shoots
[website]({{url}}) / [git]({{git}})
---
Green-Shoots website was a collaborative effort between the studio [shimsham](https://shimsham.design/) and myself. The brief was to develop a website that would showcase the results of a European Project highlighting environmental projects and impacts across Europe.
It was important for the client that the site was relatively lightweight to reduce as much as possible the website's environmental impact.
In pursuit of this we aimed to use as few libraries as possible, and keeping the JavaScript to a minimum. The final result was a custom theme for the [Kirby CMS](https://getkirby.com/).
![](/dev/images/green-shoots_home_full.png)

Binary file not shown.

After

Width:  |  Height:  |  Size: 280 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 166 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 311 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 267 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 214 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 711 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 450 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 428 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 113 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 428 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 216 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 213 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 464 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 448 KiB

29
_content/dev/plws.md Normal file
View File

@ -0,0 +1,29 @@
---
title: Performance Lab Workshop Series
url: https://performancelab.ga/
git: https://git.suroh.tk/suroh/plws.theme
tags:
- frontend
- development
- design
summary: Website design and development for Rotterdam based art & research organisation.
order: 3
imgFeat:
gallery:
- /dev/images/plws_home.png
- /dev/images/plws_mavi_one.png
- /dev/images/plws_mavi_two.png
- /dev/images/plws_mavi_three.png
---
# Performance Lab Workshop Series
[website]({{url}}) / [git]({{git}})
---
The brief for this project was to develop a simple, user editable website to house the outcomes of performance workshops. The client wanted that the various outcomes of each workshop would live side by side, and visually be able to engage with each other. This lead to the three column expandable and retractable interface.
![](/dev/images/plws_eleanor_two.png)
The website is a custom theme developed for the [Automad CMS](https://automad.org/) in PHP, HTML and vanilla JavaScript. My desire was to keep all the technology open source, and use as few libraries as possible.

35
_content/dev/stnThrw.md Normal file
View File

@ -0,0 +1,35 @@
---
title: Stone Throw
git: https://git.suroh.tk/suroh/stnThrw
tags:
- frontend
- backend
- development
- design
summary: Development and design of an online Art installation to be released in 2023.
order: 1
imgFeat:
gallery:
- /dev/images/stone_throw_scanned.png
- /dev/images/stone_throw_pd.png
- /dev/images/stone_throw_references.png
- /dev/images/stone_throw_colophon.png
- /dev/images/stone_throw_writing_top.png
- /dev/images/stone_throw_writing_refs.png
---
# Stone Throw
[git]({{git}})
---
This project was conceived in collaboration with artist [amy pickles](http://www.amypickles.co.uk/) along with other collaborators, to develop an interactive, sound installation exploring the nature of digital disintegration.
![](/dev/images/stone_throw_video.gif)
Each item that is scanned is generated on the server, taking one image of a reference used in the artist's research, and an image of a stone. Once it has generated this scan the server degrades the image by removing pixels from the image and saving over the original. As the scans progress, the file sizes change, which in turn progresses the musical composition.
The installation lives until the files are totally degraded to the point that they are deleted from the server.
I used this opportunity to explore custom vanilla js web components, building an API in NodeJS using [Express.js](http://expressjs.com/), live feedback from the server using [Socket.io](https://socket.io/), generative audio through [puredata](https://puredata.info/), and online radio using [Icecast](https://icecast.org/).

View File

@ -1,4 +1,3 @@
const fs = require('fs/promises')
const eleventyPackage = require('@11ty/eleventy/package.json')
module.exports = async () => {

View File

@ -17,6 +17,7 @@
<script type="module" @raw="getBundle('js')" webc:keep></script>
<!-- tracking -->
<script async src="https://analytics.suroh.tk/script.js" data-website-id="f24934aa-ee11-49ee-993f-a64b8df6a01c" webc:keep></script>
</head>
<body>

View File

@ -28,6 +28,8 @@ class NavPrimary extends HTMLElement {
const category = n.attributes.getNamedItem('category')
const link = n.attributes.getNamedItem('link')
console.log(link)
if (link) {
history.pushState({}, '', link.value)
location.pathname = link.value

View File

@ -1,18 +1,23 @@
<nav id="primary">
<nav-link link="/" data-name="<~"><~</nav-link>
<div class="pagelinks">
<nav-link webc:for="c in categories" :category="c" :data-name="c"></nav-link>
<template webc:for="(c,v) in categories" webc:nokeep>
<nav-link webc:if="v.page" :link="v.page.url" :data-name="v.data.title"></nav-link>
<nav-link webc:else :category="c" :data-name="c"></nav-link>
</template>
</div>
<button class="audioToggle"></button>
</nav>
<nav id="sub" slot="subnav">
<ul webc:for="(c, pages) in categories" :data-name="c">
<li webc:for="p of pages">
<a :href="p.url" @text="p.data.title || p.fileSlug"></a>
</li>
</ul>
<template webc:for="(c, v) in categories" webc:nokeep>
<ul webc:if="v.length > 0" :data-name="c">
<li webc:for="p of v">
<a :href="p.url" @text="p.data.title || p.fileSlug"></a>
</li>
</ul>
</template>
</nav>
<section id="menuItem" style="">
@ -31,10 +36,17 @@
display: grid;
grid-template-columns: auto 1fr auto;
gap: 1em 0.25em;
margin-block: 0.5em 0.5em;
margin-block: 2em 0.5em;
margin-inline: var(--page-margin-inline);
}
@media (max-width: 780px) {
:host {
margin-block: 1em 0.5em;
margin-inline: calc(var(--page-margin-inline) * 0.5);
}
}
/* => CONTAINER */
nav {
display: grid;
@ -82,6 +94,14 @@ nav-link[data-name="<~"] {
margin: 0;
}
@media (max-width: 780px) {
#sub {
grid-column: 1 / -1;
font-size: 1.25em;
}
}
#sub > ul {
grid-row: 1 / span 1;
grid-column: 1 / span 1;

View File

@ -41,6 +41,7 @@ a, a:visited {
img {
max-width: 100%;
height: auto;
outline: 1px dotted var(--neutral-900);
}
hr {
@ -63,7 +64,6 @@ ul {
li {
padding: 0.2em 0 0.2em 1em;
text-indent: -0.5em;
}
li:before {
@ -128,8 +128,8 @@ nav#sub > ul > li {
}
nav#sub > ul > li:before {
content: "";
padding-right: 16px;
content: '';
padding: unset;
}
nav#sub > ul > li:hover {
@ -209,20 +209,6 @@ section.page h1 {
padding: 0;
}
/* --> NAVIGATION <-- */
nav {
margin: 23px 0px 8px;
font-size: 1.5em;
}
nav>span {
margin-right: 8px;
}
nav>span.active::after {
margin-left: 8px;
}
/* --> MAINPAGE CONSTRUCTION <-- */
section ul.subMenu {
font-size: 1.5em;
@ -270,29 +256,11 @@ section.page h1 {
padding: 0;
}
/* --> NAVIGATION <-- */
nav {
margin: 23px 0px 8px;
font-size: 1.75em;
}
nav>span {
margin-right: 8px;
}
nav>span.active::after {
position: relative;
top: 2px;
margin-left: 8px;
}
/* --> MAINPAGE CONSTRUCTION <-- */
/* --> SUBCONTENT CONSTRUCTION <-- */
section.page {
display: inherit;
max-width: 650px;
grid-gap: 24px;
grid-gap: 1em;
margin-inline: calc(var(--page-margin-inline) * 0.5);
}
section.page h1 {

63
office/config.yml Normal file
View File

@ -0,0 +1,63 @@
backend:
name: gitea
repo: suroh/work.suroh.tk
app_id: a4548791-8ff4-4ab1-bdfb-54798262ed2f
api_root: https://git.suroh.tk/api/v1
base_url: https://git.suroh.tk
site_domain: work.suroh.tk
branch: main
site_url: https://work.suroh.tk
media_folder: "assets/media/uploads"
public_folder: "/media/uploads"
collections:
- label: "Audio"
name: "audio"
folder: "_content/audio"
create: true
fields:
- {label: "Title", name: "title", widget: "string"}
- {label: "Publish Date", name: "date", widget: "datetime"}
- {label: "Published", name: "published", widget: "boolean"}
- {label: "Featured Image", name: "imgFeat", widget: "image", required: false}
- {label: "Gallery", name: "gallery", widget: "image", media_library: { config: { multiple: true } }, required: false }
- {label: "Body", name: "body", widget: "markdown"}
- {label: "Order", name: "sort", widget: "number"}
- label: "Dev"
name: "dev"
folder: "_content/dev"
create: true
fields:
- {label: "Title", name: "title", widget: "string"}
- {label: "Publish Date", name: "date", widget: "datetime"}
- {label: "Published", name: "published", widget: "boolean"}
- {label: "Featured Image", name: "imgFeat", widget: "image", required: false}
- {label: "Gallery", name: "gallery", widget: "image", media_library: { config: { multiple: true } }, required: false }
- {label: "Body", name: "body", widget: "markdown"}
- {label: "Order", name: "sort", widget: "number"}
- label: "Work"
name: "work"
folder: "_content/work"
create: true
fields:
- {label: "Title", name: "title", widget: "string"}
- {label: "Publish Date", name: "date", widget: "datetime"}
- {label: "Published", name: "published", widget: "boolean"}
- {label: "Featured Image", name: "imgFeat", widget: "image", required: false}
- {label: "Gallery", name: "gallery", widget: "image", media_library: { config: { multiple: true } }, required: false }
- {label: "Body", name: "body", widget: "markdown"}
- {label: "Order", name: "sort", widget: "number"}
- label: "Pages"
name: "pages"
folder: "_content"
create: true
fields:
- {label: "Title", name: "title", widget: "string"}
- {label: "Publish Date", name: "date", widget: "datetime"}
- {label: "Published", name: "published", widget: "boolean"}
- {label: "Featured Image", name: "imgFeat", widget: "image", required: false}
- {label: "Gallery", name: "gallery", widget: "image", media_library: { config: { multiple: true } }, required: false }
- {label: "Body", name: "body", widget: "markdown"}
- {label: "Order", name: "sort", widget: "number"}

13
office/index.html Normal file
View File

@ -0,0 +1,13 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="robots" content="noindex" />
<title>work.suroh : admin</title>
</head>
<body>
<!-- Include the script that builds the page and powers Decap CMS -->
<script src="https://cdn.jsdelivr.net/npm/decap-cms@^3.0.0/dist/decap-cms.js"></script>
</body>
</html>

View File

@ -10,8 +10,8 @@
"markdown-it-link-attributes": "^4.0.1"
},
"scripts": {
"dev": "eleventy --serve --incremental",
"test": "echo \"Error: no test specified\" && exit 1"
"dev": "eleventy --serve",
"build": "eleventy"
},
"repository": {
"type": "git",