Melew Design
a design portfolio | by Meghan Lewis
BarrelTheme-Mockup-BANNER.jpg

Barrel

 

 

Barrel

Wordpress Theme Development

Client: Self
Role: Graphic Designer, Web Designer
Assets Delivered: Illustrator files, PDFs, PNGs

Tools: Adobe Photoshop, Illustrator, Dreamweaver, Brackets
Code: HTML, CSS, PHP
Year: 2016

During my last term at Portland Community College, I decided to take an intense Wordpress development course where we were to create a theme based on an idea. My idea was to create a theme that surf shops would use because of it's simplicity, edgy style, ease of use, and cool use of color. What was really exciting is the name Barrel hasn't been chosen yet, so I may be able to showcase it on wordpress.org after the term is over!

So far, I've created a detailed mockup and a wireframe of where major areas would be located. While it looks rather detailed and complicated, it is actually a relatively easy layout. Most everything is within a div row and rarely are there columns to deal with. (Only when adding a standard left or right sidebar does that come into play.)


BARREL_img-MENU.png
BARREL_img-MOBILE.png
 

Surfing as inspiration for a theme

I began learning to surf this past summer. It may have influenced my decision to create a theme that could be used by surf shops (or surfers who want a certain simplistic style. It was fun to create and learn, and very challenging. I am really glad to have taken this class, it really prepared me for finding work as a web designer with experience in PHP and developing Wordpress.

BARREL_img-CONTACT2.png
BARREL_img-LOCATIONS2.png
 

The Process...

Once I created the detailed mockup of the theme/site, creating the wireframes was easy. Due to my theme idea being focused on row by row of content, it was easy to deliniate where the divs ended and began. I added in sidebars within the main part of the content (the middle of the site.) Might as well provide everything for the end user I think. The more widget areas available, the better. Hopefully it will prove to be worth doing.

BARREL_img-MENU2.png
BARREL_img-ABOUT.png
 

Finishing up + Results

I was very inspired by surf gear websites and my own experience in the water. I even found a ipsum site that utilized surf speak and lingo. Here's an excerpt from that site: "Rail to rail late drop tides he's a legend pumping Kelly Slater, kook closed out? Slab inside position Dane Reynolds in the bricks courdoroy capped out sandbar. Spray pumping fair, soft, Slates. Matty Wilko poor blowing up full mad air reverse full rote waist high. Beat it kook Matty Wilko epic shacked clipped barrels brutal epic? Rocker turning on railwork rail, so pitted reef break out the back. Railwork vertical backside hack split the peak paddle pipeline. Fair urll poor high on the face hack a thon don." Get Stoked Brah!

BARREL_img-LOCATIONS.png
BARREL_img-CONTACT.png
 

Credits

Creative Director: Greg Kerr (PCC Instructor)
Graphic + Web Designer: Meghan Lewis

Fun Facts

This was a very challenging project to undertake. It furthered my knowledge in PHP and solidified my love for Wordpress as a fantastic option for creating websites. My project was used as an example during class, which I found really cool.