From the very first idea to the final downscaling of the company in 2018, I've been involved in every aspect of running this business. This use case is, though, focused on the design aspects, which has included both design strategy, identity, UX, UI, marketing material in digital and print form and front end development.
PROBLEM | Go from first idea to full blown digital startup. Create the visual identity, concept, user journeys, develop it in WordPress, manage and lead and iterate.
CONTEXT | My brother and I started Craft as we saw an unused resource in the creative industries: when a project is finished, most of the process artwork is left behind in a box or on a hard-drive, while it could inspire peers. We collaborated with the most reputable companies in the animation and comic book industry, sharing their creative process so peers, students and fans could learn and get inspired by it. This process spanned several years and depended on me to design and develop all parts of the platform and its assets.
TEXTURES AND DARK OVERLAYS | There’s a reason why HBO Nordic, Netflix and most other entertainment services go for a dark cinematic theme. It highlights the artwork. Being blessed with so much beautiful artwork to work with, I decided to not only go for a dark theme, but also incorporate the images as subtle textures. Most sections therefore always got a hint of texture, creating a universe engulfed in artwork.
STARRY SKY | A deep and dark purple functions as an interesting background and overlay, more so than a simple black. It’s also the perfect contrast to the sharp pink brand color of Craft. These small different takes on similar web design elements (a starry sky instead of a simple black overlay) has summarised created the design characteristics of Craft's visual identity.
Converting visitors to paying users | AThe most desired outcome for a startup is having leads turned into loyal and paying customers who enjoy your product. The desired scenario for a lead is signing up to a service without having to type in a long list of form elements. With the following design for a trial module, we A/B tested various formats and ended up with a horisontal row of 3 fields; name, email and password followed by the trial button. This way the form seems extremely simple and the eye is lead from the left toward the right ending at the call to action of getting started on a free trial (a wording we found out worked the best). The trial prompt displayed on every page that required signup to see the gated content.
Clear call to action | Generally we decided to keep the same color, pink, for all main call to actions, which worked well against most types of artwork from the vast library we had at our disposal.
Daily use scenarios at craft | Creating an intuitive user experience for navigating tens of thousands of images and video clips is no minor task. With same types of content across dozens of projects in different categories, there was no straight-forward solution or industry standard that we could look toward. We decided to let users navigate by craft or by project, often leading toward the same content. This way professionals could follow the category they work with on a daily basis (eg. an animator can quickly navigate to the latest animation content) and a fan of a project could browse it vertically (eg. a fan of Song of the Sea could watch storyboard clips and move onto background paintings from the same film). Having to use Wordpress for the platform, I spent months hacking and slashing the plugins and custom code bits to accommodate for these jobs-to-be-done, which resulted in a fly-out menu with further sub levels.
read, read all about it| To keep a subscription based company going, you need regularly released content. And you need users to notice it and feel satisfied with the type of content and the pace at which it's coming. Therefore I designed a 'latest news' section on the dashboard on which users were led upon signing in. This way users could navigate to the existing base of content with the left hand menu, and scroll down on the right hand side news section if they wanted to browse the latest updates.
CONTRASTS | When you’re a visitor to the site, most pages are clean, white and easy to get an overview of. When you’ve signed up as a paying user or guest trial, most pages are dark themed. This contrast makes it clear when you’re browsing artwork and using the product, and when you’re looking at Craft as a company and platform (pricing plans, product overview etc). The design ties remain in the same font, header styles and the pink contrast color.
MARKETING MATERIAL | The contrasts of a clean white look and a dark purple theme carried on in the marketing material in both print and digital visuals.
TOO MANY TO WRITE | This project was my life in three years and I’ve learned more than what can be written in a few paragraphs.
DESIGN SYSTEM | With a brand new company, everything has to be designed from scratch. And iterated on. Incorporating new ideas into an existing system, making incremental design changes while staying true to the design the users are already familiar with is not an easy task. I would recommend others always having your existing designs open while designing something new – not to conform to them, but to not stray off too much.
DESIGNING FOR FUNCTIONALITY | One thing is to design for attractiveness, a whole other is to balance the business aspect with your creative endeavours. I would have liked to spend twice the time on each design asset, but time didn’t allow it. This kind of short iteration loop, forcing yourself to publish when you’re only 80% satisfied, has taught me so much.