Data.State Portal

(ZenPoint Solutions)

Data.State is the State Department's first Data Portal, which provides data scientiests and technologists the information they need to explore, research, and develop their own data products.

My Roles

Research, Wireframing, Design, Prototyping

Tools and Technologies

Balsamiq, Adobe XD


Research

I joined the product after the personas were developed. Our target was narrow, with a small range of technology savvy individuals who had a penchant for research and tinkering.

I conducted comparative analysis of probably close to a hundred data portals at various levels of organization and government. The majority of them used the same platform and were pretty cookie cutter.

Our product ecosphere, data topics and other static content differentiated our needs from those of these off-the-shelf products.

We wanted to speak with a group who had developed their own platform. Having connections with some folks in Boston, our group interviewed the team who developed the city of Boston's data portal. Their influence helped shape our understanding of metadata and search.


Wireframes

These early wireframes represent the guts of the application. The card pattern was used throughout the site, as was the search listing pattern and search faceting.

Homepage WireframeHomepage Wireframe
Topics WireframeTopics Wireframe
Search WireframeSearch Wireframe

Mockups - Version 1

These represent the first set of mockups produced for the soft launch.

Homepage MockupHomepage Mockup
Topics MockupTopics Mockup
Search Page MockupSearch Page Mockup

Mockups - Version 2

The CDO requested a complete facelift for the marketed release. Below are some screens which represent that look & feel and functionality.

Homepage Feature SizesHomepage Feature Sizes
Campaign PageCampaign Page
FAQ PageFAQ Page
Dataset PageDataset Page
Customize TableCustomize Table
Design SpecsDesign Specs

Usability Testing

Also post-launch, a question was posed to try left-sided filtering vs. top bound filtering. I recommended we test to inform of us of how the tool was currently being used and how users would do with a new orientation.

The test proved that each UI could handle the task equally well, but the overwhelming sentiment following the test pointed to a clear top bound solution as the winner. Additionally, we gained insight on how to better name some of the headings, which was a very helpful bit of information.

Usability TestUsability Test Result
Usability Test HeatmapUsability Test Heatmap

Mockups - CMS

Post-launch, a content management piece was requested, here are those mockups.

Topics MockupTopics Publish
Homepage MockupTopics Edit

Results

The portal's launch was the centerpiece of the Department’s first-ever Enterprise Data Strategy.

Data.State boasted 11,000 views, 1,700 unique users, 200+ dataset downloads and 37 MRD aligned datasets in its initial rollout.

Homepage Wireframe Search Wireframe Topics Wireframe Homepage Search Page Topics Page Homepage Feature Sizes Campaign Page FAQ Page Dataset Page Customize Table Design Specs Usability Test Result Usability Test Heatmap Topics Mockup Homepage Mockup