As he mentions, probably the biggest lack in the first device (other than, arguably, the app store) was copy and paste. That was an interesting choice to punt on, to let it wait until a future generation of the product could get it right...
One of the biggest "WOW" factors though was the web browser- especially the scrolling which he describes as:
Real-time dragging is such a priority that if the iPhone can’t keep up and render what you’re dragging in real-time, it won’t even try, and you get a checkerboard pattern reminiscent of a transparent Photoshop layer until it catches up (typically, an instant later). I.e. iPhone prioritizes drag animation over the rendering of the contents; feel over appearance.
As the hardware has improved I haven't seen that checkerboard in a while, but yeah- it felt SO GOOD, the perfect compliment to how the capacitive touch screen was allowing much more vibrant finger interaction than the stylus-or-fingernail screens that came before it.
There's some old line about "I'd rather spend hours writing a program to figure something out than ten minutes with a pen and paper"...
Anyway, a while ago I wrote about Parkie, a micro-webpage I made to calculate which side of the street I should park on.
Recently I updated it to cope with my new parking circumstance, with rules like "first and third Wednesday park on even side, second and fourth Thursday park on odd side". (This is more complex than the rules in Boston which at least always did it on the same day of the week) as well as making it sort of customizable... if one person writes me that it would be useful for them, I'd make it so its config block
{ startMonth:3, endMonth:10, restricts: [ {dayOfWeek: 3, nth: 1, avoid: 'odd/our side', gofor: 'even/other side'}, {dayOfWeek: 3, nth: 3, avoid: 'odd/our side', gofor: 'even/other side'}, {dayOfWeek: 4, nth: 2, avoid: 'even/other side', gofor: 'odd/our side'}, {dayOfWeek: 4, nth: 4, avoid: 'even/other side', gofor: 'odd/our side'} ] }
was readable from the URL, as URLencoded JSON. Until then I have to assume this will only be useful to me and my girlfriend so I won't bother.
The code is, admittedly, kind of nightmare of side effects and general poorly structured bullcrap. (Which is too bad, date calculations are kind of an awesome candidate for unit testing). The general question "which closest upcoming date (inclusive of today) matches a '1st/3rd Wed, 2nd/4th Thu' kind of rule?" is tricky! My approach was to take all the rules as outlined in "restricts", calculate which day of the month each represented for the current month, then walk forward from today to see which one matched first. (And being willing to jump to next month if need be...critical for the end of a month that ends on a Tuesday, say...)
So it's Vanilla.js. Besides using console.write(), kind of a forgotten way of constructing a page, The CSS used vviewport percentage widths for the character size, which got me nice, screen-filling (if a bit brutalist) results without fiddling with viewport stuff. (In this case the unit is 1/100 of the screenwidth, so 6 or 7vw would get a nice number of characters in per line.)
Daring Fireballs has had some anti-"dickbar" ranting lately (social media "share me share me!" widgets, often fixed in place -- this one on best practices for sharing (tl:dr; emphasize sharing via the site the person CAME from) has a side note
You read that right: adding a locked toolbar to the small-screen experience shortened sessions and reduced page views. The very small increase in share-button usage was far outweighed by reduced site usage. (I can't explain why this is the case, but I've seen it elsewhere with locked toolbars, too. They chase small-screen users away.)
That jives with some "surprising" A/B results we found at my job, where we though permanent "Contact" buttons at the bottom would get more hits- some of our competitors were using them, so they might be a good idea, but apparently irritation from users at the sacrifice in free screen real estate overcomes the "hey look at this!" factor.
https://mapstyle.withgoogle.com/ is kind of a "style roller" for Google Maps. I like the "retro" style especially, and it's the easiest way to, say, hide business names or what not if you don't want them cluttering the view you're making.
With all its dandy ports I still think my Macbook Air is gonna remain my main personal machine for a while, but I was still daydreaming over at apple.com, and I noticed both the "Adorable" Macbook and the new Macbook Pro have much better iconography for the modifier keys- displaying the ^ over control and the weird broken equals sign for option, so that both of those join command key and its little clover in actually showing up on the physical keyboard the same way they do for the top of the screen menus.
A definite improvement! But it raises the question, why are Apple's modifiers keys such a hot mess? Don't get me wrong, it's a pleasure to be back in a shell and have cmd-c copy and ctrl-c break, but really, fn, control, option, command (not to mention shift) - so often arbitrarily thrown together in strange combinations by various programs for random shortcuts.
Windows had a much more coherent strategy (despite its weird legacy of "alt-f4", and various exceptions in various software titles) - there's only three keys down there, really: the hubristic "windows" key, control and alt. And control keys usually are tied into commands meaning "do this now" and the alt key was tied into menu pulldown shortcuts.
I suppose this disdain for keyboard menu operations flows from the Mac history of relying on the mouse; remember, the first Mac lacked even arrow keys, and there's never been the same menu pulldowns via keyboard that Windows has enjoyed. But it's weird they went from such minimalism to such a multi-key mess.
I've always liked software that let the user make something - from Bill Budge's Pinball Construction Set to the make-a-game fun without programming Klik N' Play, there have been some great examples of that over the years.
I want to write briefly about two creators, Toshio Iwai and Takeo Igarashi both of who made original UIs letting users exercise their creativity. Each creator's work was then used in separate commercial products in the 90s and 00s, products that deserve more recognition than they get.
Toshio Iwai is a multimedia artist. He may be best known for Electroplankton, a fairly early but very limited release for the Nintendo DS- his name appears on the packaging for it, an unusual-for-Nintendo recognition of singular artistic creation.
Electroplankton is not quite a game, not quite an instrument... it consists of ten different interfaces for making music and sounds of various types...
This was not Iwai's first multi-part collaboration with Nintendo - that would be the 4-part Sound Fantasy. One of those parts was based on his earlier work Musical Insects. This concept, 4 musical bugs, each one playing a different instrument that sounded at various pitches as the bug waddled over different colored tiles laid out on a blank canvas, got parlayed by Maxis into a nifty package called SimTunes. I guess this trailer gives you the overview about as well as anything:
This program was a terrific and playful mini-sequencer and paint program. Kids and Adults could focus on the sound, the look, or both. Just out of college, I remember setting it up with versions of Groove is in the Heart and "Alphabetter", a replacement for the alphabet song that I hope catches on but I'm sure never will. I appreciated that it had different palettes - for example, limiting the painted notes to a specific scale or modality, such as my favorite "Blues Scale" and an aspiring kid or adult could easily apply music theory they had or learn something new.
More recently Iwai collaborated with Yamaha to make the Tenori-On, a sequencer grid of lights. (I was almost ashamed at using a ThinkGeek knock off called the Bliptronic 5000, 'til I realized it was about 1/10 the price... and about 1/10 the functionality, but still.) I also found this overview of his art installations.
Takeo Igarashi seems to be more of a computer scientist than an artist, but his UI implementations are at least as impressive. His academic homepage is of the ancient variety, and sadly most of his demos are a serious pain to get running in this day and age where Java on the desktop is all but forgotten. Still, his Smooth Teddy interface is remarkable; the user draws basic 2D shapes that then get rendered into 3D shapes.
The most straight forward descendent of the "Smooth Teddy" family is MagicalSketch 3D for iOS, a somewhat pricey (by app standards) tool, but one that promises to be an easy path to modeling for 3D print. (I haven't played much with Microsoft's "Paint 3D" but I think they would be well-served licensing out the core model.)
The finest rendition of this concept, however, is Magic Pengel: The Quest for Color for the Playstation 2. I feel it's a shame it didn't go by a more direct translation of its Japanese name, "Doodle Kingdom", because this project (a joint production with some collaboration from Studio Ghibli (of "My Neighbor Tortoro" and "Spirited Away" fame) deserves more attention than it ever got. (A "Pengel" is a Pen-Angel, I think a little helper sprite in the game. I'm not sure to whom they were trying to market with a name like that.)
Because not only can you doodle in 3D - your creations come to surprisingly charming life. Here's a Let's Play of it:
The editor works by letting you indicate what you're drawing (body, arm, wing, etc) - this knowledge is then incorporated to inform various animations (Walk, Tackle, Jump, Dance, etc) and the effect can be stunning- here's what a talented artist can make with its editor:
It's so delightful to sketch something out and then have it frolic around the "practice field".
Unfortunately, the game is horribly marred by ... well, too much game-ness. In some ways the body you construct doesn't do much to determine how your creation interacts with its virtual physical universe, it's just raw numeric material for a probability based monster battler ala Pokemon, with Rock-Paper-Scissors type strengths and weaknesses. Also, they limit the amount of "ink" you have to draw lines with, and then make the game about fighting monsters so you can get more ink to make your own creations that much more powerful, rather than creative.
There was a semi-sequel for the Game Cube called Amazing Island and one for the PS2 called Graffiti Kingdom. I remember getting absolutely stuck early on in Amazing Island and some utterly crap minigame, and if memory serves, Graffiti Kingdom tried to codify its editor too much, and lost much of the organic charm of the original.
Finally, I'd like to make one honorable mention for a game with a kind of brilliant editor built-in (though I don't believe there's a singular artistic vision behind it) - Banjo-Kazooie: Nuts + Bolts:
This is by far the best "game" of everything I've talked about here - it starts with a gorgeous Mario 64-esque hub (looking like someone said "what if we ran all those pretty colors of the N64 into the kind of engine we can make today?) with all these delightful themed subworlds, but each as if you can see the gears behind the walls work. Each subworld has multiple challenges that you build various vehicles to beat: cars, of course, but also boats and planes and flying balloons and sumo-karts etc. At first I thought all the creations were ugly and orthogonal-looking (VERY reminiscent of the old Capsela toys) but then the delight of making a car where the design really matters in a cartoon-physics kind of way takes over (and you can put on enough bolt-y bits to improve the look quite a lot.) And as you get more parts (there's that game-ness) you can go back and try for higher "medals", but the challenge level is generally well done, and the level of backtracking needed is negligible.
(And a small group of super-hard-core fans have really stretched the editor system to the limit, making these absurdly heavy jet-powered walking mechs in a game that was never meant to have any such thing...a joy to behold.)
Anyway, I love stuff like this, making a easy enough for a beginner but rich and engrossing enough to reward continued play (rather than a quick doodle and a "meh") is a tremendous feat. (Though I did once get a few people digging my own online Jack-O-Lantern maker) Both of these people and their works (and Banjo-Kazooie) deserve much admiration.
For a long time, I've been meaning to get back to the 30 Day Vanilla JS Coding Challenge. I learned a lot from the very first lesson even, which is a nifty little drum kit. Here's a kind of "throb" effect I picked up and modified from it, uss CSS transitions and transforms for scale: click the blue div to see it work...
0
Here's the code for that, most relevant bits bolded: <style> #css_throb_button { background-color:blue; color:white; padding:4px 20px; transition: all .1s ease; } .throbbed { transform: scale(2); } </style> <div id="css_throb_button" onclick="css_throb_test(event);">0</div> <script> var css_throb_count = 0; function css_throb_test(e){ var panel = e.target; panel.classList.add('throbbed'); panel.innerHTML = ++css_throb_count; } function css_throb_removethrob(e){ if (e.propertyName !== 'transform') return; e.target.classList.remove('throbbed'); } document.getElementById("css_throb_button").addEventListener('transitionend', css_throb_removethrob); </script>
So a couple notes:
there are a few ways of removing the class. You could also use setTimeout, but this is nice because it keeps you from having to confirm the timing (as set in the transition) in two places.
the scale transform doesn't work on inline elements - so when I started with a "span", I couldn't see the transform effect until I changed it to display:inline-block...
also to keep things simple I'm not doing anything special for making sure the document is ready, so I had to put the script tag after the div element in the page so the getElementById() would work
I like how it zooms in place. There are ways of tweaking the timing, size, and easing, but this seems like an easy way of getting attention to the element.
A sysadmin-y friend of mine has helped me use Lets Encrypt to get my https mojo working on my virtual server.
One problem is that a page loaded on https referencing external scripts over http break.
One flexible fix for that is, with most of these URLs, the protocol can be left out, so instead of changing http:// to https:// I sometimes change it to // -- what we used to call wak-wak a few jobs alone. In effect your saying "load this with whatever protocol this is loaded". I guess it will break if the underlying site hasn't gotten around to offering https though...
