Dorell Fabrics

Designing a corporate communications site to generate new leads

UX Design
UX Research
UX Strategy

Background

Dorell Fabrics is a sourcer of high-quality fabrics and textiles for a variety of industries including residential furniture manufacturers and retailers. Despite being a leader in the field for more than 80 years, they had no dedicated website or significant online presence.

They approached Brooklyn Digital Foundry to build a website that helped them rebrand and generate leads in new markets. As a UX/UI Design Intern, I collaborated with my team’s senior strategist to conduct exploratory research, brainstorm the IA, and design wireframes that would set the foundations for the final site.

Details

Client - Dorell Fabrics

Role - UX/UI Design Intern

Team - Brooklyn Digital Foundry

  • 1 Project Manager
  • 1 UX Strategist
  • 2 Visual Designers
  • 2 Developers

Timeline - March - July 2022 (4 months)

Objectives

  • Design a corporate communications website that captures Dorell’s brand and generate new leads
  • Research how to best communicate company messaging through information architecture
  • Make recommendations for how the webpage can better communicate the company's commitment to an environmental and sustainable future
  • identify areas for improvement in terms of design and messaging

Discovery

Research - Exploring the problem space

To gain insight into needs and expectations for the new site, I interviewed various members of their leadership team and conducted research into the market to understand the client’s strengths and find opportunities for impact. I synthesized key findings into an affinity diagram to identify common trends and actionable insights.

Through organizing my thoughts, I was able to acquaint myself with the problem space and narrow down the most urgent needs the company needed to focus on.

Insights

  • Getting the word out: In the past Dorell had relied on word of mouth and cold calling to show their fabric samples and bring in new accounts. However, continuing solely on this in-person business model was not entirely practical given the changing environment and expectations of remote work
  • When they had tried to reach out to contacts in new industries, people didn’t know who they were because it was difficult to find that information online. 
  • Need to have people understand breadth, scope of service and products
  • Changing audiences: Historically, Dorell pitched their business directly to executive company stakeholders, but nowadays the main contacts for sales are mid-level representatives that present their own recommendations to higher ups. 
  • These representatives have many responsibilities, and finding fabric sourcers is typically only one of them. It’s important to capture their attention by making their job as easy as possible. The site had to support first impressions and brief visitors who were seeking an overall sense of who Dorell is. 
  • Service-focused brand: Dorell is not a product-driven company, their competitive advantage is providing solutions that are tailored to each client.
  • Instead of entering the ecommerce space, they wanted to use their site as a sales tool to generate interest in Dorell as a collaborative partner for companies that have a continued reliance on their solutions.

Opportunities

To take advantage of these opportunities, our main objectives for the site were…

  • Providing a “to-the-point” explanation of Dorell’s story and offerings.
  • Converting website visitors into potential new accounts.
  • Establishing a web presence that markets Dorell’s credibility in the industry while emphasizing innovation and modernity.

Design

Mapping the IA

One of our main goals for the site was to ensure visitors would be able to understand what the company offered with minimal exploration on their end. The project scope only allowed resources for 5 unique page types, one of which was a flexible template containing components for customizable content. I used a stripped-down approach to the IA, limiting the unique templates to pages that would use components only used in place, such as the product index, and a contact page.

In order to make the most of the page types, many detail pages utilized a flex template, while pages with more interaction were assigned their own template.

Wireframes

I was also responsible for creating and iterating for wireframes for both mobile and desktop, and ensuring that the site could stand alone as a representation of the client’s present and future without the need for continued fine tuning. In line with the minimalist IA, I focused on making the pages concise and easily digestible, with simple text and image components that made it easy to understand the benefits of partnering with Dorell. In order to generate leads, we included calls to action on every page to the contact form.

Handoff - A cross-collaborative process

Though each of our team members had distinct roles, we weren’t confined to only one phase of the project. My main role was finished with the final wireframe mockups, but I continued to support the rest of our team up until the final launch. Once the visual design team applied the new brand styleguide to the wireframes, I added design annotations so our development team could easily implement components on the site. I also assisted on QA to ensure that the live pages functioned properly when launched.

Result

Product index - Products as solutions

For many competitors, the product category is used to catalog individual products that visitors can purchase. Since the goal of our client was not direct transactions, I opted to take a different approach, including a product index that linked to individual pages detailing settings that Dorell had experience providing solutions in. The content on these pages promotes Dorell’s reputation as a problem solver and versatility with the types of industries they partner with.

Trends - Visualizing Trends

In the past, Dorell’s team generated leads by manually sending static pdfs of their products to prospective clients. However, for an audience that relies heavily on word of mouth, this approach was not easy to share or easily scalable. In order to set Dorell apart from other companies in the space, we designed a solution that would live on the site and showcase their creative side to customers. The Trends page is a collection of constantly evolving, curated groups of visual inspiration and corresponding samples that is easy for users to browse and share. As a highly visible feature on the homepage and in the site navigation, the Trends page served to validate the client’s expertise in curation and establish them as innovative leaders in a saturated market. If users wanted to view the full trend report, they could give their email which would give another way to convert interested parties into potential leads.

Reflections

This was my first time working with a full team of both designers and developers, and I was happy to be able to contribute to the initial research and design phases that set the direction for the final result. I would have liked to explore including more varied page types in the wireframe stage, but I appreciated how the quick timeline and limitations resulted in a more straightforward final product. While the process went smoothly overall, there are some factors I need to keep in mind when working as part of a larger team.

  • Consider how much to present to the client, needs to be enough to gather helpful initial reactions but not so much so that feedback gets off track.
  • Be aware of timeline and scope when iterating complex templates, some ideas were too ambitious given the amount of bandwidth on our team.
  • Importance of communicating function of designs when handing off between teams, intention and details can be lost if not explicitly annotated in the files.
Star GreyStar GreyStar Grey

Other Work

Shelter

Streamlining the design sprint for efficient collaboration

95 Percent Group

A research-driven website redesign from insights to impact

Savills North America

Promoting sustainability goals through design and content