Graphic Designer & Illustrator
Website Redesign
Wix / Adobe Illustrator, 2020
Digital Media Production
​
For this Digital Media Production project, we were first tasked with finding a website in need of a redesign. I searched online for local retail stores that had built their own websites or that had not been updated in some time.
​
After finding the site, we were tasked with finding our audience, editing the information on the website, and then planning a layout in Adobe Illustrator. After a plan was in place, we used various website building tools (HTML, CSS, Squarespace, Wix) before building the final site.
Rustology Antiques
Rustology is an antique store in Stafford Springs, CT. The owners frequent antique fairs and purchase a wide variety of antiques to stock the shop. I was drawn to the wide variety of items they collect and sell. Unlike other antique stores in the area, Rustology deals in strange and unusual items. Online they post a lot of images of their recent finds and new shop displays. The volume of images online would help me as a designer build a personalized website for the brand.
Defining the Problem
The current website for the business, pictured left, is both difficult to read and lists outdated information. Most of the text is hard to read due to spacing issues in the code and the font color/size. There is also a link to a blog from when the shop first opened in 2013, but the posts stopped years ago. The page listing "Items for Sale," shows items that have long since sold. If a customer were to look for more information on the shop and see posts years old on the official website, then they might think the shop is no longer open.
​
Rustology's website also highlights links to their Facebook page. On Facebook, the antique store is much more active. They post monthly with images of current displays and changes to hours during holidays. Unfortunately, a google search for the store by name brings up the outdated website before the active Facebook page.
​
A redesigned website needs to help new customers navigate to both the shop and the shop's active social media accounts. To help direct traffic to the active Facebook page, a call to action should be front and center to the user. Location, contact hours, and contact information will be worked into the header/footer, so customers can see the information no matter what page they are currently on.
​
​
​
​
​
Finding the right font
Before starting a rough draft in Adobe Illustrator, I went through all of the store's online accounts to find images for use on the new website. I also copied all of the text from the old site into a Google Doc for editing and organizing. Using the text and images, I could come up with a general outline for how many pages the new site should have and what information should be on each page.
​
After compiling all of the information I needed, I turned my attention to the logo. Rustology's website and business signage both use a hand-painted font embellished with rust and flowing lines. The logo is a JPEG and does not scale well without pixelation. I wanted to find a font that best matched the hand-painted font. In the painted serif font, the leg of the R curves up into a finial like a serif on the S and the L. On Google Fonts, I found a typeface called Playfair Display that closely matched the painted font.
Laying out Site
In Adobe Illustrator, I started by creating a header and footer design using the font I found. I wanted to highlight the many images I found in a gallery, but the photos I found online of the shop were too low quality to utilize in the redesign.
Instead of using images of the shop, I utilized Adobe Stock to find a high-quality image. I looked for an image that matched how the shop displays its antiques for sale in the shop, scattered and stacked across the floor.
​
I wanted the color scheme of the site to match the colors of a rusty antique. I used the eyedropper tool on an image of rusty metal to create a new color scheme for the site.
​
​
​
Adobe Illustrator
​
​
Building a Wireframe
Pencil and Paper
With a basic visual design in mind, I turned my attention to the layout of the website. I started sketching a basic wireframe while keeping in mind my goal of driving online traffic to Rustology's active social media. To do so, I need to keep the website's layout simple.
​
The site will have three basic pages: Home, About, and Contact. Each page will have a call-to-action that will either help guide the customer from one page to the next or directly to the shop's Facebook. The footer of the site will have the basic shop information that customers might be looking for on every page including the shop location, hours, and contact information (email and Facebook).
Building the Website
Wix.com
I wanted to use a website-building tool that the company could easily edit and update if they needed to. I decided to use Wix because it gives them the option of easily adding eCommerce in the future if they wanted to and the edit pages are user-friendly.
I used a rust texture as a background to all the strips on the site so they did not appear flat. The About Page explains the history of the store and the store's buying/selling philosophy. The Contact Page allows interested parties to reach out for more information on buying, selling, and appraisals.
In Conclusion
The final website is clean, organized, and achieves the goal of helping drive web traffic towards the active social accounts for the business. I think the area I was least successful in was capturing the feel that drew my attention to the business in the first place.
If this were work for a client and not an exercise for a class project, then I would have spent time photographing the location and some of the "oddities" that help make the store so special. Not having access to high-resolution images of the shop and relying solely on stock photographs hindered the design process.