Imagine, for a minute, being able to design paged layouts for print in a browser environment. You get to use JS for data/templating, and HTML/CSS for the structure/style, and don’t have to worry about cross-browser compatibility.
If you like this idea, get ready for the events that inspired it.
My mother, over Christmas break, asked me to help create her Christmas card address labels. She had all the names entered into a Word document, but we didn’t have Word on that computer anymore (long story), just OpenOffice.org. Thinking it was fine, I attempted to print the labels.
It was not fine.
First off, the template that OpenOffice claimed would fit the packaged labels my mother bought did not fit. I had to make a custom template by measuring the physical labels and doing a lot of guesswork as to how OpenOffice calculated things. It was a lot of trial and error. Even once the template was complete, the labels still had formatting issues that were seemingly impossible to rectify as a whole. They were in a weird table… thing… that didn’t act like a table (no way to auto-justify the columns or even precisely adjust the columns or rows, you could not turn off borders, etc).
Eventually, I gave up on the previously existing document, and had my mother enter all of her addresses into an OpenOffice database (I believe the software is called Base). From there it was relatively easy to use the database as a data source to the template, and changes were easy to erect over every label.
However, still things were not perfect, as there was no easy way to make fields, if null/blank (like salutation), not appear on the label. Thus, an extra space would be on the label, and that drove me nuts. Eventually I gave up, and my mother said that she could live with an extra space.
There is a point here…
This was actually not meant to be a rant about OpenOffice (which has some major interface issues, but it’s FREE), but rather a question: could the web be used for print?
The answer is a qualified yes.
I cannot imagine ANYONE, after using Illustrator/InDesign, or web development, ever wanting to touch Microsoft Word again to create something more complicated than a simple document. It’s basically equivalent to the crappy wysiwyg editor that ships with every CMS or blogging platform that completely takes all the fun of writing out of… writing (this editor I’m using on Tumblr is not excluded from this). You have to fight to get things to nudge. There is a vague idea of block-level elements, but you’d never know where one begins and one ends. Have you ever had to move the cursor to a point where the formatting was “good” because somehow all the formatting at the cursor is completely contrary (or uses the default) to what you’ve defined?
Part of this issue is the lack of forcing a user to outline their document with styles.
Wait a minute. Styles? Block-elements? That sounds like…
HTML and CSS
Buh buh buuuuuh!
True, MS Word does use some proprietary XML format for storing its documents, but have you ever looked at the source of someone’s webpage that was completely built using Dreamweaver 8? Enough said.
InDesign is a powerful program, but is it possible to connect data to it?
So the question that I asked on Twitter today was an attempt to investigate if anyone has seriously considered using HTML/CSS for print. I’m not talking about print stylesheets. Well, I sort of am, but I’m not talking about printing web pages. I’m talking about printing something like labels.
This is possible, right now.
What needs to happen
Another challenge is the data aspect. That is, getting your data into this environment. This should actually not be too much of a problem. We’ve got IndexedDB! As long as something, like Google Contacts, can export as text, then parsers can be written to create. Not to mention that if we’re hacking on Mozilla, you could package another database, like MongoDb, as an extension, and offer a JS interface.
There are a lot more challenges, but mostly this is about the idea. Does anyone else think this might be valid or useful?
One example: holding down a key triggers multiple keydown/keypress events, but only after a short delay. Therefore, standard keyboard event handling is unsuitable for arcade-style movement.
To counter this, I made a small JS library called ID.js. It has a few simple methods, and is meant to be run in the context of a main game loop. On each iteration, the Update(dt) method is called, where dt is the timestep between updates. This allows for methods like TimePressedMs, where it returns the amount of time a key has been pressed. Or even if a key has been newly pressed for this iteration (i.e., this is the first iteration for which the key has been pressed).
One note: this script makes no attempt to normalize events cross-browser, or to provide support for IE. You shouldn’t be programming JS games to run in IE anyway (at least not until MAYBE IE9 comes out :))!
Check it out on github for a quick example and code!
Thought today: it would be so nice to watch a movie instead of catching up on TV, since that would be over in a few hours, and done. A diversion.
Wait, what? A movie would be a diversion from… entertainment?
There has been a large shift in visual entertainment over the last 10 years. Maybe it’s just my tastes. More likely, a combination of both. There is still the big budget movie experience. But it’s mostly irrelevant now. I rarely go to a movie, and when I do, I do not expect to experience anything but sheer entertainment. A movie, even with a huge budget, the greatest actors, writers, and director, just cannot have the same emotional impact as a long form work. The classic saying epitomizes this: the book was better.
UH OH TIME TO GET PSEUDO MATHY.
There are three factors to graph here: emotion, time, and effectiveness, for lack of a better word. I posit that the ratio of time to emotion is roughly equal to the effectiveness of the affectation of the audience. First, let’s talk about a movie.
A movie is a relatively short form of entertainment. Because of this, it is emotionally compressed. Look at Avatar, which is a great example of… something. Anyway, Avatar was supposed to be intense and emotionally connective, peering into what you know to be true but couldn’t ever admit to yourself… eeesh, Avatar is not a good example for this. Let’s talk about Titanic instead. Titanic is a relatively long movie, with numerous intense moments. Highs, lows, middles, great. Awesome. Sad. Death. Life. Etc. Let’s give it a 12,345 on the audience impact scale (AIS: the movie’s impact on the audience, not the other way around). It is a 3 hour movie. 3 / 12,345 = 0.00024. Great.
Have you ever watched the anime Trigun? It’s 24 episodes, each a half hour long. Yep, it’s about a gunslinger named Vash with tall blond hair, who is something a level above human. His brother believes humanity doesn’t deserve to exist, while he believes otherwise. Gee, that sure sounds like something that was recently on tv… black vs white, good vs evil… Jack vs… John Locke? Anyway, Trigun asks the audience some tough questions, like who has the right to decide that another living thing should die? Is there a greater good? Are there shades of gray in terms of morality? Watching the entire show, especially the last half, in a short period of time is emotionally draining. Let’s say it gets an even 9,000 on the AIS. Do the math… 12 / 9000 = 0.0013.
Regardless of how the math actually works, notice how, with less intensity but sustained over a longer period of time, the TV show comes out on top in terms of effectiveness. For the space folk in the audience, it’s the difference between an ion engine and a rocket engine. Sure, the rocket engine gets things going quickly, especially to overcome that initial obstacle called the Earth’s gravity, but the ion engine gets the payload going much faster in the long run, with a lot less expenditure of fuel.
A movie, due to its short form, just cannot have the same impact as a TV series. Look at Lost. Imagine it as a movie. It would be horrible (worse than it already is). It’s not really the ending that matters, it’s that it took so long to get there.
Where in the past, the emotional fix of the people was maintained by hopping from one movie event to another, today it has shifted to the television. This is best reflected in the proliferation of long-running serials, such as The Wire (or so I’ve heard), Lost, and Battlestar Galactica.
Very rarely do I see, “Hey audience, here’s a swift recap in the form of dialog from a main character so that the next thing I say won’t go completely over your head.” It still exists as a “previously, on ______”, which is fine. But there is a large sense that the writers are saying, “We don’t care if you don’t remember, because this is the story, and we’re doing what’s best for it, not you.” It’s the Apple mentality: we know best. They want to tell a story, but there will be no handholding.
But back to my initial thought. All of this means that the roles have reversed. Where once a person might prefer a movie as their big experience, their commitment, their quick hit, they now go for the serial for a sustained high that ultimately is more rewarding, yet a lot more effort on the part of the audience. And sometimes, I just want to relax. Who knew staying entertained was so much work these days.
P.S. Points to anyone who got that the title referenced this amazing moment.
CT taught me a few things, and even in it’s unfinished state, I’m proud to say I worked on it. It has asynchronous asset loading, map scrolling, animated sprites, menu-driven events, running, point-in-polygon collision detection (the walkable area is defined by a polygon), map switching, pixel-based text rendering engine, and some other tricks too.
Some things I’d do differently if I ever decide to continue working on it:
- I’m not sold on the way I implemented key detection. I took my previous experience with Flash and asynchronous key detection (that’s not my tutorial, but just what I’m talking about), and thought that it would be a good starting place. In actuality, I probably should have used something along the line of event handlers. In addition to being native to the browser, they are also much more suited to the single inputs of an RPG. Granted, browser keyboard input is far from perfect, especially the inconsistent manner that key repeat events are handled.
- Figure out how to handle “events”. Not browser events, but game events. The only experience I have creating RPGs is with a program called RPG Maker. It’s been a long time since I touched it, and several new versions have come out since then. But it’s basic premise was that you have a map of tiles, and each of these tiles can contain an event. An event is simply something that happens. It can be triggered by proximity, the keyboard, a timer, or something else. I used this model for CT. However, I attempted to handle events synchronously. That is, each iteration of the game loop checks what events are in progress, need to be triggered, are completed, or need to be reset. This just turns into a big mess of hairy conditional logic.
- The menu “system”, if it can be called that, is a mess. It’s a series of if statements for all the different types of input that can occur depending on what is showing on the screen. It’s extremely fragile.
- Separate the game world from the visible world. The game would should be a simulation of the world, and then the state of the world is rendered separately. It’s all the same thing currently.
- Find a better way to draw to canvas without reproducing the entire Flash DisplayObject paradigm.
Moral of the story: use the language’s strengths as that.
If anyone has questions or comments on the engine, I welcome the dialog. The source code is on github, where there is more information on features and what you can do.
I’ve decided that I should know how to make iPhone applications.
Having never used C before (or Objective-C), this should be a challenge. But hopefully, with a little bit of work (and a lot of reading), I can make this really cool, yet simple, application.
The idea: a transporter!
In Star Trek: The Next Generation and its successors, the transporter is actuated with an iconic swiping motion of the hand across a flat, glossy control surface. Check out 0:55 of this video: http://www.youtube.com/watch?v=S7cXWrdHshE to see what I’m talking about.
So, this app will basically just allow you to swipe your hand up, and make some sounds… a good opportunity for learning.