4 years. During school times that’s the equivalent of getting a degree. 4 years of high school – high school diploma. 4 years of college – bachelors degree. Now, I’ve completed my 4 years of Amazon – my own degree of craftsmanship.

When I joined, the digital music division of Amazon in SF, it was about 15 people. It was actually called A2Z Development center then, and we couldn’t sport the official Amazon name. At least not until Amazon started collecting taxes in CA that is.

Now that I’m leaving, it’s I think around 250. Tremendous growth – obviously meaning a lot of investment from Seattle – and during it all we launched a plethora of products. I experienced a lot, but now it’s more akin to Amazon proper (Seattle) than the ‘little SF office that could.’ So I’ve bid ado to my friends there, and very excitedly head back to a small environment with the startup Jut.

I’ll be making some posts on products I helped launch. I’ll probably keep the posts pretty dry because Amazon is kind of draconian on their information sharing, but it’s always nice to share accomplishments of work past, so that’s what I plan on doing.

Advertisements

Ok, long time no post. I’ve been working on some very cool stuff. I was the front-end architect for the Amazon Cloud Player as well as the tech lead for the Amazon MP3 Uploader. Both of these along with the Amazon Cloud Drive that the player uses were launched just under 24 hours ago and so far the news seems good. Very excited to see how this grows and how people react. Could write a lot more, maybe later, but I’m keeping busy right now so who knows.

I like documenting the previous work that I’ve done, so I’m posting some of the pages from PlayFirst.com that I worked on. Much credit needs to go to Colin Felton, Karen Chu, and Maria Waters, the designers at PlayFirst, for the exceptionally attractive designs they came up with. Sadly, pictures don’t do justice to the full experience since much of a UI is how it reacts as you using it, but I don’t feeling like doing a video, and the site is already changing, so I’m a little late.

Front Page of PlayFirst (Dec 2009)
The global nav, which includes the left sidebar, was all coded up by myself. Not shown is that there could be a popup when hitting this page that would display a marketing video to users who hadn’t seen it. Big game launches would use this feature, but since it was slightly intrusive (as popups are), we only used it for promoting the best quality games.
Front Page of PlayFirst (Dec 2009)

All Games Page
The All Games page listed, of course, all the games for sale. There was a feature to include an image with a link at the top of the page for promotions. This could be a rotating set of images that would change each time you hit the page. Next to the front page, this was the second most hit page, and that kind of exposure could drive traffic for important new releases.
All Games Page (no hover)

The fun feature I built on this page was a pop over for the game images. It would seamlessly display more information over top of an image that you hovered over. This could include game description, pricing, buy/download buttons. These would open as you hovered over an image, and go away as you hovered away. As you might notice between this and the above image, the popup image was perfectly aligned with the main page image giving it neat effect when it faded and out.
All Games Page (with image hover)

There were a number of things to consider while doing this feature. First, you only want one loading and opeing at at time, and you don’t want one opening if you scroll and hover over while scrolling. Popup placement was a changing target too if you scrolled any as the popover still needs to render perfectly over top of the image even if it moved a little. On performance, when you’re tracking hundreds of potential target images to activate the effect, that’s an event that can drag on performance if done without consideration (one key to the solution being event delegation). For this page, I had to make performance adjustments as there were over 700 game images on the page, and even though the popup was an AJAX created popup (created on hover), the hover over and off effects needed to immediately load and reloading each time perfect on top of the image even after scrolling some.

Another feature that you can’t see on this page without using it is partial image loading. The 700+ games are in a table that is filtered with javascript as you select categories on the left sidebar, or type in a title in the title filter at the top. The page needed to re-render the images instantaneously, but also only load the minimum number of images for the viewport. As you’re seeing only 12 or so of the 700+ possible images at any one time, I’d only load those plus a few extra for when you scrolled. And then, as you scrolled, new images would populate themselves just outside of the viewport, so you’d always see something, but the page wouldn’t get slowed by trying to render so many images, including when you filtered them by category, title, or some other criteria. (Obviously, people with javascript wouldn’t see these features, but the page would still work).

Detail Page
The game detail page was completely redesign and I did all of the implementation work for this very important page. There’s a slideshow of game images, and possibly a link to a game trailer. The buttons, try it, buy it, buy with PlayPass, would change depending on the game’s status (pre-release, in beta, live, etc.), and the user’s membership status with the site. The tab selection would change as not all games would have all the tabs. I made the tabs with AJAX enabled content loading. For SEO purposes, there were uniques pages with URL for each tab view, but if you had javascript on, then the content would fade in place of the content for the previous tab.
Game Detail Page

Another view of the detail page. This time with a non-PlayFirst game.
Game Detail Page (non-PlayFirst game)

Not all of the pages that I touched, or features I worked on, but these were the key ones that I had a lot of impact on. Overall, I helped reduce page load times by up to 45%. Average load time for the site dropped from ~6 seconds to ~4 seconds. The main reason for this was optimization of the thousands of images used on the site. Use of sprites for buttons and other elements helped smooth over interactions and such. Lots of fun, but I’ve moved on.

Thought I’d mark this moment on the blog. I’ve recently quit my job with PlayFirst.com, and I’m moving to a new position with Amazon.com. Lots of smart and experienced people at PlayFirst with an interesting and always changing environment, but I’m really looking forward to my new position working on Amazon’s MP3 digital download store and helping build and improve its interfaces.

I’m posting almost never now, but that’s just because I’m busy with other stuff. Work is ever changing and interesting, and I’m going backpacking in Peru in a few days.

My last post was a partly about differences of opinions at work, and while I haven’t really made much progress moving people to my point of view, I am altering my view on things a little. First, things are working well enough with how we’re doing our jobs, so I have to give that credit. Certainly, some problems could have possibly been avoided, and some future problems that we’ll have to address still loom, but overall, things are functions well enough code wise.

So really, our biggest challenges are business oriented, and the company is at a special place trying to push itself passed that key tipping point for a startup, so there’s an especially acute set of pressures coming from the business side. That’s caused me to tone back my point of view a notch in light of understanding the business needs better, but it’s also toned back a notch because I’m more interested in focusing my efforts on front-end development. Also, I’m on the committee that’s helping draft company core values as well as improve internal company problem areas, which is a fun big (internal) picture kind of function that I really enjoy, and which I hope will also help us become a much better company.

But that will all be placed on hold very soon for my hike to Machu Picchu, and I’m getting really excited for this trek (if not so much for the 30+ hour flight down south).