My responsibilities on this project included:
- designing the interface,
- coding the interface using HTML, CSS and Javascript, and
- testing the interface across multiple browsers and addressing issues.
One of our first all-javascript applications. This particular app has had an interesting lifecycle – it started as a print project, then was broken apart to be displayed in HTML, and later Flex, and finally put all back together again as seen here. I was involved in most of those iterations, including the epiphany that was the current version. We were still in beta in the Flex version (that I wireframed) when I realized we were overcomplicating the whole application by adding too much emphasis on a map (the drawbacks of working in a geospatial-heavy organization).
So one day, I just decided to take the data service for the Flex app and see if I could whip together something using HTML and Javascript that looked as near to the original print document as I could make it. One week later, I had what I would call a solid alpha of the project complete. Presented it to the various project teams that were part of the overall Snapshot project, and was given the green light to finish development.
What I am most proud of about this application is its simplicity. The interface gets you to where you want to go and then gets out of your way. I was particularly proud when – after doing a large, hands-on demo at a conference – there wasn’t one single piece of feedback on the interface from the group. An interface that no one notices is the best interface of all.
The initial screen a user is presented. The whole app is run using jQuery and liberal amounts of custom functions.
The Flood Inundation snapshot. Charts are built with Highcharts, and the maps are built on top of ESRI’s Javascript API.
The Ocean Jobs snapshot. The data for the charts (and some of the inline text) is provided from a SQL Server database via an Open Data Protocol. It is fed as XML, and then parsed by the javascript in the app.
