Qosmo Web Design Update — Tagline Changes and Editorial Design Techniques

Naoki Ise
Qosmo Lab
Published in
4 min readJun 13, 2023

Tagline update to “AI Creativity & Music Lab”

The Qosmo website design update coincided with an update to the company tagline, changing from “Cultivate the Chaos” to “AI Creativity & Music Lab”. Since its inception in 2009, Qosmo has focused on augmented creativity with AI technology. With recent advances in AI technology, AI is finally beginning to impact the creative process and society for artists and creators. At this juncture, we felt the need to clarify Qosmo’s position, so we came up with a new tagline which reframed the company. After many discussions, the tagline was changed from the previous “Cultivate the Chaos” to “AI Creativity & Music Lab”, clarifying our position as a company focused on AI and music.

Updated tagline

“Editorial” design: categorization into ART, R&D, Products

For the Top page, all projects are divided into three categories, ART, R&D, and Products, in order to better communicate Qosmo’s primary concerns. On hovering over each keyword we elaborate to provide more context. “ART” becoming “We create ART with AI and collaborate with artists”, “R&D” to “We conduct R&D with our clients on creative AI technology” and “Products” to “We build Products for artists and creatives”. The three texts embody Qosmo’s current focus while representing our personality and attitude.

Top page: ART R&D Products from left to right, and on the right you can browse related projects by tag

Categorized Web reference: ART+COM

ART + COM is a Berlin-based design company that creates new media installations. The top displays three large buttons, ART, COMMUNICATION, and RESEARCH, with representative visuals projected in the background. The first thing you clearly see are the company’s primary areas of work.

Less text, more visual

In keeping with our “less text, more visuals” editorial policy, we have summarized and re-edited all project-related texts and organized and added more visual elements. Rather than being a site where visitors can read about our projects in technical detail, the site has been transformed into a place where visitors can access and view works of art in a sensory way. The amount of information has been minimized so that only the most necessary content (photos and text) are displayed. The menu and language options that were always displayed in the previous version are also hidden, and the footer elements are limited to SNS and newsletters.

Individual project pages: Header only shows logo and ART, R&D, Products, Menu

Less text, more visuals Reference: SPIN

A graphic design studio in London, was a useful reference for us with their method of using large visuals throughout and designing minimal UI elements such as menus. The top page also has three separate entrances: WORK, GALLERY, and PROFILE.

Production of Reel

In the updated web design, we released a reel video using our own work. In other words, we re-edited it so that the visuals of our work can be seen first.

Reel reference website: DIA

DIA, a graphic design studio in New York, has an exciting and captivating top-page movie that switches from one moment to the next. This technique was incorporated into the website.

Typography-based browsing

Unlike other design companies, where their projects are mainly visual, Qosmo also feature sound design and software projects, so it was difficult to select visuals that symbolize each project. On the previous website, simply arranging thumbnails gave a chaotic impression. So I decided to stop displaying them and use simple typography to show the titles, and then show the visuals one by one in the background on mouseover

List page: Mouse over the Imaginary Dictionary and a picture of the dictionary appears in the background

Layout, interaction, and curation of materials were the main focus of the update, rather than the creation of so-called design elements, UI, color palettes, etc. In this sense, the curation work was the most important part of the update and I believe this is an interesting angle in designing for websites.

New environment — Contentful, Vercel, Github

The implementation is built on Contentful CMS and Vercel, so that every time you make an edit in Contentful, all the content is rebuilt in Vercel, and the history is stored in Github. The entire website is light and easy to navigate.

We have updated the website without creating any so-called “formative elements”, but rather reorganized it to match the tagline and company projects. I started this design in January of this year, and the site went live in April, so it took about three months to complete. As a result, I believe that the website stands out from others and additionally through our company focus of AI technology with an emphasis on creativity.

Finally, I would like to thank Akihiro Kato, who implemented the website, for his feedback on the interactions. We also thank Momoko Aoyagi and Chiho Yamada for their editing.

--

--