Over 4 weeks, I designed and built a website for a global accelerator program, integrating a content management system, and social media feed. The site has hundreds of monthly visitors, who can apply to the program on an accessible, mobile-friendly, and easy-to-navigate site.
The 100+ Accelerator is an accelerator program launched by AB InBev in the Fall of 2018. The program is targeted towards startups that are addressing global sustainability issues and was launched in partnership with Highline Beta. The initial website was rushed into production, right before registration opened for the first cohort, which unfortunately resulted in a site that lacked quality in terms of accessibility, transparency of information, and the ability to scale. I sought to make the site more engaging, accessible and world-class through the means of a redesign.
I worked with several accelerator directors and operations managers that had oversight into the program, to update the site. My task was to design and build the new website, with the goal of increasing marketing reach and to drive conversion (cohort sign-ups). Given that I was the only designer/developer working on this project and my preference for lean and agile methodologies, I opted to use a feature-driven development process for this project.
There were a few issues that necessitated the need for this project:
I collected data, conducted a competitive analysis of other accelerator programs, and created a comparison matrix of features and site-map structures. From this, I produced a list of requirements that would bring the site "up to par"—and surpass—other accelerator program sites. I then presented this to the directors to refine the details and the scope.
The final feature requirements can be summarized in the following:
There were some constraints set at the start as well, some of which helped form the above requirements:
I created the initial designs and sitemaps in Figma, utilizing the card metaphor for several components. While I experimented with several designs of varying colors and complexity, I ultimately ended up with something very similar to what you see in the final product.
One design challenge that arose was in the layout of all the information presented: designs quickly became convoluted and confusing, which led me to use sections with larger spaces for dividers, more heavily investing in the Cards component, and introducing tags. The goal was to make the site colorful, but not overwhelming.
Some development challenges that arose from the process was the integration of the CMS software with some legacy code, which resulted in a bug that took the site offline. In response, I introduced automated integration testing to ensure that bugs are all caught before deployment, and no feature regressions are going forward.
I worked on the development of the site using HTML, CSS, and React, with a Contentful CMS integration. Netlify was used for deployment, and Figma was used as the design tool.
After the weekly development cycles of building and iterating the site was completed and launched. Overall there were significant improvements to the site, as all the feature requirements were built and integrated successfully into the site.
However, there are still improvements to be made in terms of SEO, page-size, and a few accessibility upgrades. The usefulness of the analytics data was limited since applications are not set to reopen until the Fall of 2019. Once registration opens I can compare cohort analysis trends to uncover further optimization opportunities, and truly bring the site to world-class prestige.