Research blog

Hi! My name is Rikke, and I'm from Denmark. This blog contains my researches, improvements and works in relation to the course "Graphic Design Project", wintersemester '17/'18. This course is a part of my Erasmus+ exchange programme at Fachhochschule Salzburg in Austria. At my home university I study design-engineering (product development) and I'm currently on my fifth semester (out of seven). In high school i took a class called "communication/IT", where I learned about bacis communication strategies and skills in Adobe Photoshop and InDesign. Other than that, I have no prior experience with graphic design. Project 1 is made in collaboration with Jinjuthar Lekklar (Tem).

[rrousingn]

Shared with Dropbox

Client presentation consisting of research, process, and final designs.

[rrousingn]

Website trends

By searching on “best websites of 2017″ I found AWWWARDS’ “sites of the day”-nomination-page. On these pages, automatic movements are a clear trend - websites need to automatically tell a story which illustrations, videos, pictures or/and words.   In a long time, trends have been that movement equals noise and annoyment. Honestly, in high school, an unnecessary movement was flaunted upon.  Nonetheless, this points to the direction that a still-website could seem very boring. This is why I stand by my opinion and the choice of a little movement on the front page. 

Source: https://www.awwwards.com/

[rrousingn]

About the competitors

I have chosen three of the bigger product development companies in Denmark. Much more is out there. Each example will be presented with a homepage and a section page. 

Attention:  Uses a dark navy-blue theme. Starts their homepage by showing a product they have developed and their development-model (discover, design, detail and deliver). Their slogan is “developed with Attention”. Generally, their pages consist of some text and a picture of their employees working. Attention can be found on both Facebook and LinkedIn, which they use to spread the news about the industry by linking to a blog they run.

Eye-d Innovation:  Eye-d Innovation has a green theme, however, the webpage is mostly grey which makes it neutral. On the home page, their menu-bar is in the bottom.  The section layout is a little different - a bit more classic, with a picture first and below that are the text. Eye-d Innovation can only be found on LinkedIn, only are a “company-page” without any posts from themselves. 

MOEF:  MOEF’s website is a bit more business oriented - both they also work with both business- and product development. They don’t start their front page by showing off their products, instead, they show the text “The Innovation House MOEF - we create success through business development, product development, and communication”. Under this, the present some products.  The “business”-theme can also be seen in the section pages, on every side, there is contact information, in case of questions.  MOEF can be found on Facebook and LinkedIn. However, their posts are a bit more personal compared to Attention’s. MOEF presents their employees, their core competencies and how they work with projects in their every day (”a day in the life”-posts). Furthermore, they also post “industry-news”.

Sources: eye-d.com, attention-cph.com, www.moef.dk

[rrousingn]

The website so far. Decided to make another button for press releases and the video log. Also, in relation to earlier work, I decided to drop the showing of subsections in the menu - the viewing of it was either too big, too ugly or took up too much space on the site. Here is the dark blue, medium blue and the yellow color from the color palette used (besides from black and white).  The website is designed to be as simple as possible, to maximize the opportunity of showcasing - the products are what Rousing Developments specialize in, therefore these are very important. Also, the menu is made, so that, when it is not in-use, it will disappear, leaving more “white” which add simplicity and elegance. This design would easily be converted to mobile-format instead of the computer.  The text on the front page, will (at least before a live and moving website can be made to test the function) move as the pictures are changing.  These pictures illustrate the way from the front page to a subsection and how the website will respond (menu color changing and so on). 

[rrousingn]

Trying out different kinds of menus for the website - both vertical and horizontal. 

[rrousingn]

What to learn about others greatest brand failtures?

It is quite entertaining to read about failed attempts to expand to other markets in other countries. Making fails such as translating “It takes a tough man to make a tender chicken” into “It takes a sexually stimulated man to make a chicken affectionate” is never fun, however, it makes a good example of the need to research markets, traditions, slang, language, etc.. 

Most of this I have been warned about from my home university since it also applies to product design and e.g. symbols from e.g. colors.

Source: https://www.inc.com/geoffrey-james/the-20-worst-brand-translations-of-all-time.html

[rrousingn]

A Great Brand Design - how?

In the article “12 principles of Great brand Design”, John Rampton mentions different essentials for good brand design. After reading Logo Design Logo, the most is already known. However, a couple of principles stands out: 

Ensure it works on multiple platforms

Stick to no more than two colors Besides black/white. 

Leve plenty of white space The overuse of colors can be hard to make out from a distance.

Choose warm or cold tones Remember the symbols in different varies of the same colors. 

Put some of “you” in there “Let your uniqueness leak into your branding” - only when it is about your own company, of course. 

All in all, this all leads back to simplicity. However, the part about two colors got me thinking - in all of the work I have done till now, I haven’t been able to fully incorporate the beige color from my color palette, therefore this will be taken out before the final hand-in. The same goes for the light blue color. I’m not sure about the medium blue because it works well on the business card, therefore it isn’t a problem at the moment.

Source: https://www.forbes.com/sites/johnrampton/2014/11/14/12-principles-of-great-brand-design/#430bd80b7032

[rrousingn]

Content strategy. From ideas to choices, the blog was removed - the video log, for me, is the better choice. They can be made shorter, less time to see and most other companies run a blog. 

[rrousingn]

Working with different layouts for the front page - from the classical to the very simple. Going from saying “dare to be curious” to “are dare to be curious” to “r’ curious” - like I wanted. This way, the projects are easily showcased. When the pictures are changing, the word “curious” will probably change as well between curious, unique and diverse. However, this would need a test run - if it is really distracting, this attempt would be scratched. Another idea could be to only change the word when the website is “updated” (or refreshed). This way, it wouldn’t seem distracting.  

[rrousingn]

Moving the process from hand drawings to InDesign - trying out the different drawn layouts first in “wireframing”-style, afterward with different colors. Trying out different contrasts between the colors in the color palette. Next step is the final content strategy to decide what should be presented on the website and how. So far I have decided on four “sites” - service, products, about us and contact. I’m debating whether or not the company should run a “news”/blog site - most other companies in the industry does it, however, all of theirs are text with more text, so I have been considering making it a video site.

[rrousingn]

Working with the website mock-up, first by hand and then in Indesign. 

[rrousingn]

The following typographies have been chosen: 

Big Caslon (the left) Used for the logo and title-headlines. Serif-type, which pairs well with a Sans Serif-type

Avenir (the right) Used for basic sections. Sans Serif-type.

Both types are easily readable. With the serifs, Big Caslon is a bit more formal and hard to look at, whereas Avenir is more “rounded”. Both signals professionality and are otherwise neutral. However, the numbers from Big Caslon are placed in different levels which makes them “messy” to look at - this could be annoying for the main text section, therefor Avenir is chosen for the basic sections. 

[rrousingn]

Designing the business card. The top three will be the three “types” of business cards - so people will get different cards and feel special because the cards are different (personal cards). All the others are different attempts trying out colors and designs for both the front and back.  The goal of this business card is to break the typically “clean” card. With the choice of dark blue and yellow and a “clean” card, it began to seem snobbish and royal -  this will not help a new business attract customers. Therefore the “drawing” behind the text is a try to break these feelings and exchange them with creativity and “fun”, but in a professional way (if that makes sense).

[rrousingn]

Photoshop Tutorials - Paper Cutout Text Effect

This Photoshop tutorial will show you how to apply this paper effect to your text or lettering. The step-by-step format will help you recreate the effect whe...

Learning to make a paper-cut effect using a lot of shadows for my business card.

[rrousingn]

How to create a grain / noise effect in Adobe Illustrator

I want to create a noise effect using Adobe Illustrator. Inside the hexagonal shape there is some kind of texture effect, I don't know what the name of this effect is: How can I create such an ef...

Learning to add simple texture to a box in Illustrator.

[rrousingn]

How to Cut Out an Image in Illustrator

If you think Photoshop is the only program that allows you to cut out images, think again. In this tutorial, I show you how to use the pen and clipping mask ...

Learning how to out of a part of an image in illustrator for my business card. 

[rrousingn]

Working with different layouts for the business card, first on paper, then in Illustrator. For now, only in black/white to find the layout.