ArtemioSans

Many years ago, one of the reasons I started exploring electronic literature was for the spontaneity of it, being able to create disparate elements and put them together into something coherent.

These days, I’ve started remembering that.

To advance through the piece below, swipe up or use the mouse to click and drag on desktop. You can also use the keyboard up and down directional buttons.

I was in a creative mood, and I wrote a few lines, then picked up my guitar and plucked some strings, which I recorded using my iPhone.

As I was editing the audio, I recognized the sound of the katydids in the background.

I’d recently finished talking to a friend on the phone about how distinct the sound of the katydids was; I went outside to record the sound, and also took a picture of the trees.

I also made a quick sketch, then combined all of these elements into the short test above.

I’m not sure if I’ll take it any further. I already feel so full though. I love being able to just hop from one medium to the next, letting creativity lead.

Background

So I’ve been struggling for a long time to find a way to talk about electronic literature in a way that feels authentic.

The issue is that most platforms don’t allow you to embed custom HTML. So when it comes to Instagram, Twitter, Facebook, TikTok — none of those work for showcasing what I’m trying to make.

Ditto for the app stores, like the Apple App Store and Google Play. Sure, they work for publishing big efforts, but the value proposition to casual users of downloading a whole multimedia app that’s just a prototype carries a lot of friction.

Even when it comes to hosting prototypes as standalone pieces, it’s a challenge. Anything delivered on a site like Newgrounds or Itch feel like it needs to be a fully baked cake, ready for consumption, rather than just a quick thing I’m making as an experiment.

It’s with all of this in mind that I realized the answer was right in front of me the whole time: What if you were to embed projects right into blog posts, no matter the stage of completion, and write about the ideas and processes you’re experimenting with while in process?

Being able to do this is doubly important for me; these projects are very visually based, and illustration is not my strong suit. But I like the idea of being able to doodle and talk about the context around a prototype without committing to fully fleshing out the artwork, as that takes a big toll on me.

Here’s the piece I made then called Thinking, Feeling, Creating, one I posted on Newgrounds and AltSalt a while back. It’s part of a series called Dear Charles that I’ve been doing with a friend.

This was the first experiment I’d done using a version of my electronic literature creation tools for Cocos Creator. I’ve made more projects since that I haven’t published because they’re short, incomplete, and don’t have coherent narratives. I’d love to just push out what I have as it comes though.

The beauty of Cocos Creator is that it exports to web well. This piece works on mobile devices. It even plays sound. It’s great.

The Process

I spent a few hours finding the best way to do this. I opted to use a WordPress.com solution, rather than hosting it myself. I’ve gone through the challenge of hosting my own WordPress site many times, so I wanted to have the heavy lifting done for me, without needing to worry about deployment, security, CDNs, and the like.

Important to note is that the basic WordPress plans don’t allow you to embed iframes, so I needed to upgrade to the business account, which is pretty steep as of this writing at $33/month. For me it was worth it to get something up and running quickly as I try this out. Will continue to assess in the coming weeks.

Regarding the nuts and bolts, essential to experiencing the piece above is maintaining the aspect ratio and ensuring it shows well on mobile. I toyed around with the CSS a bit, taking a cue from this article on maintaining iframe aspect ratios, and came up with the following HTML:

<div style="padding-top: 35px; width: 100%; max-width: 396px; margin: 0 auto;">
   <div style="position: relative; overflow: hidden; width: 95%; padding-top: 177.78%; margin: 0 auto;">
         <iframe src={S3_URL_HERE} style="position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 95%; border-style: solid; border-width: 1px;">
         </iframe>
   </div>
</div>

Something I haven’t figured out is the best UX for having folks swipe through the experience. For now I’ve made the project just 95% of the container width, so one can swipe around the iframe to continue reading the rest of the web page, but I’m not sure this is very intuitive.

My app is a simple HTML document, exported from Cocos Creator, stored on AWS S3. I’ll need to configure this to be served using Cloudfront at some point.

The Content

I’ve been experimenting with doing doodles and layered illustrations using Clip Studio Paint on my iPad Pro, then animating them using Maestro, a plugin I made for Cocos.

This was made a few months ago as I found myself burnt out from all creative and technological endeavors, in a process of rediscovering the joy that first drove me to make things in the first place.

That process is still ongoing. Maybe having an avenue of expression that feels more authentic, before I forced myself to constrain to big platforms, could help.

I feel like we lost something in the transition from the LiveJournals, Xangas, and Geocities (old website/blogging platforms) of the world to social media networks like Facebook, Instagram, and Twitter.

It’s been cool to recognize that the Old Web never really left, though. WordPress is stronger than ever and half of folks who sign up use it for blogging; Newgrounds is still alive and well; Geocities has been reincarnated in Neocities; DeviantArt continues to be a thriving community; Tumblr is becoming more popular; Itch is an amazing place to find indie games and other creative projects.

It warms my heart to become more conscious of this. In a way, it feels like my spirit is coming back to source — a vision of what the internet was, is, and what may yet be.