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.

Community Identity

No surprise (to me) that our corner of the world was among those designated by Mayor Eric Garcetti to be a Los Angeles Great Street.

As a member of the Pico Great Street Collaborative and the PGSC Urban Design Committee, I’m drawing from the neighborhood’s diverse social and architectural identity and contributing design input to facets including signage, infographics and grant applications.

My strategy has been to first lock on to the existing Great Streets visual identity, and then gradually evolve that toward reflecting Pico’s unique qualities. This allows the initiative to leverage public recognition as support and funding are developed, and more importantly, to listen carefully: it’s both our pride and our challenge to be one of Los Angeles’ most culturally and racially diverse communities.

The infographic below was adapted for use as a poster in participating shops, as an online outreach tool, and as a supporting document in grant applications.

Infographic by Penina S. Finger

Because this is a volunteer project, I am delivering assets as the need arises, rather than as a pre-packaged system. All the better to allow a complex identity and its future vision to be discovered, defined and redefined over time.

Schematic neighborhood map illustration 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)

Social media posters: Café Picfair

A selection of social media posters created for a neighborhood café.
I took the food and kitchen photos, researched the others, established the brand tone and wrote/found the copy.

Kitchen Morning, social media poster for a neighborhood by Penina S. Finger

Kitchen Morning, social media poster for a neighborhood cafe by Penina S. Finger

Soul on fire, social media poster for a cafe by Penina S. Finger

Blueberries, social media poster for a cafe by Penina S. Finger

Make things not war, social media poster for a cafe by Penina S. Finger

Website design: ModelMayhem EDU

modelmayhem.com is a huge, high-traffic site, packed with user-generated content and a vocal, global membership. Its lightweight design has kept it accessible worldwide, setting a minimalist tone that helped us evolve the brand’s identity and bridge the gap between familiarity and new design trends.

The EDU section was a completely new feature, as well as a chance to begin setting the tone for a planned future overhaul of the entire site. I determined the architecture, the UI design and the page design, and also developed phased rollout pages in order to collect member preferences, UX insights, and to reinforce community.

I’ve done extensive UI/UX work for features throughout the ModelMayhem website, including an eCommerce section, the Modelmayhem Shop. Please contact me if you’d like more info.

modelmayhem edu site design, library home page (cropped), design by Penina S. Finger

modelmayhem edu site design, library home page (cropped), design by Penina S. Finger

modelmayhem edu site design, catalog home page (cropped), design by Penina S. Finger

modelmayhem edu site design, catalog home page, design by Penina S. Finger

 

Wireframes

modelmayhem edu site design, library home page (wireframe 1)

modelmayhem edu site design, library home page (wireframe 2)