EarthX
Chief Design Officer
EarthX is a data visualization platform with proprietary 3D globe technology and mapping tools. They provide web-based software that allows users to publish data and to create interactive map layers and cinematic stories, called GeoStories.
As Chief Design Officer I designed the brand, UI/UX for their mobile application, desktop tools for publishing layers and GeoStories as well as all marketing collateral.
Mobile Application
Vast amounts of geospatial data are collected daily by scientists in nearly every field. Stories and narratives lie in this data that reveal themselves when it is visualized. Unfortunately, there are few channels in which to communicate this data in an engaging way to the general public.
EarthX set out to solve this problem by developing a mobile app that allowed users to load these layers of data onto a 3D globe and interact with it in a meaningful and informative way .
We needed to organized these layers into a catalog that was intelligently categorized and straightforward to browse.
EarthX Mobile App Slpash Screen
Wire Frames
We developed both open and closed card sorting exercises which we presented remotely to a group of potential users. The goal was to understand how our users would organize and structure the various layers we had created so we could design a catalog in the app.
Worked extensively with our engineers to determine appropriate web technology that was flexible enough to allow our 3D engine to render on both mobile and desktop browsers.
Created wireframes, motion studies and interactive prototypes to test how the user interactions would work. Simple, clickable versions were tested with our user group using InVision.
We determined that the mobile experience was best delivered as a responsive web app to provide an optimal experience on both mobile and desktop.
A categorized layer catalog was designed based on feedback from our sorting exercises that included search, tags and filtering. The catalog functionality afforded the user the ability to either explore the contents casually or find exactly what they wanted to see.
EarthX Mobile App
EarthX Mobile App
EarthX Desktop App
EarthX Mobile App
Layer and GeoStory Authoring Tools
The EarthX mobile and desktop apps required content in the form of geospatial data “Layers” as well as the narrative “GeoStories”, which utilized these data layers. The content was largely user-generated by the networks of scientists we had been working with, as well as any person or organization who held geospatial data they wanted to visualize. We needed to design two separate publishing tools.
The Layer authoring tool would ingest the data and allow the user to style it. The GeoStory authoring tool was a linear, timeline-based tool (similar to a video production tool) that allowed for adding audio, captions and the capability to turn layers on and off over time.
In addition to these authoring tools we needed to design and develop screens for administering a group account for organizations that were going to use the tools commercially.
Wireframes
Worked closely with our Product Manager and engineers to develop the functional specifications.
Iterated on wireframes to test functionality
Worked closely with our Product Manager and engineers to develop the functional specifications and then moved on to iterate on the wire frames.
Produced motion studies for several of the UI components to communicate how the interactions should occur.
Developed clickable prototypes to test on our beta partners and gather feedback to be incorporated into the final designs.
After the designs were handed off to engineering for development, it was determined that the time frame was too short for the ambitious scope. I had to revisit the designs and remove some of the more problematic functionality until a later release.
GeoStory Authoring UI
Layer Authoring UI
Layer Authoring UI
GeoStory Authoring Admin UI
Web Design
Exisitng Web Experience
We needed a website that articulated our product offering to content partners as well as potential users. The content we had included a vast library of layers and GeoStories that we had created internally. We wanted to showcase these as they had enormous visual impact.
Website Information Architecture
Gathered content from stakeholders to determine information architecture.
Created wireframes to visualize site structure.
Designed high fidelity screens.
Coded website using Blocs App to be fully responsive.
Turi Website
The final site sucessfully communicated the goal of our platform, which was to serve as an innovative bridge connecting geospatial content to an engaged community.
The home page incorporated a product demo video that I created using footage from the product, still images and audio that I produced in After Effects.
Assorted Elements
