Storage proofs provide smart contracts with synchronous access to current, historical, and cross-chain data across Ethereum layers.
A storage proof defined by Herodotus merges inclusion proofs, which confirm data's presence, and proofs of computation which validate the execution of a multi-step workflow to attest the validity of one or multiple elements in a large dataset such as the whole Ethereum blockchain or a rollup.
2
Custom React UI libraries
3
Products shipped
38
Custom components
Project Outcomes
New Home Page
When I joined the project, my first task was to rapidly redesign the existing home page, which was only a temporary placeholder and needed an urgent replacement. To expedite the process, we opted for a popular industry solution - Framer. Framer enabled me to design and deploy the new home page immediately, bypassing the coding phase and significantly reducing the time required for delivery.
Old home page
To infuse energy, movement, and uniqueness into the home page, I decided to use Spline, a 3D design software that facilitates real-time collaboration for creating interactive web experiences directly in the browser. The collaborative nature of Spline allowed us to work seamlessly with our in-house illustrator, who provided a custom 3D model of a satellite.
3D scene done using Spline, new home page header
Interactive card elements on new home page
HUI - Herodotus UI
I created a completely new design system from scratch, which served as the foundation for every new UI product planned at Herodotus. I first developed thoughtful components in Figma, which were then precisely matched to a custom React library I built, ensuring a seamless 1:1 relationship between the design and the code.
After a few weeks of work, I presented the new UI library, HUI. This library includes 38 custom UI components built using Radix primitives and styled with Tailwind CSS. Additionally, I created custom React hooks and a utility library for various data modifications, ensuring a robust and flexible design system.
React based HUI library structure
1:1 code alignment with Figma
Dashboard and Explorer
After designing and developing HUI, I began creating and implementing the first web products for Herodotus. The Dashboard is the first destination for new users arriving from the home page. It serves as a central hub for accessing all external and internal links related to Herodotus web products. Additionally, the Dashboard provides users with the ability to copy their API key, which is essential for accessing Herodotus's developer tools and services. Explorer is designed to facilitate the search for the latest batch queries, functioning similarly to Etherscan.
App thumbnails
Turborepo
Turborepo is a next-generation toolchain for frontend development that enables the use of a monorepo, allowing all related projects to be managed in one place for better visibility. This architecture was crucial for synchronizing all new web products with my UI library without needing to deploy changes to npm each time, significantly increasing development speed.
"
Adam's UX design expertise made a significant impact on our project. His deep understanding of user experience principles and ability to deliver high-quality designs enhanced our product's usability. His work ensured our interfaces were both intuitive and visually appealing. Additionally, Adam has solid foundations for building web3 applications, which greatly contributed to the speed of delivery of our project. I highly recommend him for any UI/UX and design engineering roles.
