Lyle Klyne » Interaction & User Experience Designer – Fognet

Fognet

Decentralized internet powered by IOTA

Fognet hero image

tl;dr

This was a collaboration with Evan Feenstra, a colleague at the University of Washington, to develop a decentralized internet router powered by the IOTA protocol. IOTA uses an iteration of blockchain technology called a tangle and is one of the only cryptocurrencies we consider to be truly decentralized. Evan handled the complicated technical execution of the hardware and software, and I helped with concept development and communication. We entered a hackathon put on by the IOTA Foundation and won first place. I also created a website to celebrate the project’s success.

View the live website at Fognet.world.

Step 1: Video

I joined the project to help with the video submission and concept communication. The process we took was unique because of the short timeline and our reliance on online collaboration tools. The project is highly technical, and we wanted to make sure the concept landed with audiences of varying technical aptitudes. To understand and communicate the technical side of the project, we used Invision Freehand to diagram the concept and storyboard the video.

Sketch: Fognet Model

I created a series of 3D animations to help visualize the concept and shared these digitally with my collaborator, Evan Feenstra.

Sketch: Fognet Storyboard

The final video is relatively rough. We recorded it mostly in one take. But I feel it still does a good job of first demonstrating the product and then outlining our vision for the technology.

Step 2: Website

After winning the IOTA Flash Channel Hackathon, I designed and created a website to celebrate the project’s success push the project forward. I sought to achieve a futuristic aesthetic that was visually similar to the IOTA Foundation: dark backgrounds with teal and purple gradients. I worked closely with Evan to write clear copy that was faithful to the technical achievement of the project but that would be understandable to an audience not immediately familiar with IOTA.

I quickly created an inspiration board and static mockup in Figma — an online collaborative design tool. This allowed Evan and I to work closely together to develop the style and tone.

Mockup: Fognet Website

After creating the static mockup, I moved to Webflow and created the website and scroll interactions.

Full Website

3D Animation

Conclusion

I feel this project was successful for a couple of reasons. We won IOTA sponsored hackathon and received solid feedback from one of the founders of the cryptocurrency. Also, we were able to communicate a highly technical concept to the lay person through quality design and animation — all in a short timeframe of around three weeks. This project is in it’s early stages, and I’m excited to see where it goes.

Press: Fognet

Press: Fognet

Work

Data Exploration

web app supporting exploration and comparison

Fun