Black Rock Labs website

Black Rock Labs

Black Rock Labs needed a new website to solidify their brand change from Black Rock Solar. While expanding their focus from solar power to sustainability as a whole, their new website presented their new mission on a single page.

Developing this site meant coding a front page template that includes each of the six content sections. To accommodate the variety of content, I created custom fields for each section. This means that paragraphs, images, links and the like, can be edited within individual fields. As a result, the client can be sure that the structure of the page is maintained.

Lekha Ink ecommerce store

Lekha Ink

Lekha is a children’s book publisher and creative writing school in San Jose, California.

To coincide with Lekha’s franchising its programs, the original site content is split into a corporate/publishing site and a writing center site.

Goals for the new Lekha Ink website included expanding the online store. In the new site, a collection of product pages with buy buttons becomes an full-fledged online store with grid display, categories for sorting goods, a shopping cart, and user accounts.

In the first stage of this project, the design of the publishing and writing school sites matched to keep brand continuity.

As the new sites were adopted and the publishing side continued to develop, Lekha Ink needed its own look and feel.

While the writing school continued with the initial design, the second design for the publishing site is clean, open, and brings the books to center stage.

Site management began with Lekha’s previous HTML/PHP site and continued through two redesigns and incremental changes.

Sessions at the Presidio website

Sessions at the Presidio

Session at the Presidio is a new restaurant specializing in seasonal small plates, craft beers and craft cocktails. Their website, designed and developed to support their opening, includes menus, reservations capability, background information, plus location information, hours of operation, and contact information.

Site development included fine attention to the design: type, imagery, textures, and layers. The “splash page” style home page leads to a two-column format on the inside pages.

The extensive menus section includes an accordion-style slider to optimize navigation within the page. The client can easily update menus themselves going forward.

Responsive web design throughout the site optimizes content for all screen sizes, includes converting email and telephone links to buttons on smaller screens to make calling and email easier for the user.

50 Balmy Law P.C. website

50 Balmy Law P.C.

50 Balmy Law P.C. is a San Francisco based law firm specializing in legal services for the arts, entertainment, and nonprofits. The new 50 Balmy website expands on existing content, outlining their expertise.

The redesign goes big and bold with photography corresponding with client work and services the firm offers. Pages are coded to include image sliders or static images with one or two columns.

Three special sections were created: a firm personnel directory, a practice areas catalog, and a portfolio of notable work. Each has an overview page which is automatically updated from individual entries to make updating the site quicker and easier. Practice areas and notable work overview pages includes titles and excerpts of their individual articles linking to full articles on each individual page. Personnel overview page includes staff names, job titles, headshots, and photo credits with links through to individual profile pages.

Photo galleries, based on the native WordPress gallery, are featured on the Clients page and the Balmy Alley page. The Client gallery presents logos in a variety of images in similar formats. Like the site as a whole, the galleries use responsive design.

BuildingWise website


BuildingWise specializes in making existing commercial buildings more energy-efficient, environmentally sound and profitable. Their new website combines information about their company and services along with a portfolio of projects and a blog of relevant articles. The design gives the client an open look with room to show their expertise in the fields of LEED and BREEAM certifications.

Development required attention to the relationships of content structures, particularly how they relate on different sized screens, as well as the intricacies of typography. Focus was given to making each page easy for the client to edit going forward while retaining the integrity of the design. The goal, as with each client, is making the site as easy to use and ready for future developments as possible.

The projects portfolio was coded as a custom catalog. The main portfolio page has a classic image gallery look where project images can be click on to reach individual project pages. Each individual page includes an image of the project structure, a description of the project, and relevant benchmarks of success. The client can use common toolbar functions to ensure the design stays as originally intended.

Through responsive design, the new site maximizes the space of larger computer screens to present content, while scaling and rearranging to suit tablets and smartphones.

California Alpine Club website

California Alpine Club

California Alpine Club (CAC) is a outdoor and social organization whose purpose is to explore, enjoy and protect the natural resources of our land. The California Alpine Club Foundation (CACF), founded by the CAC, supports the conservation and environmental education endeavors of SF Bay Area and Lake Tahoe area organizations. The new CAC/CACF website was designed to reflect their 100+ years of tradition and their ongoing activities. In this redesign, content was expanded to present CAC’s long history, giving users a full picture of the organization.

Several templates, with and without sidebars, with featured photos or with image sliders, were coded to present this content. Customized content spaces were created in the front page template to enable the client to update site content without needing specialized coding knowledge.

The client also required a members-only section to display member information and store archives for members eyes only. The members home page includes excepts of recent members’ blog posts, coded to feed automatically from the blog.

The event calendar was created with members-only view and a public view. The members-only view displays all event information, while the public view presents the event name, date, time, and a special event organizer email address only. With two views, the public can get a clear sense of the events that organization is producing on a regular basis, while specific event and member information is protected.

The entire site uses responsive design, which is especially important for this organization’s members who’ll need to access the site from a variety of devices. All site contents reformat to optimal views for tablets and smartphones.

Arnold Levinson Mediation website

Arnold Levinson Mediation

Arnold Levinson is a California-based neutral mediator specializing in insurance, contract, fraud, personal injury, and employment matters. This first company website includes a variety of layouts and formatting, suited to each type of content.

Developing this site requires attention on each page to both its similarity to others pages and design aspects unique to itself. Custom content spaces were created in the WordPress administration panels to maintain the variety of layouts without requiring coding knowledge for the client to update content and maintain the site.

The Price of Being Ashley Rich website

The Price of Being Ashley Rich

Aashka Pandya is a young Bay Area writer. Her website was created to promote her first solo novel, “The Price of Being Ashley Rich.”

This new website design is influenced the book design. The flower icon and the display typeface used in the book are featured.

Going big and bold with type, the site emphasizes the written word, supporting the importance the writing of Aashka’s book. With a bright and boxy layout, the design brings a youthful vitality, yet still holds a maturity to appeal to a sophisticated teenage audience.

Coding includes full-width layouts for the home and contact pages, and a two-column template (main and sidebar) on blog pages. There’s also a special featured post section just below the main menu.

Lekha Writing Center website

Lekha Writing Center

Lekha is a writing school and children’s book publisher in San Jose, California.

To coincide with Lekha Writing Center franchising its programs, the original site content is split into a corporate/publishing site and a writing center site.

The design balances the professionalism of the organization with the fun, creative environment they provide. Round-cornered boxes echo the Lekha logo and give separate spaces for each of their varied offerings.

Goals for the new Lekha Writing Center websites included creating a program catalog, adding a blog for making regular content updates, and creating franchise location sites including all that’s needed for a franchisee to run their own locations.

At the core of the redesign is a custom program catalog. With filters to find programs by grade, track, or schedule, users easily find programs to suit their individual needs.

Site management began with Lekha’s previous HTML/PHP site. Incremental changes were made to that design to create a smooth visual transition to the new site.

Lekha Writing Center has events going on throughout the year. Creating content updates are critical to keeping clients engaged. Email communications, online advertising, and social channels are used to find and stay connected with clientele.

San Francisco Lyric Chorus Program Notes website

San Francisco Lyric Chorus

San Francisco Lyric Chorus receives many requests from other choruses to reproduce their program notes. The Chorus needs to make their program content easily accessible to choruses and engaging to the community as a whole.

Composer biographies are given the highest priority presentation, as the first main menu item and the only content type displayed on the front page of the site. The blog-style front page displays excerpts of composer biographies along with a photo of the composer, where available. A featured content space spotlights one of the composers. Works are the next priority, as the second main menu item.

Authors and bibliographies are linked internally as related content on individual composer biographies and articles about individual compositions.

Composer, author, work, and bibliography entries are represented in four separate sections. Each group has their own directory, custom coded to automatically add and alphabetize new entries of each type.

The title and other descriptive information are displayed before the entry along with a featured image, when available. Each type of content uses a slightly different page layout for individual articles according to which content needs to be displayed. For instance, a composer or author article includes a birth date and perhaps a death date, while a work or bibliography does not.

Relationships between articles are displayed at the bottom of each individual post. Composer or author posts have links to that composer’s or author’s works. Work posts include links to the composer and, if applicable, the author. All three page types link to bibliographies, where available.

The SFLC Notes site is built on WordPress’ Twenty Twelve theme, using the color scheme of the main Lyric Chorus site. Additional design supports the custom directory pages, single entry sections and the featured content section on the front page.

Because site content is maintained by volunteers, the administration panels have to easily enable users to access custom functions. Each type of content (composer, author, etc.) has its own creation space along with custom fields for their specific content. Custom fields are carefully arranged, labeled and described to maximize the user’s ability to update the site with a minimum of prior WordPress experience.

Penfold Patterson Research Institute website

PPRI World Health

Penfold Patterson Research Institite (PPRI) is a non-profit specializing in low cost diagnostics for breast cancer and cervical cancer screenings in the developing world. This website, the organization’s first, includes background information on PPRI, their personnel, products and news updates on their presentations at conferences.

The website called for coding an existing design in WordPress. While keeping very close to the original design, adaptations optimize the site for WordPress. The overall design converts to a grid-based layout, especially important for its responsive design. Some design elements not included in the original design are added: the main navigation menu, a two-column blog template. The color palette expands upon the original.

With the updated design, two page layouts are coded, one full-width for most pages and one with a right sidebar for the blog section. Streamlining the WordPress theme creation process enables PPRI to support important upcoming presentations with their new website.

Young Wordsmiths website

Young Wordsmiths

Young Wordsmiths is an online magazine run by Lekha Ink, a writing center and children’s book publisher in San Jose, California.

Lekha Ink started an online magazine to publish writing and occasional video presentations by writing center students. Showing the results of Lekha’s writing programs, the site also serves to promote their programs.

The goal was creating a site which supports the existing Lekha branding, while letting the content take the lead. With WordPress as the content management system, the site’s design is based on the responsive WP-Clear magazine theme.

Custom navigation was needed to best present student projects. The main menu includes the tracks: creative writing and academic writing. The right column includes a dropdown list of student authors.

On individual posts, age, grade, track, program format, teacher, and location identify students and their works and link the user to similar content. For example, the age of the student link to all entries by students of that age. This rich navigation not only allows users to find work of their greatest interest, but also shows the level of work created at the Lekha Writing Center according to each criteria.

Each student entry includes the student’s name in the byline. Because Lekha is publishing through teacher accounts, rather than granting an account to each student, the byline had to be custom coded to present author name.

For social media, entries on the online magazine post automatically to Young Wordsmiths’ Twitter and Tumblr accounts. These channels also support select messages from Lekha Ink itself.

Design and editorial work is an ongoing need for Young Wordsmiths. On the design side, advertising is created to publicize Lekha’s published books and educational opportunities. On the editorial side, content is edited and entered by the instructors and staff, then reviewed for correctness and completeness before being published on a scheduled basis.

Young Wordsmiths successfully presents the work of Lekha’s writers and promotes the quality of Lekha’s writing programs.