Rachel Costantino
Web-CoverImg.jpg

brickly, Product + Visual Design

I was the Design Lead at brickly. brickly's mission was to legitimize and amplify the beautiful, creative work being done by the brick (aka LEGO) artists and community. When I joined the team, I was inheriting an app two weeks after soft launching — fresh out of working in stealth mode. The app was a visually-led, social platform for artists to show, share, and comment on other's builds.

My initial focus was to establish and standardize UI patterns, to restructure the navigation and UX in order to allow room for growth, and to develop a visual language for the company beyond that of the UI.

This page follows the chronological evolution of my time at brickly.

 
overview-coverimg.jpg
 

When I joined, the company hadn't quite landed on a brand vision or voice. The Head of Content and myself developed the line, "Dream in brick. Make it real." That concept of imagination and creation became our filter for how to present ourselves as a company, both visually and verbally.

 

Establish Needed UI + UX Patterns

 

Inherited Explore (home) Screen 

Explore-Old.jpg
 

Shipped + UpdateD Explore Screen

Explore-New.jpg
 
 

Included in the product roadmap, when I joined, were additional features that would not be accessible through the navigational paradigm of the soft launch version. In order to give space in the nav bar for growth of features, I moved the search icon to the tab bar. This also allowed the search screen to evolve and grow to include a discoverable/browse feature, expanding means of accessing the content (shown further down this page). 

Several UI updates were made in order to help the organization of the curated Explore page (title treatments, more consistent buttons and color use, multi-image indication icons, and backgrounds to separate collections). Additionally, I changed the Camera icon to an Add icon as the camera is not accessible via the app and it was misleading. 

 
01-Rocket.jpg

Immediate Access for non-iOS Users

01-CWA-PostPage-dropshadow.jpg
 

My first day, I was tasked with creating an MVP for managing and adding content to the platform through the web. Due to our iOS only app, the company had hit a road bump with user acquisition. I designed a single view dashboard to give access to non-iOS users, we called this the Creator Web App. The app includes an upload flow, an ability to see comments, and access to edit / delete posts. This was designed and shipped within about a 3 week span.

 
05-Paintbrush.jpg
 

Most Updated, Shipped App (as of mid-October 2017)

 

Browse + Search

 

Create a New Post

 
 
03-Eyeglasses.jpg

Prototypes + Screens for Planned Phases

Search-MockUps.jpg
 

I worked with our development team to create a new workflow process. By using Clubhouse, we created a ticketing system that allowed for a more structured approach to prioritizing decisions as well as phasing in new features while balancing bugs. Additionally, I created a separate workflow for the design process to then feed into the development process. Above are some new Discover states that we had planned to include in late November.

 

Visual Design of Build Challenges

SummerMemories-WithTitle.jpg
InApp-AnnouncementBanner.jpg
 
Summer Memories.jpg
 

One of our main features as a company was our monthly build challenges. We ran two official challenges and were working towards creating a feature on the iOS app to allow the challenges to become a constant part of our ecosystem. I created visuals and templates for our Content team to use for social media campaigns and announcements.

 
OctoberChallenge-SmType.jpg
 
October-in-Bricks-1.jpg
 
 

Challenges Feature (Study + Early Prototype)

 
Challenges-ActionMap-lg.jpg
 

Web App MVP

Artist Home, Read Only

Post Detail, Read Only

 

As part of our phased release of the web app, we had read only versions of both the Artist Home (profile) and the Post Detail pages. Both these states were shipped. 

 
 

Web App, Phase Two

 

Above is the prototype for the next two phases of the web app release. The initial next step was to add interactive and social features to the read only pages from the first phase, web app MVP. The next phase was to build out the Explore tabs.

 
 

brickly Publication

Cover-CloseUp.jpg
 

From our community, we saw such amazing people, art, content, stories, and ideas that we decided to give the material a new place to live — a publication. We were about three weeks out from a convention (BrickCon) and we wanted to have an introduction to this idea, thus the 0th Edition was born. 

 
Crop-1-brickperson.jpg

In order to help distributuion, we created an alternate layout. Check out the digital adaptation of the 0th Edition here.