UI/UX, iOS, Android
At Steamclock Software, I worked on the design for the user interface, app icons, and App Store and Play Store assets for Peer 1’s Map of the Internet. Concept for the app was by Peer 1. Design and development for the UI and 3D visualization was by Steamclock Software. Watch this video by CNN Money or read on to learn more.
When you first open the app, you can swipe through a quick tutorial. The tutorial explains supported gestures, how to search for ISPs, what colors signify, how to toggle between the Network and Globe views, and scrub the Timeline.
Toggle between the Globe and Network views by tapping the “eye” icon in the top nav. Tap on any node to center and zoom it into focus. Pinch to zoom in and out on the map. Drag to pan and explore in 3D.
Search & Traceroute
Tap the “magnifying glass” icon to open Search. Details for a focused node slide up from the bottom of the viewport. To perform a traceroute between your ISP and a focused node, tap the blue button, “Perform traceroute”. Swipe up from the bottom of the screen to view detailed stats on the traceroute.
Context menu – iPad
On the iPad, details for a focused node are displayed in a context menu positioned over the node.
Traceroute – iPad
The height of the context menu extends as details for the traceroute are displayed.
Timeline – iPad
Tap the “counter-clockwise” icon at the top of the view to enter the Timeline view. Scrub the clock along the Timeline to read about key events in the history of the Internet. The map increases and decreases in detail as you explore the Timeline.
The Timeline is available in both the Network and Globe views.
Icons & App Stores
I designed the Map of the Internet icon in collaboration with Allen Pike. I designed and produced all of the UI assets and the App Store screenshots.