イラストレータでデザインをやってみましょう
A few weeks ago we decided to redesign the Zee logo. When companies redesign their logos, that means, most of the time, that they are changing something in their business, it can be a new strategy, new products, etc... But it's pretty much sure that something is new behind the logo. In our case it's not different, we've changed our business model and decided to create a new logo.
With the idea of "Stay in the Loop", I decided to play in Illustrator to create a custom font for it. Also I wanted to make the logo resemble a bit of the Abduzeedo logo. We're still working on the logo and the tag line, but the concept is this one that I will show you here.
So in this tutorial I will show you how I created the logo in Illustrator and the splash in Photoshop.
Step 1
Open Illustrator and create a new document. Then go to View>Show Grid and then go to View>Snap to Grid. These 2 presets will be very important for us to design the font for the logo.
Step 2
With the Rectangle Tool (M) create a rectangle using the grid.
Step 3
With the Pen Tool (P) add 4 new points on each segment of the rectangle. After that with the Direct Selection Tool (A) select each one of this points and move them um module of the grid away to create a chamfered corner.
Step 4
Lets start creating the Z. Still with the Direct Selection Tool (A), select the segment of the left side of the rectangle and delete it.
Step 5
Delete the righ side now still with the Direct Selection Tool (A). Pretty much the whole process will be with the Direct Selection Tool (A) and the Pen Tool (P).
Step 6
Now with the Pen Tool (P) click on the point 1 and then on the point 2 to create a diagonal segment. Our Z will be done.
Step 7
To create the E will be the same process. First let's delete the right segment of our chamfered rectangle using the Direct Selection Tool (A).
Step 8
With the Pen Tool (P) click on the point 1 then holding SHIFT click a few modules down in the grid (point 2). The click again now one module left and dow to create a chamfered corner (point 3).
Step 9
Still with the Pen Tool (P) create the segment 1 and the chamfered corner 2. Hold SHIFT to make sure that you're creating straight lines, even though we have activated the Snap to Grid option. After that our E will be done.
Step 10
Now just duplicate the E and we will have the word ZEE.
Step 11
Go to Effect>Stylize>Round Corners. Use 5 points for the Radius or try different values to increase or reduce the round corners effect. However I didn't like the result I wanted something more stylized.
Step 12
So I decided to increase in 2 modules the chamfer effect.
Step 13
Now apply the Round Corner effect to the new logo, I still used 5 points for the Radius. The result is much better, it is much more like what I was looking for. But now I need to create a connection between the characters to give the idea of loop.
Step 14
To do that it's quite easy. With the Pen Tool (P) create the the segments to connect the Z to the E (1-2) and the E to the other E (3-4).
Step 15
Now just increase the stroke size. I'm using 8 points for the stroke. The logo is done. It resembles those subway maps and has this idea of loop, exactly what I wanted.
Step 16
Now let's open Photoshop and create a new document. I used 1024x768 pixels for the size. Fill the background layer with a very light blue (#dde9f5).
Step 17
Copy the logo from Illustrator and paste it in the Photoshop document.
Step 18
Go to Layer>Layer Style>Color Overlay. Use #5d87b6 for the Color and Normal for the Blend Mode.
Step 19
Now go to Layer>Layer Style>Inner Shadow. Use Multiply for the Blend Mode, black for the color, 40% for the Opacity, 120º for the Angle, 1 pixel for the Distance, 0 for the Choke and 1 pixel for the Size.
Step 20
Now go to Layer>Layer Style>Drop Shadow. Use Color Dodge for the Blend Mode, white for the color, 100% for the Opacity, 90º for the Angle, 1 pixel for the Distance, 1 pixel for the Spread, 0 pixel for the Size.
Step 21
This is the effect you will have gotten so far.
Step 22
Create a new layer and with the Rectangular Marquee Tool (M) create a rectangle selection and fill it with a white to black gradient with the Gradient Tool (G). Use the image below for reference.
Step 23
Duplicate the rectangle and go to Edit>Transform>Flip Horizontal. Move it so it will be on the other side of the segment of the E (1-2). Duplicate those 2 layers and move to create the same effect on other E (3-4).
Step 24
Select the 4 gradient layers and group them. Them holding the Command key on a MAC or the Control key on a PC, click on the thumbnail of the Zee layer in the Layers Panel to create a marquee selection of the Zee logo. After that select the group with the gradient rectangles and go to Layer>Layer Mask>Reveal Selection.
Step 25
Reduce the Opacity of the group with the gradients to 40%. That will make the effect much more subtle.
Step 26
Duplicate all layers and merge the copies to a single layer. Then go to Filter>Noise>Add Noise. Use 1.4% for the Amount and select Gaussian for the Distribution and Monochromatic.
Conclusion
That's it, we have a nice splash. We can add more stroke if we want to make the logo bolder. If you pasted the vectors in Photoshop using Smart Objects that is pretty easy, you can just double click on the smart object to open it in Illustrator and then just play with strokes over there. Now the cool thing is that the logo uses a font created from scratch what makes it quite original and it was really easy to do that in Illustrator using basic tools and the snap to grid option.
サイト内検索
イラストレータの勉強
グラデーションと分割 図形と合流・型抜き ロゴマークの作成 テキスト落書き VECTIPS Logo Vectortuts Logo 水滴の作り方 WATER グラデーション背景 竹 リボン 薬カプセル かぼちゃ 緑の玉 亀さん 気球 花びら つやのある球 ロゴ vectips ロゴ Zee ロゴ 風船 ロゴ UPWARD ロゴ ZERO ロゴ VECTORS ロゴ VECTORSその2 ロゴ WOOF ロゴ Don't Break ロゴ Smooth ロゴ VECTORSその3 ロゴ VECTORSその4 ロゴ VECTORSその5 ロゴ VECTORSその6 ロゴ VECTORSその7 ロゴ VECTORSその8 ロゴ VECTTIPSその1 ロゴ VECTTIPS その2 ロゴ VECTTIPS その3 ロゴ VECTTIPS その4 ロゴ VECTTIPS その5 ロゴ VECTORSその8 ロゴ VECTORSその9 ロゴ VECTTIPS その6 ロゴ ROMERO WEEK ロゴ VECTORSその10 ロゴ ECLIPS ロゴ ROCKEY ロゴ VECTORSその11 ロゴ VECTORSその12 ロゴ Tutorial Shock ロゴ VECTORSその13 ロゴ VECTORSTUTS ロゴ ARCADE LOVE ロゴ Zeeその2 ロゴ VECTORS PUFFS イラスト1 イラスト2 イラスト3 イラスト4 イラスト5 イラスト6 夜空 3D ロゴ 葉と水玉とテントウムシ イラスト10 イラストカーテン イラスト木目 イラスト 幻想 イラスト メッシュの葉 イラスト 靴 イラスト 家 イラスト9 イラストレータ フォトショップ イラストレータV10の使い方デザインの勉強
デザインの基礎 AIRに挑戦 AOBADAIに挑戦 DOWNFALLに挑戦 フレームに挑戦 BOXグラフに挑戦 LUCKに挑戦 オレンジに挑戦 リングに挑戦 STORMに挑戦テキストにチャレンジ
カタカナ入力 七夕様 相田みつをの世界 誕生石 誕生石と誕生花 フランスの国旗 ドイツの国旗 イタリアの国旗 日本の国旗 ロシアの国旗 シャガール 犬のおまわりさん 拡張子 メニュー パン 世界の国旗 気になる言葉2 気になる言葉3 大きな古時計 オリエント急行 お料理教室 おしながき パソコン専門用語 地図・・・PC検定 メニュー 紅茶 特殊文字 占いいろいろ ウォルトディズニー 全館停電 ひまわり図鑑 ゆり図鑑 テキスト 初級 テキスト 中級① テキスト 中級② テキスト 上級① テキスト 上級② アロマセラピー講座1 あなたと薬 アロマセラピー講座2 オーストラリアの動物 美人が作るレシピ ブログ お料理知恵袋 ゆば ドトールコーヒー物語 地震 円の国際化 福原 愛 振り込め詐欺 楽しいガーデニング ガーリック クリップアートの色を 埼玉の観光 山梨の観光 ゴールデンウィーク はがきで挨拶 敗戦の時 阪神タイガース ハワイに行こう ヒアルロン酸 肥満の知識 ほくろがガンに要注意 今すぐトライ インターネットで調べよう ITニュース 日本のお茶 時代を切り開いた女性1 時代を切り開いた女性2 地獄めぐり 時間割 スポーツの審判 花粉症 段落番号の設定 神奈川県 漢文とは中国語か? 阪神タイガース 漢字の偏見 関節痛 ゴールデンウィーク 簡単お弁当レシピ キーボード 国民年金 暮らしを楽しく 草花図鑑その1 草花図鑑その2 行頭文字の設定 段落番号の設定 主な国際機構 浅田真央のプロファイル 数学図形の問題1 パソコンについて 中原中也 オーガニックコットン1 オーガニックコットン2 落ち葉の森 お大事に 奥の細道 ページ番号の設定 埼玉の観光 ラーメン博物館 レシピ1 レシピ2 連絡網 履歴書 竜宮城 竜宮城バザー 世界の気候 脂肪を燃やせ 資格 四季折々の野菜 春 四季折々の野菜 冬 下町で 食品の分類 生涯学習 生姜と豚肉 四季の折々野菜(春) 四季折々の野菜 秋 四季の野菜 春 下町で遊ぼう そばの献立 サッカー世界標準 スターバックス すだちとかぼす スーパーサッカー 数学の問題2 体内チェック 寅さんシリーズ1 寅さんシリーズ2 寅さんシリーズ3 寅さんシリーズ4 海から吹く風 横浜ベースターズ 郵便払込み 湯河原独歩の湯 ゆかた祭り模写は意外と簡単
大黒様 着物の柄 富岳百景 ベートーベン オペラ座 ミニー ゴメン 母の日 ドラゴンボール 潮干狩りパソコン教室
パソコン教室の特徴 会員の最大の特典は? パソコン教室の会員の種類 すべて個人指導で、解りやすく 出張!パソコン家庭教師 追加受講する場合 日曜教室、始めました パソコン教室の料金体系何を学ぶか?
どんなサービスか? 学べるソフト一覧 ホームページを作ろう パワーポイントを勉強しよう 模写の勉強 デザインの基礎 ビデオの編集をやってみよう。