スキップしてメイン コンテンツに移動

投稿

9月, 2014の投稿を表示しています

WordやExcelでも!すぐに使えるレイアウト・デザインの鉄則

デザイナーでなくても例えば会社の文書作成や、提出書類、近所のイベント等で書類やチラシを作ることもあると思います。

カッコイイ感じに仕上げたくても、どうすればよくなるの??って方におすすめ。

WordやExcel、Power Pointなどで、今すぐ誰でもできるレイアウト術、デザイン術です。



▼改行をマスターしよう!



単調になりがちな文章は、改行をうまく利用することで読みやすい文章に変わります。

「、」句読点、「。」句点で改行
改行の位置周辺に「、」句読点や「。」句点があれば、そこで改行しましょう。

単語は切らない
例えば「クリーム」という単語を「クリ」と「ーム」で改行するのはNGです。
単語はできるだけ1行で。



▼文字の大きさと行間で強弱を!



文字を目立たせるには、文字の大きさや色、太字にしたりしますが、本文の流れと違うんだよ、ということを表現したいときは文字の大きさを変えてみましょう。
またほどよい行間は読みやすくなります。



▼装飾しすぎない!



見出しやタイトルなどの文字を目立たせるには、色を変えるのも効果的な方法です。
しかし、装飾のやりすぎはかえってNG。
また、過度なグラデーションやドロップシャドウ、文字の変形も昔っぽい感じになってしまいます。



ぜひカッコイイ、読みやすい!と言われる文書やチラシを作ってみてください!



Written by Creative Flake

食べ物の写真に湯気を描いておいしそうにしてみよう

ECサイトの画像やお店のメニューで絶対役立つフォトショ!

飲み物や食べ物をできたてに見せるのが「湯気」。

これを作ってみます!



使えるフォトショテクニック ペンツール消しゴムツールぼかし


↓↓完成図↓↓




まずは元となる写真をPhotoshopで開きます。

▼STEP1 ペンツールで湯気をフリーハンドで描きます。

今回は温泉マークのように描いてみます。

思い通りの曲線を描けないこともよくあるので、そんなときはパス選択ツールを使って、パスの位置や曲線の具合を調整します。





▼STEP3 この湯気のパスに色をつけるために、

①ブラシツールを選択し、大きさを適当な大きさに調整します(よさそうな大きさになるように何度かやってみて)

②描画色を白(#FFFFFF)に設定します

③1枚新規レイヤーを作ります





▼STEP4 色をつけるのはワンクリック

パスメニューで湯気のパスを選択した状態でパスの境界線を描くをクリック





▼STEP5 湯気を自然な感じにします

「フィルター」→「ぼかし」→「ぼかし(ガウス)」で、湯気をふんわりした感じになるように、数値を調整します。





▼STEP6 湯気が足りないので、周りに追加します

もう一つレイヤーを作り、ブラシツールを使って、白でコーヒーの表面から塗ります。ここは雑でも大丈夫。





▼STEP7 この湯気はもうちょっとぼかします

STEP5よりもやや強めにぼかしましょう。





▼STEP8 全体をなじませます

消しゴムツールで透過度10%、流量100%にし、消しゴムのサイズを大きめに設定し、温泉マークの湯気と2回目の湯気の両方に消していきます。

消すというよりも自然な感じになるように。





▼完成!



コーヒーのほか、お茶などはもちろん、パスタやピザ、ごはんにも!



Written by Creative Flake

コニカミノルタによるイノベーション・コンテストサイトを制作させていただきました

こんにちは、クリエイティブフレークです。





コニカミノルタ(株)が開発中の「手書き入力デバイスを用いたサービス・ビジネス」のサービス・イノベーションのアイデア、パートナーを世界中から募集する、コンテストサイトを制作させていただきました。

今回は技術仲介業を営むナインシグマ・ジャパン様からのご依頼で制作させていただきました。



▼電子クリップボードについて 「電子クリップボード」とは専用の感圧シートデバイスの上においた紙に記入する文字や図形をその場で電子データ化する技術。

同社の専用感圧シートがあれば紙やペンの種類は選ばず、手とペンの区別がつくため紙を手で押さえながら文字を入力することができる。さらに、消しゴムで消すと、電子データも連動して消える。

書いた順番、筆圧、時間などを記録することもできるという。



▼賞金 100万円(最大5個人・組織)



▼アイデアの募集期間 2014年9月8日〜10月31日



▼受賞者の発表 2014年12月



選考・評価は「提案内容の・独自性、新規性」「実現可能性」「想定される市場規模」の観点で行われ、提案内容によってはコニカミノルタとの共同開発機会を得ることができるとのことです。



▶ コンテストサイトはこちら



Written by Creative Flake

スコールカフェ新宿歌舞伎町店様のサイトを制作させていただきました

こんにちは、クリエイティブフレークです。





先月になりますが、新宿にオープンしたスコールカフェ新宿歌舞伎町店様のサイトデザインを担当させていただきました。



▼スコールカフェのコンセプト
フランス帰りの人気パティシエが作る魔法のスイーツ&ガレット!
世界にひとつだけのオリジナルプリントケーキは一つ一つ想いをこめてお作りします。
デリバリーは新宿エリア内で承っております 。



店内は木目調の雰囲気で、ヘルシー素材を使用した「魔法のスイーツ」ガレットや、キッシュやクレープ、ケーキにパフェまで!

パーティーや誕生日会、イベントにもオススメのお店です。







▼お店の詳細情報
・フリーダイヤル : 0120-356-312
・住所 : 〒160-0021東京都新宿区歌舞伎町1丁目6−6
・アクセス
 [JR]新宿駅東口徒歩3分
 [西武新宿]西武新宿駅徒歩3分
 [地下鉄]新宿三丁目駅 2b出口徒歩4分
 [地下鉄]東新宿駅 2b出口徒歩10分
・営業時間 : 毎日11:30~翌朝 7:00
・座席 : 全20席 ※全席禁煙
・設備 : Wi-Fiあり
・メールアドレス : squallcafe@pasela.co.jp
・ホームページ : http://www.pasela.co.jp/shop/shinjuku_kabuki/squallcafe/index.html



Written by Creative Flake

画像ナシ!CSSだけでリボンを描いてみよう

こんにちは、クリエイティブフレークです。



こんな風に画像を使わずに、CSSだけでリボンを描くサンプルです。

上から順番に、ひし形、リボン、右側矢印、左側矢印をそれぞれ作ってみましょう。



まずはHTML↓↓↓ <div class="diamond">Diamond</div&gt <div class="ribbon"&gtRibbon</div&gt <div class="right-arrow"&gtRight arrow</div&gt <div class="left-arrow"&gtLeft arrow</div&gt
そしてCSS↓↓↓ /* ここでまとめて横長の長方形を作ります */ div.diamond, div.ribbon, div.right-arrow, div.left-arrow { display: inline-block; color: #FFFFFF; font-size: 18px; line-height: 38px; margin: 15px 0; position: relative; width: 200px; text-align: center; } /* それぞれの長方形のbefore(前)とafter(後ろ)に大きさゼロの要素を作ります */ div.diamond:before, div.diamond:after, div.ribbon:before, div.ribbon:after, div.right-arrow:before, div.right-arrow:after, div.left-arrow:before, div.left-arrow:after { content: ""; border-style: solid; border-width: 0; position: absolute; width: 0; height: 0; } /* ひし形 */ div.diamond { background-color: #5…