Business Card: Evaluating

Business Card: Evaluating

Measuring Success

To evaluate my success, I should look if it has transferred the message. Does the logo look smart, elegant. Does the logo feel optimistic, friendly, cheerful? Is the mnemonic easy to be noticed and does it make the company name easier to remember? Does the font look simple, easy to read, and friendly to the eye? Does the design on the back attract attention, make it unique and recognisable. Does the layout on the front have harmony - Does it look neat, organised, appealing and comfortable and nice to look at? Do the colours and gradient feel smart, exciting, trustworthy, and professional? (Does the change in size make it look more "perfect", balance, good-looking?

Evaluating Success

Feedback

• When first seeing the logo, most people recognise it is a face, but 3 or 4 thought it was a swan (which I knew people would, which is elegant).
• They felt weird when the lines are all curvy, and things looks smooth and elegant, and the work "industrial" came out. This isn't much or a design problem as it is a purpose that it is made smooth and elegant, to cover the actual thing of manufacture. I should just maybe consider myself as "designer engineer" or just "designer".
• The card doesn't exactly suit my job. It looks more like a doctor's or a dentist's business card.
• The box that only has three side completed didn't look so good. (My idea was to make it like a tab coming out from the side, but they thought it makes it look uncompleted). Four sides making a sealed.
• The corners on the back looks kind of empty (I don't agree much with that, the main attraction is in the centre and if more is added it would be too much, and there isn't much to add)
• The logo looks elegant and happy.
• The face looks smart and confident.
• The blue have a sense of hope, like the blue sky.
• The front is organised, tidy, and is good to look at.

Personal Thoughts

Yes, I think the logo blue, shining eyes look very smart, and adding the small smile there (eye), looks trustworthy. The whole logo definitely look very cheerful , optimistic, and friendly. Orange give a sense of fun, while the lines are all curvy, looking organic and smooth, light, easy, relaxing. It does look kind of like a swan so its elegant. Also, it has a big grin and a smile in the eyes. I think the S across might be a bit hard to see, but the rest of the mnemonic is quite noticeable. I think once you notice it, the whole smartness, trust, grin, and the name should be tied fondly. I think the font is pretty good, and it makes it look more like a business card because most cards and some formal things use it. So that the whole card doesn't just look "fun" and impractical. The logo on the back is quite good. The layout is great, there is enough white space. It is organised when the logo is on a side, and the information on the other. However, balance is okay remained because their size doesn't vary a lot but the text might seem like many things when a logo is one. The fact that orange feel heavier did help a bit.

I agree it's kind of like a dentist business card. I think it might lack some corners and squares. I also think the blue was too much on the bright side. Also, the grin on the logo might just be too big, "seems like half of the logo is on the grin so maybe there's something to do with the mouth..." but there wasn't, so not too good there. I think the lines on the back does look appealing and smooth, but then it start to look like lines on a notebook, kind of annoys me a bit. Also, the white might just have contributed more to the dentist part. There might be a little too much repetition for the logo in the front and back, especially with the fact their sizes are similar. It might be okay, doesn't seem to bother me a lot. I think the colours look smart, and cheerful, not very professional because there is very tiny bit of grey (the gradient and font helped with this aspect, but still it's not calm enough, cool but not calm). Except the blue looks too "dentisty". A mistake that wasn't intentional is that the front have too much orange when it's only suppose to be about half. That was because I was working with a too-big-bleed, and I didn't saw that when I zoomed to normal and check because the bleed did had a lot of blue. I think that has to be fixed before printing, short-term stuff to fix but important. It doesn't look very technological as I wanted it in the brief.

So for myself, I'll give it a 70%.

Improvements

1. I think I should change my position into "Designer Engineer". I make this change because a smooth, elegant, smart, and cheerful design doesn't fit industrial. However, there is no way we should make it look like factories, square, and pollution, that doesn't help people buy products. Therefore, I will turn it around and make my position fit the branding. Which would "Design Engineer" because design comes first but engineer also comes as a part of my job, I don't just design, so I don't want to take that away.
2. To solve the problem of it looking too much like a dentist's card, I think I should make the mouth of the logo smaller so the focus doesn't go too much to the oral part. Also, the blue on the eye I can keep maybe, but for the rest of the card, I am going to tune the blue to less green and less bright.
3. To solve the problem that the lines on the back look too much like notebook lines and complicated, I propose three ways to improve and see which is the best a) turn the opacity down b) delete the lines c) Put a small logo on right corner and thicken the lines a bit. Turning the opacity down might help make it less complicated but will still look like a notebook probably. Deleting the lines will make it much simpler, but then it might be too empty. I would make the colour a dark one, maybe brown, and no gradient. Some flatness might look good because. And the brown seems lacking and it contrasts with the logo, so it's mainly for visual affects, not branding. Putting the logo out of the way but making sure it is there. The lines might look good by themselves but then more movement and 3D will look much better. It might also get rid of the repeating logos on both sides of the card.
4. There is too much orange on the front side and the gradient was hard to see. To solve that, I would put back the exchange point of colour as 50%, in the middle. Or adjust it if it's not good.
5. To make it more technological, it might need like a redo. Because this card is no where close. I imagine it to be more straight lines with round corners and grey a darker green and blue gradient. But now I think that I'm more of a designer first. However, still, the company isn't all about design, so some feel of technology is needed.

Impact

Our company sells electronics that is used in a person's daily life. We want to transmit the idea that we can make their life better, and I think the smile in the mouth and eye does express it. I mention smart is the human's goal now in the design brief and we want to express it and the blue and the blue eye helps. Although we mentioned about fifty-year old people, this card mainly focuses on teenagers and people in twenties. They seek excitement and orange is exciting. Some 40-50-year old might also be interested, but the card is not as much speaking to them. It doesn't look very luxurious though, and not very cool, maybe more grey could help. I mentioned that our clients love technology, and that is true, but I notice companies like samsung and apple and LG don't put a very technological look in it. It attracts attention; It has mnemonic device to help it be remembered; The colours are basically the colours of the company logo so they should be associated and easy to recognise. It fulfils my design brief okay and is probably going to be recognised and help the branding and feel for the company not too bad. Except it fit adults less and it's not luxurious or technological.

Business Card: Creating the Solution

Business Card: Creating the Solution

This whole project which has totally four phases is about communicating our future identity, our future job, and how branding will help us. We pretend that years later our class or grade are having a high-school reunion, and we are going to communicate our identity with a business card.

In the previous two phases, I have already done research, learnt the programs I will use, and planned a design. In this phase which is creating the solution, I will be creating my final product, but in this post, I will teach you how to make your business card based on mine by providing instructions.

Note:

1. Download Adobe Illustrator (CS6) first of all.
2. Please remember to always save your work.
3. Feel free to do it the way you like. This is just a reference and the contents are for my product.
4. If you have a question about the instructions that you have another way of doing it, you can do it your way. However, the instructions are what I recommend and that I think are the best and easiest ways.
5. I recommend you to revisit and review previous text or videos if you do not understand or forgot how to do something.
6. I recommend you to finish reading all the instructions before starting to work on it.
7. There will be keyboard shortcuts and stuffs which will be explained only once or twice. You will be expected to remember how to do so and what do you do it for.
8. My card is not standard size but is very close and should fit in business-card books and covers easily. Just note, if you are doing another size, you will have to count some grids yourself.

This is the final product for my project. I "would" be an industrial engineer in an electronics company named SLS (something like LG, Samsung, it's mentioned in the 1st phase - Inquiring and Analysing), and SLS value quality, simplicity, and innovativeness the most. This is the final product:



Before I started making my own business card, I was playing with Illustrator and found this tutorial for making a logo (it's a random logo):
https://www.youtube.com/watch?v=vsBhoa4OidI
I am a beginner but at that time I knew very little and I was having a little hard time following. But it gave me a chance to explore other tools, and it gives you practice especially for the few tools it uses. If you are also a beginner, you will probably feel very satisfied too. And it only takes about an hour or so. It is a very good practice, and you will be good to go afterwards.

This website have many different tutorials, and will teach you step by step, but would take some time:
https://helpx.adobe.com/illustrator/tutorials.html

The Solution

We are going to make this product in this project:

1) Process Journal

1. Create a file

In this step, we are going to end up with a file like this.

After you open Adobe Illustrator CS6, go to the menu bar, click "File", and click "New...". Or, you can press ⌘N. Then, a pop-up window should pop up. On the top, give your project a title (this page will be the back side of your business card). Below, choose "profile" to be "print". For Number of Artboards, 1 should be enough. Below size, width should be 84.58 mm, and height 55.12 mm (use the two measurements if you follow me, but remember they are not business card standard size). Set the units to Milimeters. Then choose the horizontal rectangle for orientation. For bleed, go to the very right of the row and hit the chain-like button to make allsetting the same. Then, type 3.175 mm in one of the boxes in that row. Afterwards, Click arrow beside "advance" if it isn't pointing down. Then, colour mode would be CMYK because it is for printing and you want to print your card (unless you don't) (If you click RGB profile will no longer be "printing". The four colours of CMYK is blue, red, yellow, black. Below colour mode is raster effects. Choose at least High (300 ppi) to ensure quality. Set preview mode as default. There is no need to Align new objects to pixel grid (and I don't really know what it is).

When you are done you should see a white surface which is what the card would be, then outside, you should see a red stroke of a box which is your bleed.

Before we start, you should learn the very basics of moving around: ⌘+ is zoom in (no need to press shift, you can otherwise say it's ⌘=), ⌘- is zoom out, on a mac, scrolling is moving around, other wise press shift and drag.

2. Create the logo

In this step, we are going to create this logo.

First, go to your back page file. Then, go to "View" and hit "Show Grid". And it should show the grids.

Even though we set the unites to millimetres, you will probably find out the grids are still in inches (at least that is my case). That doesn't matter much. Now, the thing here is that we have to know where is the centre and where are the "middles". If you count across horizontally, there are what looks like 26.5 or 26.75 grids (on the white surface), let's say it's 26.6. Therefore, the centre 13.3. And from up to the bottom is 17.25 grids. So half would be about 8.6 grids. There are two ways you can knows the centre and middles:

This file is for the back side of the business card. Before we start drawing anything else, click "File" and click "Save a Copy..." in the column below. A pop-up window will pop up. This is going to be the front page, rename it according to yourself. I prefer to put it in templates. And choose format as "Adobe Illustrator (ai)". Click save, and it will bring you to another pop-up window. Do not change anything and just click "OK". Then you can ignore the new file until step 4.

When you start making the logo, use the pen tool to draw an arc facing down, and then next to it going up. Now, select width profile one. Then, deselect by clicking into an empty space with selection tool. Then, use pen tool to draw the left half of the smile, then the right half, then the a curve to the eye spot (going to the left). Then, draw a small curve to the right and then finish the eye with one more curve (do not completely close up the eye). Draw the nose with straight lines. To add colour, use the pencil tool to draw inside the strokes. For what you drew with the pencil tool, put fill for it but no stroke. And then ⌘x to cut it, then ⌘b to put it at the back. For clearer instructions, please watch:

*All strokes should be 1 pt.
*In this business-card back-design, it would be better for the logo the be round or square, a little flat or thin is okay, but too much will not fit this business-card back-design.

After some practice, you will hopefully make a good logo. Remember to choose all the parts of your logo (by pressing shift while choosing the parts), right click and group the parts to a whole. Do not worry about having to adjust things afterwards because you can ungroup it just the same way as you grouped it. Now, we are going to put the logo in the centre: ⌘C, then ⌘0, then ⌘V. All left is the adjust the size of the logo: Hold ⌥shift, use your curser to hold one of the corners of the blue rectangle and move your curser. By doing this you can adjust the size but keeping it the same ratio and ⌘C (copy),  maintaining where the centre of the logo is. Adjust until the logo is 6 grids tall - a little more than a third of the height of the card.

3. All of the Back Side - Logo, Lines and Background Colour

In this step, we are going to have our whole back side done.

As we have already created the logo at the back, we can just move on. If you left any useless lines and whatever, just delete it. However, do not delete the "Middle lines" and the "Outside box" we drew at the second step.

We are first going to put the background colour. First, draw a rectangle from one corner of the bleed to the other. ⌘x then ⌘b to make it go behind everything. Select it and on the left tool bar make it no stroke - click on the hollow square and click the button below with a red line. Then, click the solid square and click the button below with a gradient white and black. You have just applied gradient to the rectangle you drew. On the right, there is another bar, click the two arrows if they are not pointing right. 

Now you have the bar you see on the image (right), go to the gradient bar, and choose type: Radial. You should see a grey "colour scale" thing. There will be two boxes below. Click the one on the right which should be in black, something will pop up. Go to the top right and choose CMYK. Now adjust the colour with the percentages as shown in the image below (right).

Now adjust the gradient slider (the tilted square on top of the "colour scale) to the spot like in the image below.

Now you should have this:

Now we are going to add the white lines which are going to look like this:

And we will end up with this:

First of all, select your logo (which is hopefully grouped already) and move it outside of the bleed. Now, using the pen tool, draw the curve that goes across the middle horizontally, using what you already know about the pen tool and according to the image above. Make it so that it has stroke but no fill. Make the stoke white in colour. Then, choose the width profile one which have light ends for the lines. The lines should be 0.7 pt. Copy-paste the line/ curve you've just drawn. and put it above the original one, paste one more and put it above, and paste one more and put it above. (It doesn't have to be above, depends on the position of your original one). Draw the other "S", the big one using the lowest horizontal curve. Set it so the way you set the horizontal curve. And the copy-paste it above, then above, then above. Then draw the "L" curve on top of the highest horizontal curve. Then copy-paste it below, then below, then below.

* It doesn't actually matter how you copy paste it, or if you draw all three then copy-paste... As long as the correct lines connect. Also, refer to the image above to see how the curve connect to each other smoothly.

Last thing in this step is to delete the "middle lines".

NOW YOU SHOULD HAVE YOUR BACK SIDE DONE !!! :)

YOU BACK SIDE!

4. Front Side Part a) - Logo, Slogan, Background Colour

In this step we are going to end up with half of our business card done.

Open the file for the front of your business card. Then, press ⌘0 to make the page reset the size if you zoomed and it should centre the card. Once you did that, Copy-paste your logo from the back to the front and group it in the front. The logo should be in the centre. Double-check if the logo is grouped, if not, then do so.


Before we move the logo to the right spot, we are going to add the slogan. Use the type tool which is 3rd row, 2nd column, or just press "t" on your keyboard. Type inside the slogan, my slogan is "SLS Simply Live Smart". When you finish typing, highlight the text and make sure the following settings. At the left, set with black fill, but no stroke. On top, opacity should be 100%. For "Character", I used "Avenir" for the "font", "Light" for the "font style", and I typed in "8.23 pt" for "font size". Since I thought Avenir light looked a bit flat, I did some tracking so that the kerning (space between each letter) is closer, so it doesn't look as flat. To make them closer, press ⌥shift<. I pressed that 3 times, and for me that looked the best. Move the text box under the logo. Select the logo and the slogan. Then, go up to "Align" and choose the second one from the right, which should be "horizontal align centre" if you put your curser there long enough. After that, use the up and down arrow to adjust the distance between the logo and the slogan until it looks good. Select the logo and the text, and group them together.

*The following step is to make the logo together with the slogan, in the centre of exactly the left-half side of the card.
*As you grouped the logo and slogan together, I'll call it slogo now, just so the sentence are short enough.

Select the slogo press: ⌘C (copy), then ⌘X (cut), then ⌘0, then ⌘V (paste). Now the whole thing is in the centre. Make sure the slogo is selected. Then, hold ⌥shift, use your curser to hold one of the corners of the blue rectangle and move your curser. Adjust the size until: from the top of the eye to the lowest part (descender) of the "p", it takes up 7.25 grids. Now only use the left arrow key to move the slogo only to the left. Can you see that "middle line" we drew at the beginning? Move the slogo until (the space between the slogo's left edge and the card's left edge) = (the space between the slogo's right edge and the "middle line"). Now sorry for the complicating language, but I think you get it.

/\ Now you should have this

Now, we have to apply the background colour.
First, use the rectangle tool to draw a rectangle from one corner of the bleed to the opposite corner of the bleed. Set the rectangle to no stroke, but with a gradient colour-fill. Go to the gradient bar on the very right of the window, and choose type: Linear. You should see a grey "colour scale". There will be two boxes below. Click the one on the left and something will pop up. Go to the top right and choose CMYK. Now adjust the opacity and colour with the percentages as shown in the image below (left). Click the one on the right and something will pop up. Go to the top right and choose CMYK. Now adjust the opacity and colour with the percentages as shown in the image below (right).

The location of the this tilted rectangle should be 50%. The rectangle actually determines the point the colour changes.

The opacity of the blue-coloured box should be 60% and its location should be 96.8%.

The opacity of the orange-coloured box should be 40% and its location should be 18.18%.

5. Front Side Part b) - All Information and Text

This is our last step. And we are going to finish the front side. Meaning by then the whole business card will be finished.

For now, keep your grids on, and we are going to draw that rectangle box. Watch the video below for the measurements, and how to draw it:

Now, put your name inside the box. I capitalised my name, it's up to you if you do so. Set your text. For me it's: With black fill, no stroke, opacity 100%, Avenir, Medium, 15.5 pt. Make sure you leave some space to put you position next to it. Create a new text box. Positions will usually be two words, so type the first word, then press enter, then type the second word. Set the text, and adjust to the right side. I used: With black fill, no stroke, opacity 100%, Avenir, Heavy, 6.5 pt. Select the position text box and move it to the right of your name. Highlight your text in that box, and press ⌥shift< twice to change the kerning so it doesn't look too flat.

Create a new text box, and type in all the other info. The company full name, the address, your email, mobile, direct, fax, website... And I would recommend between each kind of information you press enter twice and leave a line there. The text I recommend: With black fill, no stroke, opacity 100%, Helvetica neue, light, 6.94 pt, and in "paragraph" select "align left". For those spaces between each type of text, make them 3.75 pt instead. now ⌥ shift< once. Now, you might notice on my business card I have like "email, mobile, direct". Do not type this in for your first text box.

Create a new text box, and type in the names for the information correspondingly (I think only the contact info needs it), and of course press give a new line each time. Then, highlight everything and set everything the same, except for the alignment. The alignment should now be left. Also ⌥shift< once if haven't. To align the name you basically put it on top of the information and align them, and then press the left arrow to move them to a spot you think looks good.

All you have to do now is take away the two "middle lines". But not the rectangle. Otherwise, when you print it you won't know where the card really ends at.

WE HAVE COMPLETED OUR BUSINESS CARD!

At last, click export in menu bar and export it as the format you want it to be in. I think it would be the most convenient to export it as common format such as jpg, png, tiff...

4) Changes

Although I made my choices clear in the developing ideas phase, I played with my other design idea for the back - the one with the lines. It was because the back looked very plain (especially when it's not on a paper which would add texture to it). They were originally black...

I didn't really mention that I was going to put colour in the front or the back, but then in the process of making I found that it was a little too blank, too empty. I decided then to make it all blue, but then the eyes of the logo was not visible, and then that whole layer of solid bright blue started to look fake, cheap, and cartoonish. (At this time I actually changed the text to white because it can be seen better). So I decided to change it to a lower opacity (and I also changed the font back to black because the background (and colour) was already too bright (and light). Then I thought maybe I could add some gradient to make it look more professional (which I learnt when I followed a video on making a random logo for practice). I used the linear gradient because the front side seemed more left one type of thing, right the other. I made the blue on the right and white on the left. But it looked very formal and like it was from a clinic, so I added orange which was another "recognised" colour of the company (because of the logo). I added it on the left and adjusted the gradient slider which looked great. I tried to flip the two colour and collected feedback saying the original one was better, which I agreed. I think it was because the left side already didn't have much, and if I added blue it looked cool and cold and very quite. And in a way the text is something that felt less lively than the smiling logo, so the colour fit better.

As I added colour to the front, I thought maybe I should add it at the back too. I used radial gradient this time. It is because the back has the focal point in the centre and the outside is more empty. At first, I used green which was another colour that I liked from my design. I put the green on the outside and white in the inside, because it looks like the logo is shining, and the outside need some colour to fill the emptiness. However, my chosen design part has already justified that green felt too jealousy and inexperience. And it didn't fit the feel, so I changed it to blue. It looked pretty good and not too repeated because there is orange in the front. The only thing was the colour was too solid so I decreased the opacity. Afterwards, I also changed the lines to white so they don't complicate with the logo's lines, and they catches less attention while they are still visible in that blue.

I also changed the font, observe the two cards below. The first was avenir which I said I would use. The second is Helvetica Neue which was the one I used. The first one looked too simple and perhaps many business card uses Helvetica Neue, the second one looks more like what a business card looks like. The second one also seems to looks less simple in a way it makes this kind of empty card less empty.

La Vedette

Cristiano Ronaldo est né en 1985, en Portugal. À vingt-quatre, Ronaldo est un excellente joueur de football. Il est l'un des meilleurs joueur de football dans le monde, et il est très cher. Il est déjà célèbre dans le monde. Son rêve: gagnent le prix de football ligue pour dix année.