Coding In Paradise

This is my personal blog. The views expressed on these pages are mine alone and not those of my employer.

Sunday, October 21, 2012

Ring Runner: Flight of the Sages Kickstarter Campaign

My stepbrothers have been creating an amazing game called Ring Runner. They've setup a Kickstarter campaign recently to take it to the next level:

Ring Runner combines all the deep customization and rich storytelling of an RPG with the fast-paced action of a space-shooter.

Check out their Kickstarter campaign and support them!

// posted by Brad Neuberg @ Sunday, October 21, 2012 0 Comments Links to this post

Wednesday, May 30, 2012

Inkling for Web: Amazing HTML5 eBooks

Inkling, the startup I work for, has just released Inkling for the Web, completely built with HTML5.

Here's some cool demos you can see right in your browser:

Check out this page live jumping someone through a song by Beethoven.
Or this one that shows you how to do photography; drag the slider to see how changing the aperture on a camera changes the image.
Learn about Renaissance music here.
Or for travel, learn more about California with this guide book; notice the interactive widget that tells you what the weather is in real time for the location shown.

This joins our Inkling iPad client and our web-based publishing tool also built with HTML5, Habitat.

Learn more about what Inkling textbooks can do, or come join me and build the future!

// posted by Brad Neuberg @ Wednesday, May 30, 2012 0 Comments Links to this post

Monday, February 21, 2011

Top Ten Reasons JavaScript Hackers Will Love Working at Inkling

Have you been playing around with the latest technologies in HTML5 & CSS3 and are itching to deploy them in actual applications?

Are you passionate about JavaScript and want to do real software engineering with it?

Do you want to work with a nimble team creating tangible software that helps people and society?

Come join me at Inkling! Inkling brings the world's best content to the iPad with interactivity, social collaboration and simple ease-of-use. No more heavy, expensive textbooks to carry around campus. Inkling textbooks are more interactive, more flexible and cheaper than their print alternatives.

I joined about about three months ago and am loving it. I'm looking to bring in fellow JavaScript hackers from the community to work with. We have huge plans in 2011 focused on the web and we need talented engineers to help make that happen.

One of the best parts of working on Inkling is our freedom to use the latest web technologies, since we target WebKit and newer emerging browsers to exclusion of older technologies. This includes everything from using HTML5, CSS3, and SVG to using newer, nimble micro-frameworks like Backbone.js for MVC, Jasmine.js for testing, and Mustache.js for templating. The future is already here, it's just not evenly distributed yet.

In late night talk show host style, here's my top 10 reasons why I love working at Inkling (and you will too!):

UX and Product Design - I've never seen a startup (or even large company for that matter!) so dedicated to the user experience and product design and Getting It Right. There is an extremely talented team of UX people here, which makes me feel better as an engineer that the product and UX for what I'm building is the right one.
Geeks - Inklingers have no qualms admitting they're geeks, reveling in their nerdiness. We have people here with backgrounds in mathematics, science, biology, history, and more. Many of us happily admit to playing role playing games like D&D and even throwing the occasional d20 here at work sometimes. Our CEO lost at a game of Settlers of Catan last week.
Python and Amazon Web Services - There's nothing more productive than getting to code with Python on the server-side, while Inkling's infrastructure is pretty much virtualized using the latest Amazon Web Services like EC2. Both add up to getting more done faster.
Changing the World - I love coming in and knowing I'm making a tangible impact on people's lives by moving education and textbooks into the future.
Laughing - Even though there is a tangible sense that all of us are changing the world, I feel like I'm laughing all day long.
Unit Testing, Continual Builds, and GitHub - Creating great products requires a commitment to solid engineering and tools. If you've been exposed to unit tests, continuous integration, and GitHub you know how much all of them rock and make programing much more fun and productive.
Shipping Software - We've already shipped multiple versions of the iPad client; this is important, since having great ideas is one thing but real artists ship.
Small Team - You can actually get to know everyone here, and everyone involved in what you are doing sits right nearby. After having been in a big company myself recently there is nothing more refreshing than working in a small one and experiencing how awesome it is!
Great Location in San Francisco - I live in San Francisco; my old commute at my job was close to three hours round trip if the traffic was bad. Now its about 15 minutes by public transportation or a bit longer if I want to bike to work! The Inkling offices are about two blocks away from Union Square, so it's a great area.
Webkit - There's nothing better than developing for the leading edge of the web rather than the trailing edge. Imagine getting to use the latest technologies as a programmer rather than having to help IE 6 play catch up. It's awesome and transformative.

We have very high standards for engineers, which makes it that much more enjoyable to work here. If you're interested in pushing the limits of modern web technologies to build something that changes the world, you'd probably love it at Inkling. Come join us and be sure to say hi to me when you come in!

Labels: html5, inkling, javascript, jobs

// posted by Brad Neuberg @ Monday, February 21, 2011 0 Comments Links to this post

Thursday, February 03, 2011

New SVG Web Release: Watch Out for the Lurker Above!

A new SVG Web release is out, code named Lurker Above!

The Lurker Above is a classic Dungeons and Dragons monster, attaching themselves to dungeon ceilings and dropping down to surprise unwary adventurers:

SVG Web is an open source drop-in JavaScript library that provides SVG support to Internet Explorer 6, 7, and 8 by transparently using Flash.

Some highlights of the Lurker Above release:

* Internet Explorer 9 is now supported!
* Lots of bug fixes
* More SMIL support and fixes
* Support for SVG Web when used in iframes
* data-path attribute is now optional and inferred when using SVG Web
* and more!

Special thanks to Rick Masters for sheparding this release, and to all the bug fixes and help from the SVG Web community!

Download the release now and get started

Labels: announcement, flash, internet explorer, open source, svg, svgweb

// posted by Brad Neuberg @ Thursday, February 03, 2011 1 Comments Links to this post

Wednesday, December 01, 2010

Tricks for ARIA on the iPad/iOS

I've been doing some work using ARIA on the iPad (iOS 4.2) and wanted to share some of the things I've found for others so they don't have to grope in the dark like I've been :)

Introduction

ARIA on the iPad is implemented using VoiceOver, which when turned on will 'read' everything for a user. When in Mobile Safari there is also something called the Web Rotor, which is a cool virtual 'dial' that appears on the screen when you do a two finger touch and turn it. This dial allows users to jump through your pages in different ways, whether by character, words, links, landmarks, etc.

Navigating in VoiceOver is straightforward. Swipe left and right to simulate 'tabbing' through the elements of the page. Swipe up and down to jump through whatever the Web Rotor setting is; for example, if Web Rotor is set to Lines, it will jump by lines. Using three fingers to scroll the page up and down. Do a single touch to select an element; once selected double-tap your finger on the element to simulate a single mouse click. The element that has the current focus will have a black square around it and VoiceOver will announce the appropriate text with audio.

Note that for the work I'm doing I only have to have the ARIA I'm creating work with VoiceOver on the iPad and not with other screen readers, so take the material below with a grain of salt if you have to do cross-screen reader work.

Synthetic Links

I wanted to be able to have users jump through the page between all the links; some of the things I was working with were 'virtual' links that JavaScript actually activated, such as HTML5 <figures>, etc. It turns out you can have these show up as fake links to VoiceOver and Web Rotor by adding role="link" to the element:

<figure role="link">

tabindex="-1"

ARIA provides the ability to use the tabindex on any element now to control how tab ordering and focus works. It is possible to use tabindex="-1" in order to keep an element from being focusable by the user. However, I was unable to get this working in VoiceOver; either I'm misunderstanding tabindex="-1" or it simply doesn't work in VoiceOver.

For example, let's say I have the following markup:

<h1>This is an H1</h1>
<h2 tabindex="-1">This is an H2</h2>

If I give the H1 focus, and then swipe to the right, my understanding is VoiceOver should not then jump to the H2 and give it focus, but VoiceOver incorrectly gives the H2 focus. This seems like a bug to me.

The workaround I've found, which I'm not happy about, is to use aria-hidden:

<h1>This is an H1</h1>
<h2 aria-hidden="true">This is an H2</h2>

This will then hide the element from the tabindex ordering in VoiceOver. This is not a happy long-term situation however, so if someone has a better way to do this (or perhaps an explanation of how I'm using tabindex="-1" wrong) that would be great.

aria-labelledby

Supposedly you can attach aria-labelledby to any element, giving a list of IDs that provide a descriptive label:

<h1 aria-labelledby="part1 part2 part3">Foobar</h1>

Where part1, part2, and part3 are the IDs of three other HTML elements. When the H1 is given focus, VoiceOver should read the text values inside elements part1, part2, and part3 (if my understanding of aria-labelledby is correct). Unfortunately VoiceOver only seems to do this for BUTTON and INPUT elements that use aria-labelledby, not other elements.

To fake this, combined with the previous tabindex="-1" hack, I have to do the following, using role="heading":

<div role="heading">

<h1 id="testH1" aria-hidden="true">
This is an H1
</h1>

<h2 id="testH2" aria-hidden="true">
This is an H2
</h2>

<div id="testDIV1" aria-hidden="true">
This is a div
</div>
</div>

If ARIA worked correctly in Mobile Safari/iOS 4.2, then the correct markup to achieve this would be:

This is an H1

</h1>

This is an H2

</h2>

This is a div

</div>

Update: I was also able to get the above chunk working using role="group", but not when the parent element was a DIV; it only worked on LIs for me:

<ul>

</ul>

Sigh; we really shouldn't have to do this to our markup or our ARIA. Fix these bugs Apple :)

Update: Voice Pause

Technically, you should be able to use a comma to cause VoiceOver to 'pause' between items:

Hello, World!

Will cause VoiceOver to pause at the comma.

What happens if you are using the aria-labelledby trick/hack above in order to have VoiceOver 'talk' out loud multiple elements at once?

<h1>Foobar</h1>

<h2>Zoobar</h2>

VoiceOver will munge Foobar and Zoobar together, speaking them outloud too quickly.

In a sane world you could solve this by adding a comma with CSS, or by using CSS Aural Stylesheets which aren't supported by basically anyone:

h1:after, h2:after {

content: ",";

}

</style>

However, Speech Media Query stylesheets aren't supported on iOS 4.2; even if I apply the content style rule with the comma as a general style sheet, VoiceOver doesn't pick up the pause.

It turns out I have to put the comma in my markup itself to have the pause take effect:

<h1>Foobar,</h1>

<h2>Zoobar</h2>

Now VoiceOver will pause between the two elements.

While you're here, why not check out Inkling, the company I work for? We are creating interactive digital textbooks for the iPad. Oh, and we're hiring too :)

Labels: aria, html5, ios, ipad

// posted by Brad Neuberg @ Wednesday, December 01, 2010 4 Comments Links to this post

Wednesday, November 24, 2010

I've Joined Inkling -- Digital Textbooks FTW!

This is my first week at Inkling and I'm super excited to be here. Inkling is building interactive and social digital textbooks on the iPad. Digital textbooks are a perfect place to explore moving beyond the traditional book.

Traditional textbooks are heavy, so digital ones automatically gain the benefit of being lighter. Inkling textbooks can be purchased by the chapter, just like on iTunes. Traditional books, such as a novel, will probably not change that much as they transition onto devices like the Kindle, but educational textbooks are perfect for exploring ways to move beyond the book. Textbooks are educational and social vehicles, so it makes sense to integrate video, audio, and interactive quizes and illustrations. Inkling is doing all of this and more.

Inkling itself is built with a unique combination of HTML5; native bits in Objective C; a textbook markup language named S9ML; and parts in the cloud. I'll be focused on the JavaScript and HTML5 parts as a Web Application Engineer, though I'm interested in getting a chance to do some Objective C at some point. I'm also excited to be working closely with fellow JS folks Andrew Hoyer and Scott Kyle.

Inkling as a company and culture is interesting as well. They are based in San Francisco and are small, so it's easy to get things done quickly. They have a real commitment to usability with a great UX team.

Try out Inkling yourself on your iPad. Also check out joining Inkling if you're looking for a great place to work.

Labels: announcement, inkling

// posted by Brad Neuberg @ Wednesday, November 24, 2010 3 Comments Links to this post

Subscribe to Posts [Atom]