triptych

Building fun experiences for the web

I'm testing a new feature! Will it work? Well if this shows up on Ghost, and Twitter. Then yes!

Pieces Falling Together

A lot of pieces of this “puzzle” of creating something cool seem to be falling together. Working on Notebooks in Observable. Playing with Kaboomjs. Writing blogs here at Write.as, and trying out creating a “platform” with Ghost.org. I've been trying to find a place to write a new serial novel, and perhaps via blogging / ghost I can do that. Can I finally get an “audience” who would find what I do worthwhile? The only way to see is to try.

I'm editing this later after posting. I forgot to mention some other sites I'm using like Canva, Milanote, Itch.io and of course Github.

For so long I've just been like a person in a room full of tools and material, and I've just been making bird houses and ashtrays. Time to line up all the ducks, get serious, and make some fun stuff.

Integrating with Ghost.org

I am always amazed that write.as is the site I keep coming back to in order to post content. They are smart, savvy, and have lots of integrations.

I only wish they had Markdown previews!

Today I'm trying out my Ghost integration.

Will it work?

This should show up on triptych.ghost.io

As I sit here on my couch in an apartment I've lived in for years, full of clutter and family and wholly lived in, I think about the journey I have been on, and the direction I want to go in. Every day is like a tiny step. You can only do so much every day. But let it count for something. Take some time to do something you like. Learn something new every day. Fix a thing. Help someone. Be humble. Create.

I'm now 50 years old, but I feel like I'm only getting started. I'm good at some things like HTML, CSS, JS, ( learning SVG ) and I want to learn more about things like Godot Engine, Svelte, WebAssembly, and more.

Ultimately, though, it's about wanting to create. I've learned a lot via Observable and I think I've learned that a Journey should not be taken alone.

When I got married, I thought I knew everything, and my life would just be a continuation of the past, just with another person. I had no idea that my whole life would be changed in ways I could not understand at the time.

Now, I'm married, got 3 kids, working on books, games, coding, and wondering “what's next”? This pandemic has changed the world, and myself as well. It's refocused me on making every day count. And not letting depression steal another moment of time.

Time to do stuff! Have fun! Make things!

This is my first blog post that is a “day 2”. I am hoping for a “week” streak at least. Writing in the mornings is my goal. The topic is not set yet. Getting words on a page is the priority.

See you tomorrow!

Lately, I've been working on coding projects, but neglecting my writing. Recently Amazon announced something called Kindle Vella. This is intended to be short form, serial fiction which readers pay tokens to get to the next chapter. It really suits my way of writing, so I'm going to see how far I can go there.

I've also neglected my music listening – to my own detriment. I'm trying to correct all of these things with this blog post. I have so much cool stuff I could talk about, and yet I keep silent and see other's gaining readers through posts that are less complicated and involved than I could get to.

So.

Let's fix that! I need to post more often and share what's going on. And maybe there will be something that interests you, dear reader?

First off let's get to some music!

I know write.as does a great job allowing embeds, so I'm testing this out. There are so many things I could be doing here. Now that I'm vaccinated, it's time to step up and step out.

Current activities:

  • Going through the Threejs tutorial over at Threejs-journey
  • Transferring my serial novel The Clockwork Apprentice to [Kindle Vella]
  • Having fun making cool things over on Observable

Goals:

  • Write ( every day! )
  • Create a simple JS web game — dungeon critters
  • Write more chapters for The Clockwork Apprentice

Some things I wish I had been told as a kid: 1) A lot of your life will be determined by your mindset. Be pessimistic and your fears will be fulfilled. Be optimistic, and at least you'll face challenges with your full will power. 2) save money. Even a dollar a paycheck. 3) Incremental progress. Slice a goal into tiny daily steps. The “compound interest” on this is powerful. 4) Your teenage years will mess you up mentally. It's biology. Don't worry too much. It'll get better. 5) Making connections with people using empathy will make your life better. 6) Learn to write and tell stories. Storytelling is the fundamental unit of the universe. 7) Sleep. Eat ( not junk ) . Exercise ( even just walking ) — will change your life. ( esp. sleep ) 8) Learn how to manage your finances. I lost 10 years of life to Capital Gains Tax. The emotional toll is devastating. 9) Find folks who are like minded. Find your “peeps”. And cultivate relationships. 10) Read. A lot. Nonfiction and Fiction. 11) Get a sense about Math. It's really not “that bad”. Having an intuitive sense about math at an early age changed my life. 12) Have a pet. Love is a universal healer. 13) Do not put others down. It only pulls you down. 14) Be learning every day. You are an eternal Student. 15) Find a way to share what you've learned. Teaching can be very fulfilling. 16) Declutter. Remove visual noise, throw that old jacket away ( or donate it). eBay is your friend ( sell! ) 17) When you feel bad – Go To The Doctor. I had undiagnosed Diabetes for years. Metformin changed my life. 18) Do not wait. Seriously. Don't wait. Do the THING. You know what it is. The thing you long to do — write, sing, art, build. Whatever. GO DO IT. Life is super short. 19) Be thankful. Be grateful. Make a list of the things you are grateful for and keep adding every day. This will change your life. 20) Make a list of 10 ideas a day. It could be “10 ideas for better investing” or “10 ideas about fantasy characters” or anything. Getting ideas down trains your brain to be an idea machine.

As I'm playing more with #observablehq I'm seeing how powerful it is in many ways. One way is how you can embed views of some logic and game in another site. For instance, I have a simple icon generator that gives you a score based on if you match colors and shapes. Check it out below.

This game is based on a few other Observable notebooks in a chain fashion. You can see the original Observable Notebook here –> @triptych/monster-icon-mix-up It allows you to share just individual cells if you want – and all the logic / js / css carries over. I'm really super impressed. Also with Write.as for letting iframe embedding. The combo is just super powerful.

Just to give you a little insight into one writer's thought process while starting a new novel. I'm sure that some writers get everything plotted out and perfect before writing that first chapter. Every character is fully formed and ready to get up on stage and do their thing. For me it's so much different.

For me, I feel like I'm a reporter who can travel to different worlds and see what's going on. I'm not so much creating a world, but I'm discovering something that exists outside of myself, and I'm just given the ability to see it first. It's almost like there's a story – inside a house on a foggy hill. I see the outlines of the house first, then as I approach the house I can see more details, or something that I thought was the house was really the pool house and the main building comes into focus.

I imagine I kinda peer into windows – seeing characters or situations in an isolated, disconnected way. For instance – for my next novel, I was thinking about the concept of a character who has some mystical abilities. They realize that powerful magical entities have broken free from a Tarot style deck of cards. They must find some way to confront and get the entities back into their cards. The idea at first was like a film noir character doing this in a big city.

I then hit upon something that happens a lot for me. I see a genre and think “how can I twist or invert that trope?” For me the trope of some everyday guy getting sent into a fantasy world with superpowers — the Isekai might get inverted by having a fantasy character sent to the normal Earth and be “powerless”.

These ideas kinda fused in my mind — getting further clarification of the storyline. I then tried to imagine what my MC might be like. Initially, I had written a few chapters of a novel where a girl watches a door as part of a family tradition — supposedly “guarding” it in case anyone comes through. She scoffs at this until someone actually comes through! And I thought perhaps this was the MC for my story. She would somehow have the power to control these cards and the battle weary dude who comes through a gate would have to train her.

But as the characters began to speak to me ( figuratively, of course ) I realized that the MC was actually a 35 yr old divorcee named Sylvia who runs a bookstore. Taking the house analogy — I was able to peer in and see more clearly one of the characters. I just assumed the store was a book store – though it seems kinda tropy...

This is when serendipity comes in. Watching Twitter this morning I came across this tweet:

link

And I immediately realized that the store is not a bookstore after all but a pet store. I'm not sure how it will all work out, but I'm getting closer 😁

But the point of it is this. Sometimes a story will just come to you. I have other snippets of the story – like the “Big Confrontation” and some plot twists here and there. This is just how I think about writing. I'm definitely a “pantser” and this really works for me. You might be just staring out on your writing journey, or you've been doing this for a long time. I just want to let you know that stories can come in many ways. Sometimes you have it all worked out and you know the ending before you even start typing the first word. Other times you are discovering the story as you write it. And that's exciting! Give yourself the freedom to try both ways. You never know that directions your creativity will take you.

As I was writing this post, I realized a bit more about the storyline – in terms of how the MC might discover the item that is the “gateway” that let's the fantasy character pass through. She is a marine biologist ( okay?) who runs the aquarium pet store with her mom. She's recently divorced and has moved back to her parents to help with the store. She loves to go diving off the coast nearby and discovers a kind of “pandora's box” and naturally she opens it. So, now SHE's responsible for the Tarot-style entities escape. The fantasy character who will help her is probably one of the characters from the cards ( I don't know yet). But which one? And is this character REALLY have her best interests in mind? You'll have to read the story to find out!

Unexpectedly, I am going on an Observable odyssey. I ran across a particularly interesting Observable story as a notebook a few weeks ago. It really captured my imagination as I aspire to be a “creative coder”. As someone who is very interested in things like JavaScript, Games, Web Development, Storytelling, and teaching, this site offers all of these things and more. I find myself learning about kinda obscure JavaScript features like Generators and rediscovering my love for SVG.

Observable is quite remarkable to me because it has cracked a lot of “tough nuts” in my webdev journey. I find myself making goofy little notebooks that do things like tell Chuck Norris jokes and show Cat Pictures. I've also learned how to Generate Mazes , tell stories with Inkjs, and create simple games with creative commons RPG Icons. I've learned about Entity-Component-Systems , how to use Google Spreadsheets as a mini-database, and how to use Github as my own personal “npm” to write code outside Observable, but to use it as a library my notebooks can dynamically import.

I've learned MORE about how the web works in these past few weeks playing with Observable than I have in a long time. For instance, did you know there's this thing called a Broadcast channel that you can pass messages to in a browser and every other site, page, etc. that listens to that channel can receive and send messages as well? That's HUGE! And it's just one of many discoveries I've made.

It's CHANGING how I understand how the web works. I have always thought of the web as you have this browser that has a bunch of functionality, all mish mashed together on a page. You poke at it through HTML, CSS, JS, and SVG, and HOPE it works ok. Now, I'm learning that the web is a very organized set of components. There are built-in components to the browser, that you can take advantage of, and there are user-made components you can fetch from say NPM which you also can use. I've always been this “build it myself” kinda guy. And that has been my albatross. Instead of actually making a web game, I spin my wheels trying to make pixels move. When instead I could just use a game library like Kontra or Phaser and just go!

Observable itself is also quite cool. It enforces a concept I find very appealing called Functional Programming. And it also uses async/await, Promises, require, import, and more. Writing “modern” JavaScript is the norm here, and just looking at a notebook and how it works is not only fascinating, but a valuable way to get your own notebooks working well.

Everything is “forkable” – where you can clone a notebook ( mostly ) and make it your own to spin off new ideas. There's also this really interesting idea where every “cell” in a notebook is addressable in ANY other notebook. And that cell “carries over” all it's dependencies into the new notebook ( with some exceptions). This really gives one the feeling that everything is componentized, reusable, and remixable in a way that is a step up from typical Coding sandboxes like Codepen — which is super amazing and has a much bigger audience right now — but falls short on the sheer simplicity of writing a document, and sharing a cell with another document. You can also export your notebook to another site – and it will carry over the “engine” for you. So there's a sense that if you felt like you wanted to “eject” from Observable, you could still take your stuff with you. And it has a really nice way to embed your notebooks and cells in other websites. It's a great “citizen of the web”. It GIVES as much as it takes.

I REALLY like that.

So, here I am going nuts about Observablehq all because of a random tweet about creative coding. But it's not only sparked my imagination, it's made me a better webdev ( still learning! .... Generators ugh! ) , and it's enabling me to DO more things ON the web, WITH the web. I hope you check it out and find something fun to learn and do.

Enter your email to subscribe to updates.