GSOC App Product: Cobalt Robotics

These images reflect the ongoing iterative development of the Cobalt SOC (Security Operations Center)—a key facet of the security services product the company offers.

Cobalt’s customers manage security programs in indoor environments including office workplaces, manufacturing and warehouses, shopping centers and cultural centers. Beyond the benefits of a patrolling robot and on-call personal presence via its tablet screen, our customers want to see through the multiple “eyes” of the robots in their fleet.

No customer locations are shown in these comps.

Through conversations with our Head of Product, sales reps, and customers, we developed the Cobalt SOC App. With it, customers can remotely monitor incidents as they are happening at any time during the robot’s patrol hours. If an unusual or critical incident requires immediate action, the app delivers video surveillance and other important data directly to top decision-makers.

Wireframes were begun on paper. Shown here are some next-stage (but still early) concepts.

In addition to hearing the concerns and frustrations of security professionals, we also dove deeply into industry norms by interviewing security managers, undergoing guard card training, and visiting our customer’s security operations centers. The results are an intuitive tool that delivers increasingly meaningful features as our customer base expands.

Proposed event modals.

Favly, Inc. Product

Favly, Inc. is the maker of a new social referral app. When I began the project, the iOS app was well underway. In addition to visual identity and brand development, the product needed to be pushed to Android and web platforms, and its notifications features needed to be organized, designed and implemented.

For more details about my identity and brand design work for this company, see Favly, Inc. Brand.

Android

In contrast to the approach that had been taken for the iOS version of the app, we chose to design for as Android-native an experience as possible, closely following material design and material.io guidelines and best practices, so that we could focus development resources on improving current features and introducing promised new ones.

Web

Of the three platforms, we tackled the web app last. I pushed to balance consistency to the mobile app experience with the opportunity to offer features that would take full advantage of the platform.

iOS

Although I had been focusing on Android and web platforms, updates to the iOS version of the app meant that I was involved there, as well. We iterated UX and UI improvements, as well as promised features, steering the product away from its initial ultra-customized interface and catering more to native.

Notifications

Tight on resources, I designed a simple base template and commandeered wall space to map and track the email notifications. The marketing director and I co-planned, co-wrote, and co-strategized every piece with the intent to maximize the potential of these touchpoints.

Favly, Inc. Brand

When I began at Favly, makers of a new social referral app, there was already a first-round website, a nearly-complete iOS version of the app, and a logo. While there was a rough styleguide, the logo and its uses had evolved since it was created. All resources were now focused on the iOS launch.

For more details about my product design work for this company, see Favly, Inc. Product.

Brand Discovery

To create a system, a coherent visual identity, and to begin delivering materials that would best serve our goals, I began with a brand discovery process, and spoke with each founder to get a feel for their vision. The resulting document—The Favly Story—was not only a valuable resource for myself and new hires, but was added to the fundraising arsenal.

Brand Discovery Document for Favly, Inc. created by Penina S. Finger

Styleguide

Once I had confirmation from management that The Favly Story reflected the company’s principles and vision, I began the first draft of the styleguide. This was a more conventional document, but I used excerpts from the Story to reinforce the reasoning behind various style rules, such as the use of gradients and copy tone.

Multi-platform Design

With the beginnings of a system in place, my design team revisited the company’s marketing materials and landing pages, as well as the product itself. In print, on the web and in mobile app environments, we generated visuals that are a dynamic balance of consistency and vitality.

Other fundraising support included a deep overhaul of the slide presentation to reflect the app’s core ideas with greater clarity and professionalism.

Email design and notification strategy

One of my most challenging projects was working closely with the Director of Marketing, the planning and implementation of about fifty emails. Most of these were critical moving parts of the product, and an indispensable step in earning new users to grow our traction. Tight on resources, I designed a simple base template and commandeered wall space to map and track the emails. We co-planned, co-wrote, and co-strategized every piece with the intent to maximize the potential of these touchpoints.

Surface Design: Home Decor

surface design - pillow pattern range

Wide and experimental pattern range for interior design client, Christel Ferguson.

I developed patterns, exploring a variety of styles that ranged from hand-drawn and loose to traditional and quite rigid. We explored trend colors as well as Christel’s own particular tastes, and researched fabrication options that included both hand-embroidered and the latest print-on-demand technologies.

Geometric Sea
Geometric Sea Pattern by Penina S Finger

Simple Floral
Simple Foral pattern motif by Penina S Finger

Long Ivy & Stripe
Long Ivy and Stripe pattern for home decor by Penina S Finger

Web Product Design

Responsive web product design by Penina S. Finger

This project was brought to me by an agency that asked me to take it on and lead the design. The client gave us a highly social concept that was well developed, but needed its next round of feature updates as well as a more sophisticated look and feel. They sent detailed notes, and we followed that with a number of meetings as we refined their ideas, and I introduced some of my own.

I diagrammed interaction using wireframes and a prototyping tool, then nailed down visual details with Photoshop. We opted to deliver two core responsive experiences: desktop/tablet and smartphone.

Responsive web product design by Penina S. Finger

eCommerce: ModelMayhem Shop

The ModelMayhem Shop taps a range of commerce partnerships, offering products that are relevant to the industry, as well as specifically to the MM community. These include:

  1. Simple affiliate-style partnerships, such as an MM-branded Nextag feed
  2. Comp cards and headshots, for which I designed a variety of templates, as well as the interface for product customization and order/transaction flow.

I’ve done extensive UI/UX work for features throughout the ModelMayhem website, including a completely new subsite, Modelmayhem EDU. Please contact me if you’d like more info.

Headshots style browser

ModelMayhem shop website and interaction design (headshots browser)

Comp card style browser

ModelMayhem shop website and interaction design

Transaction flow: enter cc info

ModelMayhem shop website and interaction design (transaction sample)

Marketplace placeholder

ModelMayhem shop website and interaction design (Marketplace placeholder)

Co-branded web ad product: doityourself.com

For the co-branded native ad product I developed for doityourself.com, the challenge was to deliver a modular system that was super efficient to implement while also being flexible enough to accommodate the drastically different types of content each brand had available.

Native Advertising: Co-branded Web Ad for Behr Paints

Native Advertising: Co-branded Web Ad for Dremel

Native Advertising: Co-branded Web Ad for Mitsubishi

Native Advertising: Co-branded Web Ad for Moen

Advertisers essentially “took over” a section of the doityourself.com website. We gathered relevant content both from its massive library of articles as well as that of the advertiser. As much as possible, we stuck to instructive or inspiring content.

Notes

  • The “product” is essentially the website’s targeted (do-it-yourselfers) and substantial traffic.
  • The site owns abundant content highly relevant to DIY advertisers.
  • These are max 3- to 6-month campaigns, so longtail strategies that content-based sites like ours generally rely on won’t work.
  • Advertisers with the most content (any combination of articles, photos, videos and/or community features), the least “salesy” content, and the best organized content had the best results.