Knight-Georgetown Institute
Building a boldly simple brand and website for a new organization that connects technology and information.
Work
A central element of the rebrand crafted by Omidyar’s brand designers, 20-something, was to visually emphasize the crucial connection between people and technology. They created a pattern generator as part of the brand process, and we worked closely with them to incorporate that pattern generator into the experience of the website.
This translated into special features for big brand moments and key website interactions. We replicated the pattern engine and isometric grid, ensuring it could be applied to photography and essential content, and influenced by users without disrupting the user experience.
In addition to key user interaction moments, Teal built a flexible and scalable design system that allows the Omidyar publishing team to scale with the changing times. Some of the components in this design system include a robust report builder and pattern generator built right into the CMS.
The report builder transforms Omidyar’s in-depth PDF reports into prominent, easy-to-digest site content. The comprehensive components we designed and built offer the Omidyar team the flexibility they need to construct sections, slideshows, and compelling narratives that effectively communicate their mission. And for those who still want to access the full report, we continue to offer the option for users to download traditional PDFs.
Every Teal team member whom we worked with has shown us that they are not only experts at what they do—from design to web development to SEO—but also able to lead, partner, and teach at every step of the way... we especially appreciate that Teal prioritizes accessibility, privacy, and security. With Teal’s support, we launched a new website that creatively expresses our visual identity, clearly represents our mission and values, and helps us stay agile amid changes to digital trends and algorithms.
A highlight of this project is Teal’s development team’s innovative approach to integrating an animated pattern generator directly into the site. Unlike traditional methods that rely on movies or animated Lottie files, we worked hard to create a solution that renders precise band patterns. This allows for diverse variations, scales, and grids to be achieved through simple code modifications.
Omidyar was one of those rare projects where we got to stretch what’s possible and push the boundaries of what we normally do. Experimenting with GLPL and Three.js to create interactive fragments reignited my love for front-end craft. It reminded me how powerful our dev team can be when we have the space to explore alongside clients who are open
Building a boldly simple brand and website for a new organization that connects technology and information.
The part where we ask you to cough up your email. So we can discuss all the amazing things we’re gonna do together. No pressure. Really.