Tuesday, April 26, 2016

Communication artifact: Swig website


I created the website revamp for Swig, a local beverage company. Our website redesign can be found here: http://sprex2.wix.com/swig. I used many of the axioms of web design to create the website. The previous website, https://www.swignsweets.com/, needed a lot of help to make it more visually appealling to our audience. Here is a screenshot of the original website:


The original website had bright colors that do not translate well to a website. Elements of the website look pasted on sloppily; even the logo is cut off. The colors and design on the original website look like they were designed by an elementary school student. In my website redesign, I wanted to maintain the colorfulness of the original, without the "cheeseness" while keeping it intuitive for first time users. Our logo was designed to look like a drink from Swig getting mixed. The background of the first panel on the website incorporates movement and subtle swirling colors to have an effect of mixing. Most of my inspiration for the website was from our revamped mantra: "Mix it up." 

One of the first axioms of web design is a strong grid system. I incorporated a vertical grid system that works well with scrolling on both computers and cell phones.



The original website did not make me think of Swig drinks or trying one of their cookies. On their home page, there was no images of their drinks. The image of the cookies on their front page looked like cardboard rather than the delicious cookies they are in real life. In my website, I incorporated images of Swig drinks in the sun and also a more appealing picture of their cookies that Swig had buried on their original website. 




I also incorporated subtle movement on my page so it looks like a drink with bubbles from Swig. My objective was for the homepage to drive potential customers to Swig. So I made the entire homepage look "appealing" and ready to drink. Using other axioms of web design, I alternated sides that the pictures and text was on to drive eye movement down the page in angles. The design is aesthetically pleasing and is easy to use. I used contrast in colors and fonts to drive eye movement. The entire reason the website needed a revamp was to make it look more modern for our objective customers. 

All of the colors are consistent across the revamped design of the cup and new logo as well. 






No comments:

Post a Comment