PRODUCT DESIGNER
Bridging up the road to Consensus - world's largest Crypto event with over 30k attendees.
CONSENSUS 2023 Content Promotion Module Design
An engaging promotional module that plants inside of the cryptocurrency news article, on of the most trafficked page of CoinDesk.com, to show how the content is related to opportunities to learn and engage more with Consensus 2023 content.
UX Design
UI design
Team
James Lin, Product Designer
PMs
Content(Editorial) Team
Marketing Team
Engineering Team
My contribution
UX Research
UX Design
Wireframing
Rapid Prototyping/ Iterating
KPIs
Total ticket sales driven by
- Pageviews to C'23 brochure site
- Click-thru rates
R2C content pageviews as driven by
- Organic referrals to R2C content
- Search referrals to R2C content
Meanwhile, the product team is re-branding "Layer2" to "Consensus Magazine", which also seeks same solution of CTA modules that re-direct user to the Consensus Brochure sites.
The product team is seeking a technical and product framework to dynamically presenting relevant, intelligent CTA modules in the article templates, in order to drive user engaging in consensus content. Moreover, the initial success metrics were set as increasement of ticket sales & Consensus site traffic(in priority order).
A dynamic content module designed to promote Consensus 2023 content on coindesk.com
Planning
At-a-Glance
3. Ideation
Brainstorming ideas about user engagement of C'23 based on the previous website & event experience.
Utilizing exisiting projects & components to reduce engineering costs.
1. Insights
Picturing users' reading experience & behaviors, and collaborating with editorial team to gain heuristic feedback.
Defining challenges & constraints based on the qualitative data by HotJar.
2. Research
Reviewing insights & historical UX research data, to exam and find edges of the previous design.
Performing competitive analysis of direct & in-direct competitors, to identify potential opportunities of design.
4. Design Solution
Executing ideas & draft by rapidly hi-fidelity prototyping, and validate solution with both product, content, and commercial team.
Insights
The article templates are, collectively, the most trafficked parts of our product - even more than the "price page". In August 2022, over 47% of our pageview came from article templates, while 35% came from "price pages", with only 18% made up by the rest of the pages.
Article Templates Drive Site Traffic
Insights
A majority of 56% of our audience read through our sites on mobile devices, 42% on larger screen(desktop), with surprisingly only 2% from mdium screen(tablet). Therefore, we decided going for mobile-first approach with the R2C project.
Mobile-First: Screen size matters
Research
Screen real estate is very limited on small screen sizes, which makes it a more challenging canvas to work on. Most importantly, sponsor advertisements are the top priority.
Based on user data from HotJar, a majority of our audiences do not scroll to the bottom of the articles, making it even harder to design without disrupting the reading experience while not interfering with sponsored ads.
Limited Screen Real-Estate
- Article Templates mobile screen real-estate analysis.
Design Challenge
Problem
The previous marketing promotions did not effectively cater to all types of content, resulting in low relevance and engagement towards Consensus.
The goal of the project is to discover ways of integrating sorted coindesk pages tags with the Consensus promotional modules.
Problem
User tends to ignore traditional banner style of in-house promotion.
After 1 month of releasing the banner style of in-house ticket sale promotion, the conversion was not significant enough, which was caused by user's scrolling behavior.
1. Insert between headers & body paragraph
After confirming with the marketing team, the module was planted underneath the article header to reach maximum visibility, without interferring with the sponsor ads.
Customised feature and component targeting CoinDesk audiences
2. Modular re-usuable design
Besides sololy placing the promotional module in the article, the module was also planted inside of the "Consensus Magazine" promotion, in a simplified way.
_gif.gif)
Hi-Fidelity Prototype
Building prototypes for 6 different article templates & 3 types of R2C modules
Overall, the team was committed to creating a meaningful, content-related user experience for promoting Consensus 2023 and to continue updating and creating relevant R2C content throughout the CoinDesk site.
Retrospective
Retro
Collaborating with multiple teams
The R2C project involves multiple teams, including commercial, marketing, product, and engineering. Therefore, communicating and negotiating with PMs in an agile discipline become extremely important. Managing requests from multiple stakeholders can be difficult, but it also helped clarifying the design objectives.
Retro
Quick turn-over and decision-making
Since it was a quick sprint, the timeline pushed me to make quick decision and learn how to make decision based on limited intelligence & data. Also, I was able to make many fast turn-over to keep pushing the sprint forward.
Planning
Historically, Coindesk used traditional marketing techniques across the website to target users and convert them to consensus attendees. These efforts are proven to have marginal effectiveness, and block article content readability. The product team is seeking ways to seamlessly integrate editorial content(tags such as web3, crypto prices, etc.) with Consensus on the ground experiences (such as NFT gallery, speakers & stages, etc.).
CoinDesk Articles Content v.s. On the ground Experience at Consensus
Design
- Initial wireframing for Mobile-first approach of R2C content modules.
Since the mobile screen has the most limited space, I decided to start the wireframe based on the mobile sreen resolution. Because of that, it is essential to prioritize elements inside of the module on mobile screen, while allowing more content be plugged in on larger screen size.
Wireframing: Mobile-First approach
Design
After QA of the initial wireframe & ideation, I started a rapid design workshop and make them high fidelity interactive prototype on Figma. I came up with 6 types of R2C module type(image1), to cover all the promotional content provided by PMs, and a one-layer-down page view interaction(image2), to distinguish the module from our sponsor ads.
Blending Coindesk & Consensus 2023 design system.
Ideation
CoinDesk is the industry leader for crypto news, and all the articles created by our editorial teams comes with tags, for SEO purposes. To promote Consensus in a meaningful way, we decided to utilized these tags to automate this R2C module. By mapping out the most popular tags, we narrowed down the module types to Generic, Speakers, and Experiences.
Enhance editorial input automation
Design
After pitching the initial design to both engineering team & product team, some issues were defined:
Shifting left before handing-off the final design.
- The One-Layer-Down interaction will result in way too much engineering workload.
- Due to different marketing strategy, the 6 types of content module will narrow down to 3 types, which includes: Speakers, Experiences, Generic Information(in the order of priority). This could also improve the feasibility of future automation of the Consensus promotional modules.
- Stakeholders want the design style be more consistent with CoinDesk Design System, with only a touch of Consensus 2023 style guide.
Results
Comparing to the yellow banner on the top (traditional way of advertisement), the new R2C module receive higher click-through-rate. Also, the Consensus broschure site receive significant increase of site traffic.
To generate more content related promotional module, the editorial team was able to plug-in specific content by simply providing tags for the news article. The modular design brings positive impact to the team since the automation was considered success by our stakeholders.
An increase of CTR and Consensus site traffic.
How might we ?
Build a technical & product framework for dynamically presenting relevant, intelligent, call-to-action modules in our article templates in highly visible but not disruptive ways.
Research
To understand the strength and weakness and get inspiration for the product, a competitive analysis was performed to discover the following:
- Location of promotion
- Content of promotion
- Interaction of promotion
What Where & How?
For example, if the author/ journalist put #tags of NFT inside of the article, it will be recorded and the promotional module will show on the ground experience at Consensus (in this case is the "NFT gallery" during the event).
Ideation
Establish Connection between Users, Consensus 2023, and Editorial Team.
Each R2C module should have a default CTA button leading to Consensus 2023 brochure site. To make the promotion more relevant, the module has the function to read tags added by the editorial team when publishing aritcles.
By sorting the top tags from the editorial, we prioritize 3 most relevant types of modules: Speakers, Events, Session (Multi-Media)
