The Evolution of Web Design

The world of web design has come a long way since the days of Microsoft FrontPage in the late 1990s and early 2000s. Phil, a veteran designer with nearly two decades of experience, shared his journey from those early days to his current work in Web3 design on the Solfate Podcast. His story reflects the rapid evolution of digital design, from simple HTML websites to complex decentralized applications.

Phil's Design Journey

Phil's design career began in high school with Microsoft FrontPage, a now-defunct website builder. He continued to develop his skills in college, designing T-shirts and websites for bands. This hands-on experience led him to his first professional role as a creative director at a screen print shop at the age of 20 or 21.

After a period of freelancing and personal growth, Phil focused on product design in 2015. He worked at a software consultancy as the sole designer among developers, which provided valuable insights into the developer mindset and the importance of designing within technical constraints.

The Transition to Web3 Design

In 2021, Phil entered the Web3 space during a significant bull run for Solana. He noticed a gap in the market for quality design in blockchain applications:

"At that time, they were all so bad. And there weren't really many designers doing anything in Web3 yet. Really cause adoption rate was just, it was still early, you know, and adoption of everything, especially Solana was really just gaining like a lot of popularity."

This observation led Phil to focus on designing applications in the Web3 space, particularly on the Solana blockchain.

The Importance of Design in Web3

As the Web3 space continues to grow, the importance of good design becomes increasingly apparent. Phil emphasized that while the underlying technology is crucial, the user interface and experience can make or break an application's adoption and success.

"I've been happy to see the applications have gotten much better in the last year or so," Phil noted, highlighting the progress made in Web3 design. However, he also pointed out that there's still significant room for improvement, especially in areas like user onboarding and accessibility.

UI vs UX in Web3 Design

Phil made an important distinction between UI (User Interface) and UX (User Experience) design in the context of Web3 applications. He compared UX to the blueprint of a house:

"When it comes to like actual like product design, you're building web applications or mobile applications, the UX is kind of like, think about a blueprint of a house. Before you build the house, you want the blueprint mapped out, right?"

This analogy underscores the importance of planning the user experience before focusing on the visual aspects of the interface. In Web3 applications, this planning is crucial due to the unique challenges posed by blockchain technology, such as wallet interactions and transaction signing.

Unique Challenges in Web3 Design

Designing for Web3 presents unique challenges that don't exist in traditional Web2 applications. Phil highlighted some of these:

1. Wallet interactions: Users need to connect and interact with their crypto wallets, which can be a jarring experience for newcomers.
2. Transaction signing: Users must approve transactions, which can disrupt the flow of using an application.
3. Irreversibility: Unlike Web2 applications, many actions in Web3 are irreversible, adding a layer of complexity to the user experience.
4. Learning curve: Many users are unfamiliar with blockchain concepts, requiring designers to educate as well as guide.

Improving Web3 User Experience

To address these challenges, Phil suggested several approaches:

1. Thoughtful onboarding: Carefully guide new users through the unique aspects of Web3 applications.
2. Clear communication: Explain complex concepts in simple terms and provide context for actions.
3. Consistent design patterns: Develop and use consistent design patterns across the Web3 space to create familiarity.
4. Progressive disclosure: Introduce complex features gradually as users become more comfortable with the application.

The Role of Designers in Web3 Projects

Phil emphasized the importance of involving designers early in Web3 projects. He suggested that startups should consider hiring a designer on a contract basis to help cast a vision for the product:

"I would say hire one as a contractor to cast vision for what you want to build. If you can hire a designer that can get your thoughts into a designer's head around what the vision is for what you're going to build."

This approach can help developers understand what they're building and provide valuable visual assets for pitching to investors or attracting early users.

Accessibility in Web3 Design

One area where Phil sees significant room for improvement in Web3 design is accessibility. He pointed out that many applications, especially those with dark UI themes, often fail to consider contrast ratios and readability:

"Accessibility, I find, a lot of times, is just not considered at all. So when I say accessibility, mainly around color. And in Web3, you see a lot of dark UIs. So it's a contrast thing."

Phil recommended using contrast checkers and following Web Content Accessibility Guidelines (WCAG) to ensure that applications are usable by people with various visual impairments.

Typography in Web3 Applications

Another aspect of design that Phil highlighted was typography. He advised developers and designers to be mindful of type hierarchy and to limit the number of type styles used in an application:

"You should shoot to use as few type styles as you possibly can. For me, I try to have a body small-- I have kind of like my starter kit of type. And then I'll kind of adjust as an application might need it."

This approach not only creates a more cohesive design but also makes development more straightforward, as fewer CSS classes need to be created and maintained.

Color Usage in Web3 Applications

Phil advocated for intentional use of color in Web3 applications. He suggested starting with a neutral palette and introducing color only when it serves a specific purpose:

"I try to strip everything down to neutrals. Like it's like some variant of like black to white, right? For most everything in the application. And then I inject color only when it's going to like actually add to the UI's like functionality, not necessarily just for the sake of like, oh, I got some-- I got a few different colors in there just because it looks nice."

This approach ensures that color is used effectively to guide user attention and improve the overall user experience.

The Importance of User Testing

Phil emphasized the value of user testing, even on a small scale. He referenced Jake Knapp's book on the Google Sprint process, which suggests that testing with just five users can uncover 80% to 90% of usability issues:

"If you can get five people to test your application, you get five user tests. I get five friends to test your application. You're going to get like 80% or 90% of the feedback that you need to make it better."

This advice is particularly relevant for Web3 projects, where user behaviors and expectations may differ significantly from traditional web applications.

Collaboration Between Designers and Developers

One of the key themes that emerged from the discussion was the importance of collaboration between designers and developers. Phil shared his experience working as the sole designer in a team of developers, which taught him the value of understanding technical constraints and fostering mutual respect:

"It's good for designers to push developers to do stuff they're uncomfortable with and to find ways around traditional ways of developing things. And it's good for designers to put constraints-- or for developers to put constraints on designers to kind of like dampen a little bit of like, do whatever you want."

This collaborative approach can lead to more innovative and feasible solutions in Web3 applications.

The Future of Web3 Design

As the Web3 space continues to evolve, Phil sees an opportunity for designers to push the boundaries of user experience. He suggested that future discussions could involve analyzing existing applications and proposing innovative design solutions:

"Maybe we could do that here, right? Maybe we can go through a couple of applications and throw out some wild ideas for how we could sort of push the boundaries of crypto user experience."

This forward-thinking approach could help drive the adoption of blockchain technology by making it more accessible and user-friendly to a broader audience.

Designing for Different User Types

Phil touched on the importance of designing for different types of users in the Web3 space. From experienced crypto enthusiasts to complete newcomers, applications need to cater to a wide range of user knowledge and expectations:

"You're either gonna have an audience that really, really knows what's going on in like the general web three space and they're used to these new interaction flows, the wallet pop up, click a couple of extra buttons. But then on the flip side, especially when there's like a bull market going on, there's a lot of traction in blockchain tech in general, you're gonna have all those newer people that are gonna come in and they're discovering this new flow for the first time ever."

This diversity in the user base presents both challenges and opportunities for designers to create interfaces that are intuitive for newcomers while still efficient for experienced users.

The Role of Education in Web3 Design

Education plays a crucial role in Web3 design, perhaps more so than in traditional web applications. Phil highlighted the need for designers to incorporate educational elements into their interfaces:

"I feel like you're really huge. And a lot of these applications, I haven't seen really target that yet, which is kind of normal, I feel like. You get an application that works, it works well, the UI looks good. People can use it really well. Then I feel like you'll start getting this wave of like people that educate you the first time you get into something."

This suggests that successful Web3 applications will not only provide functionality but also guide users in understanding the underlying concepts and implications of their actions.

The Impact of Design on Adoption

Throughout the discussion, it became clear that design plays a critical role in the adoption of Web3 technologies. Phil argued that good design can make complex blockchain interactions more approachable and less intimidating for new users:

"Having like beautiful design work and all that, you're going to get a lot more subscribers if the thing looks nice. It looks easy to use. I mean, more so than if you just had a description of what it is and like a single screenshot, like if you actually were able to cast some vision even for potential users and start getting signups, like that's extremely valuable, right?"

This perspective highlights the potential for design to act as a bridge between innovative blockchain technology and mainstream users.

The Economics of Web3 Design

Phil provided some insights into the economics of hiring designers for Web3 projects. He suggested that hourly rates could range from $50 to $150 or more, depending on the designer's experience and the project's complexity. However, he also noted that many designers prefer project-based pricing:

"Nobody likes to just sit there and run a clock. At least I haven't met anybody that loves having a clock running. And then I got a positive to go eat lunch or go to the bathroom. It's just like nobody wants to have a clock running."

This information can be valuable for Web3 startups looking to budget for design work and understand the typical engagement models with designers.

The Importance of Prototyping in Web3 Design

Phil emphasized the value of prototyping in the Web3 design process. He explained that modern prototyping tools allow designers to create highly realistic mock-ups of applications:

"There's plenty of prototyping tools, natively and Figma, we'd prototype all the time. You can make an application feel pretty dang real, just prototyping it. Especially if you're the one walking through it and everything you're clicking works, the whole thing feels like a functioning application."

This approach can be particularly useful in the Web3 space, where complex interactions and novel concepts may be difficult to communicate without a visual representation.

The Evolution of Web3 Design Standards

As the Web3 space matures, Phil noted that design standards are beginning to emerge. However, he also pointed out that there's still significant room for innovation:

"Designers have definitely started to come in and notice there's a ton of low hanging fruit here. Like let's clean up some of this stuff."

This suggests that while some best practices are being established, the field is still open for creative solutions to unique Web3 challenges.

The Role of Branding in Web3 Projects

While the discussion focused primarily on product design, Phil also touched on the importance of branding in Web3 projects. He explained that branding goes beyond just logos and colors:

"That's logos. That's your kind of deciding on a type, a typography that you're gonna use, your colors, all that kind of stuff. That's like your branding. There's a ton more to that. Obviously tone of voice. There's a lot in that category."

For Web3 projects, effective branding can help establish trust and credibility in a space where these qualities are crucial.

The Intersection of Design and Financial Literacy

An interesting point that emerged from the discussion was the intersection of design and financial literacy in the Web3 space. Phil noted that many users entering the crypto space may lack financial knowledge:

"You have a lot of people that are not educated financially to get in and use a lot of DeFi applications in hope of making money, right? But they're also not like financially, like me. They're not really financially like investor literate, right?"

This observation suggests that designers in the Web3 space have an additional responsibility to create interfaces that not only facilitate transactions but also educate users about the financial implications of their actions.

The Potential of Web3 Design to Drive Adoption

Throughout the conversation, it became clear that thoughtful design has the potential to drive wider adoption of Web3 technologies. Phil suggested that by addressing usability issues and creating intuitive interfaces, designers can help bridge the gap between blockchain technology and mainstream users:

"I think that we're kind of hitting up against time here. So I won't ask the question that I wanted to ask, what are tips you have for developers to work better with designers?"

This highlights the ongoing need for collaboration between designers and developers to create Web3 applications that are both technologically sound and user-friendly.

The Future of Web3 Design

As the podcast concluded, Phil hinted at future developments in the Web3 design space:

"I do have some fun, maybe potentially news coming out soon, working on some business things, some little venture things that might come out soon. So if you need-- Design work for an application. There might be some options. I would love to work with you. So there might be some options for that."

This suggests that the field of Web3 design is not only growing but also evolving to meet the specific needs of blockchain-based applications.

In conclusion, the conversation with Phil provided valuable insights into the current state and future direction of Web3 design. As the blockchain space continues to mature, the role of designers in creating accessible, intuitive, and engaging interfaces will be crucial in driving mainstream adoption of this transformative technology.

Facts + Figures

• Phil has nearly two decades of experience in design, starting with Microsoft FrontPage in the late 1990s/early 2000s.

• Phil became a creative director at a screen print shop at age 20 or 21.

• Phil focused exclusively on product design work starting in 2015.

• Phil entered the Web3 space in fall 2021 during a significant Solana bull run.

• Web3 application design has improved significantly over the past year according to Phil.

• Phil suggests hiring designers on a contract basis initially for startups, with rates ranging from $50-$150+ per hour.

• Testing an application with just 5 users can uncover 80-90% of usability issues according to Jake Knapp's Google Sprint process.

• Phil recommends using as few type styles as possible in application design, suggesting 4 main styles.

• Dark UI themes are common in Web3 applications but often have accessibility issues with contrast.

• Phil entered crypto investing in 2021, buying Solana at $250.

• Unfold, Phil's previous employer, did work for Solana in fall 2020 when SOL was around $3.

• Phil suggests Web3 applications focus more on educating first-time users.

• Designing for Web3 presents unique challenges like wallet interactions and irreversible transactions.

• Phil emphasizes the importance of intentional color usage in application design.

• Collaboration between designers and developers is crucial for creating successful Web3 applications.

Questions Answered

What is the difference between UI and UX in Web3 design?

UI (User Interface) refers to the visual elements and aesthetics of an application, while UX (User Experience) is about how the application functions and feels to use. In Web3 design, UX is particularly important as it deals with unique challenges like wallet interactions and transaction signing. Phil compares UX to a blueprint of a house, emphasizing the need to plan the user experience before focusing on visual design.

How has Web3 application design improved over the past year?

According to Phil, Web3 application design has significantly improved over the past year. Designers have started to address the "low hanging fruit" in terms of usability and aesthetics. There's been more consideration for user experience, clearer interfaces, and better integration of blockchain-specific features. However, there's still room for improvement, especially in areas like user onboarding and accessibility.

What are some unique challenges in designing for Web3?

Designing for Web3 presents several unique challenges. These include integrating wallet interactions, which can be jarring for new users; handling transaction signing, which can disrupt the user flow; dealing with the irrevers ibility of many blockchain actions; and addressing the steep learning curve for users unfamiliar with blockchain concepts. Designers need to create interfaces that make these complex processes intuitive and less intimidating for users.

How important is accessibility in Web3 design?

Accessibility is crucial in Web3 design but is often overlooked, according to Phil. Many Web3 applications, especially those with dark UI themes, fail to consider contrast ratios and readability. Phil recommends using contrast checkers and following Web Content Accessibility Guidelines (WCAG) to ensure applications are usable by people with various visual impairments. Improving accessibility can significantly enhance the user experience and broaden the potential user base of Web3 applications.

What role does education play in Web3 design?

Education plays a significant role in Web3 design. Many users entering the space lack knowledge about blockchain technology and financial concepts. Designers need to incorporate educational elements into their interfaces, guiding users through complex processes and explaining the implications of their actions. This educational aspect is crucial for improving user confidence and promoting responsible use of Web3 applications.

How can startups approach hiring designers for Web3 projects?

Phil recommends that startups consider hiring designers on a contract basis initially. This allows them to cast a vision for the product and create prototypes that can be used to attract investors or early users. Hourly rates for designers can range from $50 to $150+, depending on experience. However, many designers prefer project-based pricing. As the project progresses, startups can consider bringing on full-time designers if budget allows.

What is the importance of prototyping in Web3 design?

Prototyping is crucial in Web3 design. Modern tools like Figma allow designers to create highly realistic mock-ups of applications, including interactive elements. This is particularly valuable in the Web3 space, where complex interactions and novel concepts may be difficult to communicate without a visual representation. Prototypes can help developers understand what they're building and provide valuable assets for pitching to investors or attracting early users.

How can designers and developers collaborate effectively in Web3 projects?

Effective collaboration between designers and developers is key to successful Web3 projects. Designers should understand technical constraints and be open to feedback, while developers should respect the design process and be willing to explore new solutions. Phil emphasizes the importance of mutual respect and understanding that both roles are essential for creating a great product. Regular communication and a willingness to challenge each other can lead to more innovative and feasible solutions.

How does Web3 design differ from traditional web design?

While many design principles remain the same, Web3 design presents unique challenges. These include integrating wallet functionality, handling blockchain transactions, and educating users about complex concepts. The irreversibility of many actions in Web3 also requires careful consideration in the design process. However, the fundamental goals of creating intuitive, accessible, and engaging interfaces remain the same as in traditional web design.

What is the future of Web3 design?

The future of Web3 design looks promising, with opportunities to push the boundaries of user experience. As the space matures, design standards are emerging, but there's still significant room for innovation. Phil suggests that future developments could involve analyzing existing applications and proposing innovative design solutions to make blockchain technology more accessible and user-friendly. The role of designers in creating intuitive interfaces will be crucial in driving mainstream adoption of Web3 technologies.