Slaap Zacht – Branding and website design

To improve my website design skills and practice my recently acquired jQuery knowledge (self studies), I created an imaginary company that sells beds. For this company I created an entire corporate identity, including business cards, website and logo. Ads will be a future project.

slaapzacht_post2

The website can be viewed here:
SlaapZacht Website.

For an imaginary company, Slaap Zacht, I designed and created a logo, general corporate design, website, and business cards. This company is, as mentioned, imaginary, so I gave it a little background myself. At the bottom on the post (below the Dutch text) you can view some progress images of how I got to the results shown below.

Slaap Zacht (Sleep Tight) is a privately owned company that sells beds. It only has one (big) store in a big city and prides itself with high quality products and service. Their employees will go far to find you the perfect bed within your budget. No customer should leave the store feeling dissatisfied. They sell everything from regular one person and two person beds, to water beds, box springs, beds for children and bunk beds.

For the website I decided to go simple. Since high quality service is one of their key traits, the website should reflect this, making everything easy to find and focusing on the products. The home page is kept short, with most of the attention pointed towards new items in the collection by means of rotating images (with prizes and details), followed by two highlights from the current discounts and the information needed to find and contact the store, as well as the times of business. This store does not have a webshop. More blocks of advertisements can be placed on the home page.

Programs and skills used: Balsamiq for wireframes, Adobe Illustrator for logo and thought clouds, Adobe Photoshop for mockups and images, HTML/CSS3 used for website, and JavaScript (JQuery) for the image slider (home page), pop-up (products) and accordion menu on the information page.

Het logo.

The logo.

 Full home page with content examples. (click for larger image)

Full home page with content examples. (click for larger image)

Visitekaartje / Business card

Visitekaartje / Business card

Voor een imaginair bedrijf, Slaap Zacht, heb ik een logo, huisstijl, website en visitekaartjes ontworpen en gerealiseerd. Dit bedrijf is, zoals genoemd, imaginair, dus ik heb het bedrijf zelf een achtergrond gegeven. Onderaan deze post (onder deze tekst) zijn een aantal afbeeldingen te zien van het proces om tot de resultaten hieboven te komen.

Slaap Zacht is een eigen bedrijf dat bedden verkoopt. Zij hebben maar één grote winkel in een grote stad en onderscheiden zich met hun hoge kwaliteit producten en service. De medewerkers gaan ver om voor elke klant het perfecte bed binnen het budget te vinden. Geen klant verlaat de winkel ontevreden, is het streven. Ze verkopen alles van gewone één- en tweepersoonsbedden tot waterbedden, box springs, kinderbedden en stapelbedden.

Ik heb ervoor gekozen de website simpel te houden. Hoge kwaliteit service is één van hun hoofdkenmerken, en de website moet dit reflecteren. Dit houdt in dat alle gewenste informatie gemakkelijk te vinden moet zijn en de website zich concentreert op de producten. De startpagina is kort gehouden, met de meeste aandacht gericht op de nieuwe aanwinsten in het assortimenten aan de hand van een roterende afbeelding (met prijzen en details), gevolgd door twee hoogtepunten van de huidige acties en de benodigde informatie om de winkel te vinden en te bereiken, en de openingstijden. De winkel heeft geen webshop. Er kunnen meerdere blokjes met aanbiedingen of hoogtepunten op de startpagina worden geplaatst.

Gebruikte programma’s en vaardigheden: Balsamiq voor wireframes, Adobe Illustrator voor logo en droomwolken, Adobe Photoshop voor mockups en afbeeldingen, HTML/CSS3 voor de website, en JavaScript (JQuery) voor de image slider (startpagina), pop-up (assortiment) en accordion-menu op de informatiepagina.

De website kan hier bekeken worden: SlaapZacht Website.

Project completed: 23 May 2014. (started on 19 Feb 2014).

 

 

—- Progress examples. Click on the images for a larger version. —-

Colour palet for the corporate identity.

Colour palet for the corporate identity.

Sketches and drafts of the logo.

Sketches and drafts of the logo.

Home page as seen on a computer screen.

Home page as seen on a computer screen.

Inventory page wireframe. (made with Balsamiq)

Inventory page wireframe. (made with Balsamiq)

Complete home page wireframe. (made with Balsamiq)

Complete home page wireframe. (made with Balsamiq)

Posted in Websites

Twitter feed