TakeShape

TakeShape is a faster, more flexible CMS that utilizes a modern tech stack and simple interface.

  • Role

    UX, Branding, Visual Design

  • Agency

    Ronik

  • Background

    TakeShape is a content management system developed in-house at Ronik, a design and development agency in Brooklyn. Devised out of frustration for current tools, Ronik has successfully utilized it for many of their customer's needs including JFK Terminal 4 and the Leonardo DiCaprio Foundation. I was a key member of the team that designed the web app from scratch.

  • The Challenge

    The team has been working with content management systems collectively for over a decade. Their goal: develop content managed marketing websites—fast. The problem with existing solutions? Too rigid. Developers would have to bend them to their will; a frustrating and slow experience. Why worry about servers and security for simple websites? TakeShape empowers developers to create content managed websites with no servers, installations, or security overhead.

  • Wireframing

    I designed the majority of the preliminary wireframes for the product. The product revolves around creating “content types” using a form builder. Instead of imposing a content structure on the developer, the developer defines the content model. Once the model is defined, content editors can add content and developers can use the data however they’d like with TakeShape’s API. Wireframes were brought to life with clickable prototypes using Invision, allowing us to test the many user flows before polishing.

  • Visual Design

    In order to quickly develop the product, TakeShape utilized the React Toolbox interface library (inspired by Google's Material Design) for the majority of its UI. For design patterns that didn't exist, we would create custom components.

  • Creating A Pattern Library

    To avoid wasting time pushing pixels, I developed a pattern library for the team using Brand.AI (now Invision Design Manager). Designers can quickly recompose any part of the product in Sketch using components as building blocks, allowing them to solve the product problems without getting caught up on visual details.

  • Illustrations

    I developed isometric illustrations that TakeShape used for their investor pitch deck and marketing materials. The style can be reproduced quickly by other designers using an Illustrator action set.

  • 3D Renders

    I created 3D models for Instagram to illustrate the 3 main steps of using TakeShape: creating a content model, adding your content, and packaging it all up into a content experience.

  • Results

    TakeShape has been used in production for many projects including: JFK Terminal 4, Leonardo DiCaprio Foundation, Slingshot Fund, Awaylands, Wax, Time to Choose, and many more. The design and development is an ongoing process at Ronik.