The Block is an information services company for those who invest in, make decisions about, or seek to understand digital assets. The Block's primary product is a news website, reporting on current events affecting the cryptocurrency space. Additionally they provide data, analytics, and research directly to other financial institutions through their B2B platform, The Block Pro.
My Role
I was recruited by Jake McGraw, one of the original co-founders of The Block, to join as the company was just getting started. Jake was familiar with my bold design work that brought the Refinery29 brand to recognition, and was looking to bring some of the same visual design approach to The Block. I led the design and user experience of the news site and prototyped new products that The Block delivered to the cryptocurrency space through special projects.
Visual Identity Updates
One of my first projects was to establish the design of a new subscription product that visually separated it from the already established Research content named "The Block Genesis." This product was named "The Block Daily" and consisted of one exclusive in-depth news story per day—much like a substack account focused on crypto journalism.
I created a variation of The Block logo that fit in line with the existing brand system. I also was responsible for designing marketing collateral to announce the new subscription product. I commissioned an animation shop that I've worked with in the past, Hungry Sandwich Club, to produce a trailer for paid ads. I provided the overall design direction and storyboarding for the ads.
Increasing Product Clarity
As traffic to The Block began to grow, we were not seeing similar growth to paid subscriptions of The Block Genesis. There were, however, a lot of inbound requests for bespoke research projects coming from major institutional financial organizations. It was apparent there was a disconnect between what The Block Genesis was offering and what this demographic of potential customers were looking for.
After listening to feedback from prospective customers (major financial organizations), I made a proposal to leadership to make a few updates to The Block Genesis product. First, I proposed to rename "The Block Genesis" to "The Block Research". The previous branding focused too much on the word "Genesis" which obfuscated the value proposition of the content that was published under that moniker. It really is Research content and we needed to be as obvious as possible to users about what was being delivered.
Second, I proposed a more aggressive reskin of The Block Research content. The existing differentiation was just a subtle color change and did not set it apart from The Block's free content. It was not visually clear why users should pay for this content when they get the news content for free.
I executed updates to our existing template to really differentiate The Block Research from the main site, so it felt like users were entering a totally new product. Additionally I aligned the look and feel to designs institutional financial executives were more familiar with, using a "Research Paper" aesthetic.
Transitioning to B2B Positioning
As interest for The Block Research grew, we noticed that global and federal financial institutions were among our subscribers. We saw opportunities to expand through multi-seat accounts and to provide more features within the platform to justify a price more aligned with similar products in the space.
We decided to bifurcate The Block Research from the main free website and invest in building a separate platform. To motivate users to create individual accounts within organizations, we prioritized account personalization and robust search functionality, providing value beyond just written content.
Building a Design System
By this time I was also able to hire an Art Director, so I set up some initial hi-fidelity wireframes to communicate the experience and allowed my Art Director to execute on the UI elements of the design. After several cycles of design feedback in Figma, I then dissected the UI into a usable design system of repeatable components.
High-Fidelity Prototyping
To demonstrate the system and how it would be responsive for mobile, I coded up a live working HTML/CSS prototype to share with the Engineering team. We worked through many development questions through the prototype before we began sprints to the final execution. Much of the front-end code from my prototype translated one-to-one directly to Vue components with Storybook integration in the final end product.
Brand Differentiation
Timely, free news on current cryptocurrency events served as top-funnel marketing for our subscription offering. However, this was a crowded and competitive space.
To build a more recognizable brand and create familiarity, I took a heavy-handed approach with the imagery for free news articles—this was a major part of the success I saw at Refinery29.
Bold opening images drove higher click-through rates to articles, distinguishing The Block from other sites reporting on the same stories. I implemented firm design guidelines to support the differentiation of The Block articles: no raw stock photography (every image must be touched up with some design element to it), and never use the stereotypical Bitcoin coin image in any form, whatsoever. This developed brand trust and recognition for The Block reporting. Readership rapidly grew throughout my time at The Block.
Building a Graphic Library
We focused on designing vibrant attention-grabbing imagery for our main categories of free content that can be reused from article-to-article. I hired an Art Director to set the overall tone of the images. I also designed many graphics myself. Once in a while we would also commission artists to design images for more evergreen subjects like Ethereum and Bitcoin.
Increasing Site Referral Traffic
When Coinbase began to incorporate news feeds for protocol price pages within their mobile app, their editor specifically mentioned to us that they liked to feature our articles because of our article images. At one point Coinbase contributed to driving over 60% of site traffic.
For breaking news stories I experimented with animated opening images using After Effects to leverage a new "Fleets" feature on Twitter, where our primary traffic was coming from, that mimicked the very popular Reels function in Instagram.
Scaling On-Brand Image Creation
During an internal hackathon in 2022, I developed an image generator that could allow one of The Block's editors to quickly spin up an opening image without needing to use design bandwidth. This was especially useful during off-hours or during rapidly developing breaking news events. The tool would pull from a preloaded database of licensed stock photos and randomly combine the images based on the user’s selections to generate a unique image. As more images were loaded into the database for each category and subject, the tool would yield greater permutations for unique outputs.
Bespoke Landing Pages
With the goal of exploring growth marketing opportunities outside of The Block's core News and Research Platforms, we began experimenting with landing pages. I collaborated with Engineering leadership to set up a separate static website bucket that was not tied to the main codebase.
Through a partnership with eToro, we ran a campaign to offer a year of The Block for users who set up an eToro account. I designed and built this landing page to facilitate the campaign.
Leveraging a Trend
As Year in Review pages became on trend, we experimented with one of our own. I partnered with a Research Analyst to write and develop an interactive landing page highlighting the top 10 developments in cryptocurrencies in 2020. I asked our Art Director to create the stylistic treatment of the page and I developed the page with interactive components. The web experience was fully responsive and worked on both desktop and mobile.
Event Content Production
As part of my involvement with Special Projects, I was responsible for the design of collateral related to events. This included creating event posters, event signage, and also building event websites for sign-ups.
Additionally I captured audio, video, and photo throughout each event to repurpose for social content, news articles, and even podcasts.
Rapid Prototyping
I build high-fidelity, low-resource, rapid prototypes to test hypotheses. My role as Head of Special Projects included prototyping and evaluating new product ideas. Through these prototypes I can quickly identify what innovative projects are worth pursuing, while developing a roster of tangible ideas to present to the board and potential investors.
The Block Explorer was a project that I prototyped in late 2019. The Block's advantage in the cryptocurrency space was being able to uncover connections between people, projects, and companies to determine their legitimacy. The overall idea was to create a portal that could allow users to explore any entity type and follow their web of connections.
I solicited the help of a Research Analyst to help me collect data on companies that no other competing platforms were currently providing. We started with companies that didn’t require rigorous investigation and resources, such as Coinbase and even our own organization, The Block. We found that collecting meaningful data points beyond existing search engine results would take a lot of analyst and researcher effort per company, so we shelved the project.
However, this prototype allowed us to discover elements that later became features within The Block Pro.
Another project that I had prototyped was a crypto product comparison tool. This product would allow users to see many different crypto products under a specific category and help them make a purchasing decision based on a variety of factors. Ideally the user would click through to purchase a product and The Block could get revenue from the referral. This idea was also shelved because the estimate on revenue from referrals was not as lucrative as other efforts that Engineering could spend time on.
Restructuring a Product for Scale
As The Block started to build new products such as a Data Dashboard and a Crypto Deal Tracker, there was a desire to make them separate products with separate subscriptions from the already existing Research Portal. I was instrumental in pitching the strategy of creating a parent product, called "The Block Pro", with separate sub-apps that subscribers can either add or remove depending on their needs. The Block Research Portal would be the first sub-app with the Data Dashboard, Real-Time News, and Deals App coming shortly afterwards. This new product architecture could help facilitate the long term scaling of future paid products with add-on pricing. This was inspired by the product architecture strategy employed by G-Suite and AWS, which helped make leadership more amenable to the change.
I established the foundational design system and architecture of The Block Pro, such that new product apps could easily be spun-up without requiring their own bespoke designs. They'd follow a single set of components shared between all The Block Pro applications. I tasked a Product Designer with finessing the UI of the underlying components system.