A strong visual identity and website is key for any start-up looking to grow. In order to attract investors, customers, and new employees, XY needed strong branding and a lightweight website to announce the company’s vision and process. Schema started by working with XY to develop their logo and brand. After understanding their technology and mission, Schema suggested a striking visual that embraces the excitement of machine learning and multi-scale data. Providing transparency with the community was another key goal, so a section of the website is devoted to the company sharing about their process.

I joined the XY team after Sergei (design lead) and Miguel (visual designer) had already conducted research and developed a new logo for XY. We saw the opportunity to build the website as an expansion of the logo. We also envisioned how the logo could be turned into a landing animation—zooming in and out—to communicate how XY uses multi-scale data in their service. Meanwhile, the client provided the types of content to include, among which are the company's mission, method, team, jobs, and a blog-like section, where they could share their knowledge with the data science community. From then on, the ideation process was more about determining how to structure content in a meaningful way, hence each concept arranges and highlights information differently.

Among the initial concepts, the client responded positively to Concept 1's way of organizing the content and its transition from a logo animation into a faded background. They were also fond of Concept 2's weight shift in the logo, for it effectively communicates the relationship between X and Y, where X is the input and Y the output. Built upon these ideas, our final concept divides the website into two main pages and assigns them to individually represent X and Y. The Vision page represents X and covers information about the company, while the Process page represents Y and documents what the company produces as a result of who they are.

Throughout the design phase, we kept in mind that in addition to desktop screen sizes, the website should also perform well on tablet and mobile devices. Therefore, we developed templates with multiple breakpoints early on to ensure the responsiveness of the end product.

In terms of visual, we chose a more logical, minimalist, and edgy approach. We wanted XY's brand to stand out from its competitors and to pervade throughout the website experience. As a result, we chose typefaces, curated images, and created illustrations that would match and further strengthen the established brand identity.

After consolidating the design, we moved on to the build phase. With the help of online tutorials and co-workers at Schema, I learned how to build a website from scratch in Webflow over the span of one month. In addition to the website, I was also in charge of the landing animation, which I created in After Effects by following an animatic made by Miguel earlier in the process.