Please, note that graphics, charts and data on the page have been modified to maintain the confidentiality agreements.


Project Goals

The client, a high-end shoe and accessories retailer with two locations in New York, reached out to NPcreate (NPC) to create a new e-commerce site.

The store is very well-known in New York for featuring its own collection, along with small up-and-coming designers and major designer labels from Italy, France, Denmark, England and the United States.

However, it had no online presence and the client’s goal was to have a site that would reach a new, affluent online consumer in the USA and abroad and maintain clients overseas.

 

Client Ask

It was important to the client that the new website become the virtual equivalent of shopping in the store. It was essential to capture the store owner’s style and personality via the digital realm.

Ideas included integration of video(s) of designer interviews, rants by the owner, iPhone photos (videos) of style observations, and a brainstorming session.

The site experience needed to not only meet the aesthetic look, but really make the viewer feel at home at the store and be a part of the client’s shopping experience.


Website Requirements

Based on the client’s desires, we suggested building the website in Magento. It provided most of the requested pages such as a home, content pages, shopping cart and a blog function. We suggested having an optimized mobile site given the audience that would be accessing the site via iPhone and iPad.

Down the road, the site would need to expand and become multi-linugal with partial or full manual translation since computer-generated translations lack the proper linguistic sensibility -- even if it was cheaper with the development module for automatic translation.

 

 Business Requirements 

Current Client Profile

The general client age range is from mid-20s to late 40s. Income ranges vary, but the majority of customers earn $100,000 or more per year and/or have access to a trust fund. The store has numerous celebrity and Upper East Side clients. Product prices range from $200 to $2,000. 

New Client Profile

The client’s new and expanded business goal was to reach European and Asian travelers and shoppers.

The market challenge is that Asian travelers tend to shop in NYC at major boutique stores like Prada, instead of coming to the client. 

New Client Acquisition Model

The site needed to reach potential visitors before or on arrival and entice them to stop by the client’s stores and build a long-term online relationship.

There are potential partnership opportunities for frequently visited websites for tourists. PR outreach, a multi-lingual website that tracks IP numbers and selectively sends information out to various countries, runs a promotion based on IP addresses.

The plan was to gain website exposure via Pay-Per-Click (PPC), a Facebook campaign, SEO (Search Engine Optimization), SMM (Social Media Marketing) and traditional PR. 

th_CHU_birthday.jpg

Client Retention Model

Encourage current clients to sign-up for the e-newsletter (online and in-store) and create an online profile through an incentive, such as offering a 10 percent discount on the customer’s birthday.

Other CRM concepts focused on social media updates and postings, on-line competitions, photo galleries and video content with exclusive behind the scenes content to keep clients engaged with the brand.


Site: Functional Requirement 

Photo taken by https://www.flickr.com/photos/frauleinschiller/

Photo taken by
https://www.flickr.com/photos/frauleinschiller/

WYSIWYG, Social Media, Video Integration, Social Media and Sales Promotion

  1. The Home Page needed a dynamic text function linked to a coupon banner function and/or Google Website Optimizer for A/B or multi-variable testing. 
  2. The dynamic text and banner had to be set on a timer for specific sales promotions and default to their original settings after the expiration date. 
  3. Basic CMS function: add/edit title, subtitle, text; add/delete images and videos; add/delete coupon banner with code (linking to sales page)
  4. Twitter feed; Facebook feed; Picasa feed and/or videos (via a third party); and sign-up for newsletter (mailchimp.com). 
  5. The CMS with the WYSIWYG (What You See is What You Get) had to allow for widget (JavaScript and jQuery Code) or pull in the JavaScript and jQuery over an iFrame. 

Mobile Requirement

  1. The client’s new website needed to have a smartphone optimized version (iPhone, Android and Blackberry).
  2. The smartphone version focus differs from the full website version in layout, design and navigation.
  3. Video and image feeds are moved to a different location on the mobile site to optimize the viewing experience. 
 

Site: Shopping Cart Functions

Since the shopping cart function is the most important part of the site structure, we worked closely with the client to outline all of their requirements and our UX recommendations.

Product Landing Pages

Video (product line video), Copy (description of products), Products Photos, Sort Option (price, featured, sales etc.), Define sort variables, Images Display Option (e.g.: 20, 40, 80 per page).

 

Product Page

Close-Up, detail shots, Zoom In function, Video or Picasa feed, Size (No#), Swatches (color), Quantity, Share (SMM) ability (addthis), Facebook Like (disabled), Email (Product), Print (Product), Product Detail, Shipment & Return Policies, Tracking of Product (Google Analytic or Shorten URL), variable fields (define options).

Checkout Function

  • Choice of customer login checkout or guest checkout. 
  • Add/Delete quantity of item, select shipment option (UPS options, local delivery or pick-up from Madison Avenue or 63rd Street location), add item from the wish list, add coupon or gift code, select preferred payment method. 

Shipment Function

Integrate with UPS. UPS delivery options available for customers. UPS auto-generates tracking number that is then emailed to the client. Alternative choices: pick-up item at either store (select choice of pick-up), and local delivery (fee applies).

Payment Gateway

We suggested using the client’s current processor: http://www.mercurypay.com/. The alternative choice was http://www.authorize.net. Client needs to provide access information for integration. Other optional payment gateways are: PayPal, Amazon and Google Wallet. 

Mobile Payment Gateway

PayPal Mobile Checkout, Google Checkout and Admeris.

Inventory Tracking

Shopping cart inventory needs to be tracked and integrated with the current POS via Activo Runit.

Coupon Codes

Coupon codes are used for sale and birthday certificates. 

  • Discount Codes can be applied to one or more (selected) items, a percentage of the total sales, a conditional sale (example: buy 1, get another pair x% off) and shipment (over $x free shipment) and managed by the superadmin.
  • Gift Coupons are system generated when bought (shopping cart item). 
  • Client staff manually creates birthday certificates. Both certificates are emailed to the receiver with a personalized message (Custom Input Fields).
    • Coupons have expiration dates (set by superadmin).
      • The coupon is not recognized during checkout past its expiration date.
 

Site: management

Cart Management

The CMS had two different administrative levels. 

  • Superadmin: Access to home page, content pages, inventory, shopping cart features and credit card processing.
  • Admin: Access to home page, content pages, shopping cart features (update product pages), but cannot access inventory, and credit card functions (set-up).
     

Customer Management

  • Default login is the customer’s email address. 

  • CAPTCHA verification for email validity. 
  • An automatic email is sent on the email address on file to reset the password if the user forgets his/her password. 
  • The customer can check and apply in-store credit and/or online store credit (gift coupons, returned items) from previous purchases to current order. Store credit does not expire.

Checkout Management

  • The Customer Profile stores: username (first, last), billing address, user shipment address (up to 3 addresses), phone number/s (cell, home and work), billing information, previous purchases (item and date) and invoices, and wish list (pre-selected items). 
  • Generate purchase suggestions based on previous behavior (variables). 
  • Optional: customer can fill out a checklist to define shopping interest. 
 

Site: Tracking Features

Content, Product Landing Page, Product Pages are tracked via Google Analytics. Implement auto-generated shorten URL for products and links to track SM sharing behavior of site visitors. 

Google Website Optimizer is implemented by default. Google Website Optimizer tracks A/B testing and multi-variable testing that is conducted in conjunction with a marketing strategy (PPC campaign) and/or PR outreach.


Proto-types: Axure

We created two different proto-types for mobile and desktop. Axure was unfortunately not capable to create a liquid responsive proto-type.

 

Design Files

I created the initial UI designs based on the approved wireframes.  Frankie T., NPC junior designer, created all the production files for development.


Handing off the project

The project development was finalized in 2012 for the final client approval. Unfortunately, the client went through several internal business changes that prevented the site from being deployed.