Role
UX Design, Prototyping, Client Presentation, Visual Design Review
Timeline
6-8 weeks
Team
20Mint Editorial Team, Head of Design, Senior UX Designer, Visual Designer, NFT Art Designer
Tools
Figma, Miro, Slack
The Problem
Design Challenge
How can we create an engaging Web3 platform for 20 Mint that balances exclusivity with community spirit while honoring its legacy as part of 20 Minutes France?
The Solution
Our approach to addressing these challenges was holistic and user-centric:
Web3 Community Platform: We designed a bespoke web platform, 20 Mint, that serves as a digital extension of 20 Minutes. This platform integrates Web3 features while maintaining the trusted voice of the parent brand.
Exclusive NFT Collection: We created a limited series of 999 unique typewriter-themed NFTs, paying homage to journalistic tradition while embracing blockchain technology. These NFTs serve as keys to exclusive content and community features.
Tiered Access System: We implemented a system where NFT holders gain access to premium features, polls, and content, while still providing value to non-NFT holders. This creates a sense of exclusivity without completely gating off the platform.
Intuitive User Interface: Our design team crafted an interface that gently introduces Web3 concepts, making the platform accessible to both crypto-natives and newcomers.
Community Engagement Tools: We integrated features like community polls, content submission portals, and discussion forums to foster active participation and a sense of ownership among users.
Adaptive Brand Identity: We evolved the 20 Minutes visual identity to create a distinct yet familiar aesthetic for 20 Mint, appealing to a Web3 audience while maintaining brand recognition.
By addressing each aspect of the problem with targeted, innovative solutions, we created a platform that not only meets the current needs of 20 Minutes but also positions it at the forefront of media evolution in the Web3 era. This solution demonstrates how traditional media can embrace new technologies to enhance engagement, build community, and create new value streams while staying true to their core mission of informing and connecting people.
Walkthrough of the Developed Web Platform
Phase 1: Understanding the Brand
What is 20 Mint, and how does it fit into the 20 Minutes ecosystem?
20 Mint is a digital and Web3 extension of 20 Minutes, a renowned French media company with a rich print and online legacy. With millions of online followers, 20 Minutes is more than a newspaper – it's a cultural institution in France.
Our task was to build an exclusive community for holders of 20 Mint's 999 NFTs while maintaining an open community feel. This required balancing traditional media values with modern Web3 principles through thoughtful design iterations.
Phase 2: Research and Requirements Gathering
How do we align Web3 innovation with 20 Minutes' established brand?
Moodboard and Brand Vision
We created a moodboard that captured the essence of 20 Minutes' cultural significance while envisioning its Web3 future. This visual guide helped bridge the gap between the familiar sight of 20 Minutes newspapers in Parisian subways and the cutting-edge world of NFTs.
Product Specifications
Key features identified included:
Poll presentation for current and previous community votes
Seamless integration of OpenSea-hosted typewriter NFTs
MetaMask wallet connection for access control
Exclusive content for NFT holders, using blurred previews for non-members
Phase 3: Design Process
How do we design a platform that balances NFT utility and user engagement?
Iterative Design Approach
Sketching and Wireframing:
Initial designs were created and presented to the head of design and editorial team.
Weekly Design Workshops:
Community-building features like polls and surveys were introduced and refined based on feedback.
Visual Design:
We departed from the traditional newspaper aesthetic to create a distinct Web3 experience while maintaining brand coherence.
User Flow Development
Wireframing
Based on the feature requirements and brand guidelines built thus far, wireframes of the entire user journey were created to help envision the lo-fi version of our web community platform.
Prototyping and Testing
Content Exclusivity for Members
Phase 4: NFT Launch and Platform Rollout
How do we leverage the NFT launch to build community excitement?
Successful NFT Collection Launch
During the NFT drop day, 20 Mint launched on Twitter/X to its community. It turned out to be wildly successful as it sold the entire collection of 999 mints in less than 16 hours. The general theme of the NFT was a typewriter with different unique features incorporated by the NFT art designer for each NFT to be unique in the marketplace.
Community Onboarding
Phase 5: Visual Identity and Design System
How do we evolve 20 Minutes' brand for the Web3 era?
Style Guide Development
We created a modern, Web3-inspired visual identity that evolved from 20 Minutes France's established brand, appealing to the Web3 user archetype while maintaining brand recognition.
Reflection
The 20 Mint project successfully blended 20 Minutes' rich media heritage with cutting-edge Web3 technology. By creating an exclusive yet open community platform, we've set the stage for 20 Mint to lead in the evolving landscape of digital media and blockchain technology.Key achievements:
Successful NFT launch with rapid sell-out
Seamless integration of Web3 features with traditional media values
Creation of a distinct visual identity that honors the parent brand
Development of an engaging community platform for NFT holders
This project demonstrates the potential for established media brands to innovate in the Web3 space while maintaining their core identity and audience connection.