Business Need - An updated, modern web presence
Brinkerhoff Evaluation Institute (BEI) needed an updated, modern web presence that highlights the SCM certification and honors the accomplishments and legacy of Robert Brinkerhoff, including his evaluation approach. The challenges were to:
- Create a website that’s easy to manage.
- Create awareness and lead generation of the BEI’s resources and services.
- Promote and support the Institute's mission and goals.
- Provide a simple, automated registration integration for the certification program.
- Create a website that’s professional and efficient.
The needs we heard were:
- Professional, modern-looking look and feel.
- Intuitive navigation scheme.
- Calls to action for visibility into BEI’s events and leading to registration.
- An efficient user experience for potential clients.
BEI's target audience includes corporate businesses in need of program evaluation.
Scope of Work
Based on preliminary stakeholder discussions, we assembled a package of activities and deliverables that satisfied business needs.
DIA Design Guild’s approach is user goal-directed. That means every design activity conducted, every design problem solved, and every work product delivered is driven by a clear objective of aligning user and business goals, rigorously informed by user research, and thoroughly validated by user testing.
In other words, our approach is fundamentally evidence-driven and developed based on experience with previous similar projects and adapted to the specific needs expressed by BEI.
Our process is flexible and pragmatic—it reflects the reality that every project has its own unique requirements. For all clients, we conduct the right mix of activities to satisfy project objectives in a manner that’s sensitive to the business environment and the realities of scheduling, budgeting, and production.
Identifying BEI Project Needs
We started with a branding workshop, reviewed materials provided by the client, and created the agenda and desired outcomes for the workshop.
Some background information we reviewed included business goals, and an overview of BEI’s information architecture/system environment.
We also did research to evaluate the various technology platforms best suited for completing the project based on the client’s needs and requirements.
How we approached the problem
Identifying Brand Direction
We conducted a branding workshop to understand where the BEI brand stood and where the client wanted to take the brand. The activities consisted of identifying brand values, creating a brand personality spectrum, and brand sorting. This helped us hone in on a solid brand direction for BEI and identify the voice and tone that matched the BEI brand.
From Stakeholder Interviews to Competitive Analysis
We interviewed three stakeholders from BEI to learn more about the company, the company’s values, and their experiences. These interviews informed the branding workshop for the institute and helped DIA Design Guild design the website with BEI’s needs in mind.
To find specific areas of improvement for the client’s current website and pinpoint what makes them distinctive, the team conducted a competitive analysis of similar services within the industry to better understand BEI’s strengths and weaknesses.
A Strategic Content Design
Wireframes populated with actual content were made to give the client an idea of the site’s eventual appearance so they could work with us on adjusting their site’s content structure. This also helped our team rapidly prototype different typography styles to determine which style was needed to give the new site an updated and modern feel.
Brand Iterations around Diversity and Inclusion
The client requested we change the stock photos to be used on the website to reflect diversity and inclusion.
In order to create a logo for BEI that matched the company’s desired tone, we presented the client with different options for simple, modern, text-based logos. Upon the client’s feedback, we iterated on the logo - trying out ideas for a more graphical style.
In-Browser Design and Development
We quickly drafted the website’s structure with wireframeslow-fidelity wireframes to ensure design elements were in commonly expected places. Our team then referenced them while building the actual website itself in Webflow.
- Miro (Project kickoff)
- Figma (Wireframes)
- Webflow (Site development)
- Stripe (Signup form payments)
- Coda (Documentation)
- Google Doc (Business proposal)
- Google Meet (User interviews)
- Loom (For hosting videos)
What We Delivered
- Competitive Analysis Insights
- User Research Findings
- Design Mockups
- Brand Kit
- Website (Designed in Webflow)
What We Did Right
- Weekly check-ins
- Documentation & note-taking
- Great collaboration with client
- Research & stakeholder interviews
What We Could Have Done Differently
- Have individual team members own a part of the project they specialize in.
- Negotiate a more realistic timeline with clients.
- Ensure necessary content is prepared by a deadline.
- Use a less complicated CMS.
- Limiting the project scope based on the given timeline.
- Make more time for QA before launch.