Dash Landing Page
New Merchant Kit Landing Page
My Role
Solo Designer – Dash Core Group (DCG) hired me as a contractor so I did a lot of solo work. I did utilize DCG employees for expertise and feedback as we moved through the project. My work included many phases: Research, ideation, mockup creation and iteration, building the page in WordPress, coding in PHP, HTML & CSS, and testing.
Team
1 Designer – Me!
2 Marketing Coordinators – Chris, Arden
1 Head of Product – Brian
1 Infrastructure Engineer – Leon
Tools
- Figma – Research, Ideation, Mockup
- VS Code – Customizing theme (PHP)
- Illustrator – Graphics/SVG’s for visuals, designing coin, sticker designs
- InDesign – Created promotional materials that users can download and print
- Photoshop – Optimizing/compressing images for web, coin mockups
- WordPress – Built out landing page
- Chrome Developer Tools – Landing page development & testing
- Github – Pull requests from my branches to Dashpay’s custom theme repository so they could be merged to the live site.
The Problem
One of Dash’s main goals as an organization is to make crypto spendable like US dollar currency. This overarching goal is evident in their brand tagline: “Dash – Digital Cash.” With the development of the DashDirect App, dash crypto owners can use their cryptocurrency to make purchases at over 155,000 merchants and counting with a few taps on their mobile phone. However, even without the DashDirect app, the process of accepting Dash for payments is incredibly easy for a merchant. It only takes a few minutes! This is not widely known. Most assume to begin accepting cryptocurrency payments would be a scary and intense process that requires a lot of cryptocurrency expertise.
Our problem statement had two parts: How might we communicate the benefits of crypto and how easy the process is to become a new merchant? And how might we incentivize them to begin accepting Dash payments?
My additional problem statement: How might I create an easy to navigate and effective layout that doesn’t overwhelm the user?
Constraints
Budget: As we embarked on this project, the cryptocurrency industry took a turn for the worse (summer 2022) so budget was a pain point we had to work around.
Time Frame: I was given two months to complete the project, working part time (about 10 hours per week).
The Plan
It was decided that we’d utilize real-estate on the Dash.org website and create an informational landing page experience for merchants. While it only takes a few minutes to become a new Dash merchant, we wanted to provide enough information that merchants would feel confident in the process. The amount of content I was given to work with was a challenge. This is the largest landing page I’ve ever built. 🙂
Dash had the goal to create an easy to follow new merchant guide, with a reward for new merchants, to try to increase awareness and the number of merchants who accept Dash for everyday purchases. We wanted to let merchants know how easy it is to accept Dash, and walk them through the steps in a few different ways: through a landing page, a printable PDF, a printable booklet & brochure (great for conferences and trade shows)!
My Design Process
1. Strategize/Ideate
2. Prototype
3. Build
4. Feedback/Test
5. Reiterate
Challenges
Content Galore: While the process for setting up crypto is simple, we wanted to ensure that we included all information necessary to guide the merchant through setup while also giving them tips and tool recommendations. This created a page with a large amount of scroll.
WordPress Theme Capabilities: Dash has a custom theme, however some of the styles/layouts I designed in my prototype were not possible with the custom theme’s functionality and Dash’s strict separation of content and style guidelines.
Page Load Time: While the page had a lot of content and a lot of scroll, I wanted to keep the design engaging without adding so many visuals that it slowed down page load time.
Solutions
Simple & Easy UX: I kept the layout clean and clear of clutter and included a on page navigation section at the top of the page that links to different sections of the page. This allows users to pick the section they want and jump to it to reduce unnecessary scroll. If I’d had more time, I’d have added a back to top button.
Custom PHP & CSS: I ended up going into the theme files and adding PHP to the code that allowed me to create full width background images, multi-column layouts, drop shadows, etc.
Simple web optimized Images: All images used were optimized for web and I used vector scalable graphics as often as possible. I also utilized CSS as much as possible to add styling without extra bulk.
Impact
This was the last project I worked on before my contract ended with Dash. I reached out to my contacts at DCG 8 months post completion for stats to measure the impact of our campaign. Unfortunately, it seems the website analytics were not set up properly, so I was unable to retrieve traffic information. However, they did send me the following graphs to show that merchant numbers have increased with direct correlation to our project.
