Contact Us

Use the form on the right to contact us.

You can edit the text in this area, and change where the contact form on the right submits to, by entering edit mode using the modes on the bottom right. 

         

123 Street Avenue, City Town, 99999

(123) 555-6789

email@address.com

 

You can set your address, phone number, email and site description in the settings tab.
Link to read me page with more information.

Pala 0


Project Overview

The privately held firm comprises three separate businesses:  

Palagems.com sells colored gemstones to gem professionals, jewelers, and collectors at wholesale prices.Click image to open site.

Palagems.com sells colored gemstones to gem professionals, jewelers, and collectors at wholesale prices.

Click image to open site.

Palaminerals.com sells museum-quality specimens to collectors and dealers.Click image to open site.

Palaminerals.com sells museum-quality specimens to collectors and dealers.

Click image to open site.

The Collector Fine Jewelry sells fine jewelry, mineral specimens and objets d'art.Click image to open site.

The Collector Fine Jewelry sells fine jewelry, mineral specimens and objets d'art.

Click image to open site.

 

Scope of Work

The project began as a graphic redesign of the Palagems website.  The goals were to make the site visually compelling, simplify finding information, and make the site usable on any device.  When completed, the redesign would be applied to the other Pala International businesses.

Our original role was limited to simplifying the user interface and organizing over ten thousand content pages.  Branding, graphic design and market messaging were to be handled by an independent branding professional.  The ecommerce back-end was to be converted into a proprietary, web-based system built a firm specializing in designing and hosting websites for art gallery owners. 

Click link to read the Project Proposal in a new window.

Expanded Scope of Work

These assumptions were overturned as the project progressed.  The branding professional would not adapt his design process and fee structure to meet the needs of a cash-based, family-owned business.  The ecommerce back-end could not be customized for gem and mineral sales at a cost that was acceptable to the client and the web hosting firm.  The inventory and customer systems of the three separate Pala businesses were intertwined within an out-of-date FileMaker database running on an ancient Mac OS tower computer on the verge of permanent failure.  All other business processes were run on paper.

What began as short-term user experience design project evolved into a complex top-to-bottom redesign of the entire website the supporting on-line and in-house database systems.  Achieving success required equal parts design, business consulting, and web coding plus learning the essentials of the gemstone and mineral specimen businesses.

Redesign the User Experience

  • Map the existing site's content as a hierarchical Text Map.
  • Map the entire site's content as as hierarchical text document and also as a Visual Map.
  • Create a User Experience Map that shows how to navigate from the splash screen through to payment.

Branding & Graphic Design

  • Research color schemes
  • Design a new logo
  • Write a new tagline
  • Design the user interface

Organize the Content

Articles

  • Organize the existing articles into sections within the Library.
  • Create a navigation system for the Library pages.
  • Build custom CSS for articles that mimics the existing look and enables the articles to be viewed on mobile devices.
  • Import the existing articles into Squarespace.
  • Convert the Buying Guides into Squarespace format.
  • Convert the most important articles into Squarespace format.

Newsletters

  • Separate the archival newsletters into separate publications.
  • Create custom CSS for archival newsletters.
  • Import the archival newsletters into Squarespace.
  • Create custom CSS for new newsletters.
  • Build navigation system for the newsletters.

Update the eCommerce System

  • Normalize the nomenclature used to search for gemstones.
  • Create the technical specifications for the web firm's proprietary database.
  • Convert the in-house FileMaker database.
  • Redesign the gemstone search interface.

Click links to read more detail about that phase.

 

Design Results

Splash Page

Previous splash page showed a random splash image when the page loaded. Clicking the image opened the home page of the site.

Click HERE to open the previous splash page. Refresh your browser to change the image.

New splash page rotates among a set sequence of images. The text links open key pages on the site.

Click HERE to open the new splash page.

 

Home Page

Previous home page had complex top, side, and bottom menus with one long scrolling strip in the middle column.

Click image to magnify.

Click HERE to open an archival copy of the previous site. Most links redirect to the new site.

New home page is simple, clear and inviting.  Each item in the top menu opens a new page.  The bottom menu

Main grid of images with roll-over text link to key articles in the latest newsletter. Sections below include news and a featured video.

Click image to magnify.

Click HERE to open new site.

 

Search form

Previous search dialog had two search forms plus lots of extra text.  Since the site was non-responsive, these search dialogs were difficult to use on mobile devices.

Search was difficult to use because the gem type, shape/cut, and color menus had multiple spellings for the same item and non-standardized nomenclature.

Click image to magnify.

Click HERE open previous search form.  Note that this form uses the new nomenclatures for Type, Shape, and Color.

New search dialog is simple, clear and inviting.  It's clear that a registered trade member must log in to see pricing.  The search form automatically reformats itself for smaller screens.

The Type menu is based upon standardized nomenclature from the Gemological Institute of America.

The Shape menu was reduced from hundreds of shapes to just 20.

The Color menu was reduced from hundreds of colors to just 20 plus 3 special effects.

Click image to magnify.

Click HERE open new search form.

 

Search Results

Previous search results were not easily visible on smaller screens. The images were not linked to the detail view.

Click image to magnify.

New search results automatically reformat to three, two, or one item per row.  The images link to the detail view.

Click image to magnify.

 

Search Detail

Previous search detail had small text that was hard to read.  The static top, side and bottom navigation cluttered the screen.

Click image to magnify.

New search detail calmly invites the buyer to inquire about the stone.  The Go Back button returns to the found items.

Click image to magnify.

 

Technical Overview

Dual-hosted site

The main landing pages, articles, newsletters, and featured items are hosted on Squarespace using their Adirondack template.

The ecommerce functions are hosted by Aplus.net powered by HTML, CSS, PHP, and MySQL code. 

Incorporating key snippets of Squarespace code into the header of the ecommerce pages gave them the same responsive user interface as the Squarespace pages.

Squarespace customization

The Squarespace pages are customized with over 1,500 lines of site-wide CSS that is duplicated on the Aplus side.  Some pages such as the Home page and all newsletter pages have page-specific custom CSS.

Learning Squarespace's meta design principles for their templates was key to understanding how to effectively customize the Palagems site.  The first step was to convert the Adirondack template's three CSS files into a readable format by adding line breaks and hand editing the results for readability.  The primary CSS file has over 35,000 lines. 

Aplus customization

The project required deciphering poorly documented PHP and MySQL code written by the site's original developer in the late 1990's. 


Project Phases