Image

DorianWorks

HOME   |   LANDSCAPE ARCHITECTURE   |   UX DESIGN   |   GRAPHIC DESIGN

The Challenge

Dorian was referred to Dr. Kimberly Ellison by a church member at his home church in Atlanta, Georgia. She is based in Texas, and is a motivational speaker and etiquette coach to young ladies. She was in need of a website with Store capabilities, and a presence on the web that allowed her to sell her product to the masses.

So, Dorian contacted her to discuss the specifics of what she needed. He first had her to fill out a Questionnaire via the Unhindered Creations website, where he received the necessary info such as her Mission, Vision, Colors, websites that came to mind, and more. After setting up the Contract, and initiating the project and communication protocols (via the Slack platform), his role was specific, but yet sure:

  • A) Logo Refinement
  • B) Website Installation + Mockup Creation
  • C) Website Design
  • D) Delivery to Client + Training

A) Logo Refinement

Dorian then went about re-creating her existing logo (as it was too small, and looked distorted on retina displays). You can see the re-creation of her logo at right. Truth be told, after the logo was created, he heard from Dr. Ellison that she was going to go back to her previous graphic designer, and have the existing logo revised so it will be large enough to be shown clearly on retina displays.

Dr. Ellison Logo: Refined (Dorian's Version)

Above: Dorian’s version of the Ellison Logo (created in Autodesk Graphic and Adobe Photoshop)

Dr. Kimberly’s Original Logo

B) Website Installation + Mockup Creation

Once the logo was approved for the website, Dorian went ahead and initiated the WordPress installation, purchased the theme on behalf of Dr. Ellison, and successfully installed the theme on her website domain (as she already had her Hosting and Domain Plan established). He then made sure everything within the theme was working correctly, and began creating a mockup of the proposed website.

Based on the Questionnaire, she mentioned several websites that she especially liked, and Dorian looked at several of them as her “competition”, as there are quite a few ladies like her nationwide who are doing the exact same thing. However, by finding that her colors were purple, turquoise and white, he established the mockup of all her pages based on what specifically would fit her company. You can access the mockup of the then “proposed” website via the link below:

“Ellison Website Mockup” (PDF; 0.2 MB)

C) Website Design

After collaborating on the proposed pages and navigation links via Slack, Dorian launched into “design mode” within WordPress by creating a Coming Soon page (which was the only page that was LIVE to the public during the entire design process), then creating and designing all the pages for Dr. Ellison. All pages were responsively designed per Google standards (for desktops, laptops, tablets, and smartphones), and the colors and navigation were established in the header and footer of the website, and a simple white background was established for the body of all pages. Certain practices of User Experience Design were observed, such as maintaining a “clean and simple” look throughout the website, establishing Google Analytics into all pages to observe website traffic, establishing titles, keywords, and page descriptions into all pages, providing strong contrast between menu areas and text, making sure that all text (titles and paragraphs) were readable by everyone (especially the middle-aged and older), and more. The usage of Google Fonts helped to make sure that her website stood out from others in the same industry.

Dr. Ellison also sent in her own photographs to Dorian, and he made sure that all of them were resized appropriately to optimize the loading times of the website. All images were sized down as web images in Adobe Photoshop to the general size of 0.3 MB (or thereabout, as a general rule of Dorian’s), while making sure that the quality of the images were not lost. During the entire process, he consistently sent Dr. Ellison updates via the Slack platform, along with email in the evenings, and he also answered any questions she had via phone.

Finally, the last (and most complicated part) of the entire design process was the creation of the Store. It was created using the WooCommerce plugin, which, while free, is probably the most complicated Store software available to date. Several shirts were inserted in such a way where Dorian had to figure out how to place them in there in not just Small, Medium, Large, and Extra Large sizes, but also in various colors and prices as determined by the products being sold. Dr. Ellison’s other products were also inserted, such as her Booklets, Training Materials, and Tickets to her upcoming events.

Once all was said and done, her website was made LIVE to the public! You can visit her website via the following link now:

http://www.drkimberlyellison.com

As seen on laptops

Ellison Website: Smartphones

As seen on smartphones

D) Delivery + Training

After the website was made LIVE to the public, Dorian then setup a Conference Call with Dr. Ellison and one of her associates via Google Hangouts, and was able to visually show her how to do basic things on her website, such as posting to her Blog area, how to navigate within the WordPress platform, and how to change out graphics on the Home Page, amongst other things. He even created a tutorial on how to insert products into the Store; however, he did let her know up front that it was quite complicated! You can view the tutorial he created here (which was created in Evernote).

Insights

“All in all, it was a great learning experience for me because it was the first time that I actually ventured into the realm of creating a Store for a client. Secondly, I learned a lot from Dr. Ellison in terms of what she was seeing when it came to the “look” of the website. She had her Vision of what she wanted, and for me to have been able to create what she was “seeing” already in her mind was an honor and privilege.

I also learned more about Google Fonts, and how good some of them were for reading paragraphs, while others were very good for titles. This experience also helped to refine my communication skills with the client, and with future clients by being able to more fully explain why certain things looked the way they did. In essence, it was a great learning experience.” ~DJO

Dorian J. Owens

HOME   |   LANDSCAPE ARCHITECTURE   |   UX DESIGN   |   GRAPHIC DESIGN

djo@dorianworks.com   |   404.908.9502
© 2019 Dorian J. Owens