このエントリーをはてなブックマークに追加 Share on Tumblr Clip to Evernote 編集





◆ #いきなりHTML 2(レスポンシブ対応)
なんと!スライスもコーディングも全自動!イラレからHTML+CSSへ一発出力します

◆ スクリプトで時短革命
デザイン業界にもRPAを!スクリプトはオーダーメイドがイイんです!

◆ 10倍ラクするIllustrator仕事術〜ベテランほど知らずに損してる効率化の新常識
イラレ使いにこれ1冊!ホントに10倍ラクできます




セミナーで大反響だった手法を公開します!

こんなやり方、誰も教えてくれませんでした(^_^;)
(神奈川県  デザイナー 48歳)

20180917_193644_2


■■ はじめに

 おつかれさまです。GOROLIB DESIGNの渋谷吾郎です。

 この本は、デザインが遅くて困っている人に向けて書きました。

 デザインの学校では、デザインを早くする方法を教えてくれません。

 早く仕上げようとすると、考慮が足りないと言われます。もっと時間をかけるようにと言われるのです。

 ところが、デザインの現場で求められるのはスピードです。デザインで食べていくには、商業デザイナーになる必要があるからです。

■ 商業デザインは商売である

 商業デザインは、商品やサービスの販売促進のお手伝いです。絵心を使って、その商品やサービスが売れるように表現するのです。

 チラシやポスター、ランディングページやバナー広告などは、すべて販売促進の一環です。

 自分で認識しなくても、デザインでお金を稼いでいる人は、商業デザイナーです。

 商業デザインは、商売です。商売ですから、予算があり、納期があります。

 そのため、人件費や作業時間は限られています。

 いつも予算オーバーでは、会社は存続できません。納期に間に合わなければ、次の仕事は来ないのです。

■ 時間をかけても良いデザインはできない

 デザイナーは、デザインには時間をかけなければいけないと思い込んでいます。

 限りある納期の中で、できるだけ時間をかけようとします。活動時間には限界があるので、食事や睡眠時間を削っています。

 しかし、これは誤った考えです。

 商業デザインの質は、目的に合致しているかどうかで決まります。目的とは販促活動のことです。

 時間をかけても、目的に合致していなければ、良いデザインにはなりません。商売における良いデザインとは、これなら買いたい!と思ってもらえる表現のことです。

 良いデザインにするためのアプローチが、間違っているのです。

 この本では、極めて短時間で、良いデザインができる方法をご紹介します。

■ デザインに時間がかかる原因

 デザインに時間がかかる原因は3つあります。

■(1)構造分析されていない

 1つ目は、構造分析がされていないことです。

 構造分析とは、伝えるべきことを整理する作業です。面倒に見えますが、10分もあれば完成します。

 構造分析は【6w3h】で行います。

【6w3h】…★は特に大事なもの
・what(いったいこれは何か)★
・when(いつ)
・who(だれが)
・whom(ターゲットは?)★
・where(どこで)
・why(どんな良いことがあるのか)★
・how(どうやって)
・how much(いくら?)
・how many(何回)

 特に大事なのは、what、whom、whyです。いったいこれは何で、ターゲットは誰で、どんな良いことがあるのかということです。

 この3つがクリアできなければ、デザインはできません。

 商業デザインの質は、構造分析を満たしているかどうかで決まります。

 ポップな内容に、楷書体は使いません。シニア向けに8ポイント文字を使えば「読めない」と言われます。

 デザインレビューの本質は、構造分析を満たしているかどうかです。構造分析がなければ、そのデザインの評価すらできないのです。

 なぜ楷書体なのか、なぜ8ポイント文字なのか、すべてのデザイン要素には理由があります。その理由は、構造分析に裏付けされているのです。

■(2)イラストレーターでデザインしようとしている

 2つ目は、イラストレーターでデザインしようとしているからです。便宜上、この本ではデザインアプリを「アドビ イラストレーター」とします。

 いきなりPCに向かってはいけません。

 イラストレーターでデザインなど、できないのです。脳内の漠然とした世界を、いきなりミリ単位に落とせるわけがありません。

 イラストレーターを「デザインできる夢の道具」だと勘違いしているのです。イラストレーターでデザインすることが、かっこいいと思っているだけなのです。

 イラストレーターは、トレースする道具です。

 かつての雲形定規やロットリングペン、ポスターカラーが、電子化されたに過ぎません。

 時短するには、すべてをラフスケッチに落としこむことです。ラフスケッチは、10分もあれば完成します。

 ラフスケッチは、鉛筆で紙に描きます。それをスキャンして、はじめてイラストレーターに向かうのです。

 イラストレーターは、ラフスケッチをトレースする道具なのです。

■(3)イラストレーターに精通していない

 3つ目は、イラストレーターの機能に精通していないからです。

 10年来のベテランでも、整列パネルを使わない人がいます。アピアランスの存在を知らない人もいます。かたくなにPDF入稿を拒む人もいます。

 また、スクリプトによる30倍の効率化を知らない人もいます。30分の作業が1分になるスクリプトがあります。使い続ければ、ひと月の作業が1日になるのです。

 かつて不便だったものは、時を経て便利になっています。

 最新の情報を集め、道具に精通することは、とても大事です。

■ デザインに時間がかかる原因を根絶します

 現場では、デザインに時間がかかる3つの原因が混在しています。

 伝えるべきことを整理しないまま、いきなりイラストレーターに向かい、知っている機能だけでデザインしようとしているのです。

 これでは、早くできるわけがありません。

 PCの前で「何をしたら良いか分からない」のは、これが原因です。

 本文では、この3つの原因を根絶します。そして、誰でも簡単に短時間でデザインできる方法を提案します。

 お役に立てれば幸いです!それでは始めていきましょう。

【目次】

■ はじめに
・ 商業デザインは商売である
・ 時間をかけても良いデザインはできない
・ デザインに時間がかかる原因
・(1)構造分析されていない
・(2)イラストレーターでデザインしようとしている
・(3)イラストレーターに精通していない
・ デザインに時間がかかる原因を根絶します
■ 第1章:伝えるべきことを整理する
・ 構造分析を行う
・ 特に大事な what、whom、why
・ what(いったいこれは何か)
・ whom(ターゲットは?)
・ why(どんな良いことがあるのか)
・ その他の要素を埋める
・ 伝えるべきことが際立つ
・ 伝えたくないことを決める

■ 第2章:ラフスケッチでデザインする
・ まずは脳内で寝かせる
・ 脳内ではデザインがスタートしている
・ ラフスケッチを起こす
・ なぜ小さく描くのか?
・ なぜ紙と鉛筆を使うのか?
・ すべてA4で作ればよい
・ 原寸大の設計は正しいのか?

■ 第3章:超ハイスピードデザイン術の実践
・ ラフスケッチのスキャン
・ スキャン画像トリミング
・ スキャン画像をIllustratorへ
・ 1:√2 に補正する
・ 小さく描くと錯視修正ができる
・ 超ハイスピード文字入力とは?
・ 文字がデータ支給されるとは限らない
・ 音声入力
・ OCR
・ 文字入力のチェックはスピーチで
・ 文字入力はプレーンテキストで行う

■ 第4章:サンプルのご紹介(税理士法人 小山・ミカタパートナーズ様)
・ 構造分析
・ 他の認定支援機関がターゲット
・ いったいこれは何かを考え抜く
・ ラフスケッチを行う
・ ラフスケッチはトレースのためのメモ
・ フォントもイメージしておく
・ ウェイトが与える印象の違い
・ 写真やイラストもイメージしておく
・ トレースする
・ トレースはグレースケールで
・ 配色は2~3色で
・ 変動要素は仕上げない

■ おわりに

© 2019 GOROLIB DESIGN


■■ 第1章:伝えるべきことを整理する

■ 構造分析を行う

 デザインを早くするには、伝えるべきことを整理することです。 

 これを構造分析と呼びます。

 お金がもらえるデザインは、そのほとんどが商業デザインです。商業デザインとは、商品の販促活動であり、その最終目的は売り上げアップです。

 そのためには、構造分析が必要です。構造分析は、6w3hで行います。

20180917_193644_2


お役に立ちましたらツイートお願いします!




このサイトで配布しているイラストレーターのアクションやスクリプトファイルを無断で転載・配布・販売することを固く禁じます。ご紹介いただける際は必ずURLリンクにてお願いいたします。 このサイトで配布しているイラストレーターのアクションやスクリプトファイルの使用で、ファイルの破損やアプリケーションに不具合が発生した場合でも、責任は負いかねますのでご承知おきくださいませ。自己責任での使用をお願いいたします。

© 2017 GOROLIB DESIGN
Released under the MIT license.





このエントリーをはてなブックマークに追加 Share on Tumblr Clip to Evernote 編集





◆ #いきなりHTML 2(レスポンシブ対応)
なんと!スライスもコーディングも全自動!イラレからHTML+CSSへ一発出力します

◆ スクリプトで時短革命
デザイン業界にもRPAを!スクリプトはオーダーメイドがイイんです!

◆ 10倍ラクするIllustrator仕事術〜ベテランほど知らずに損してる効率化の新常識
イラレ使いにこれ1冊!ホントに10倍ラクできます




■ いつも迷うので作りました。

 おつかれさまです。@gorolibです。

 Illustrator のスクリプトを作るとき、配列に重複をなくしたいというときは、よくあります。

 配列というのは、[ 1, 1, 2, 3, 3, 4, 4, 4 ]という、情報の羅列です。JavaScriptでは、これをひとまとまりで扱えるのですが、重複しないように保管したい、というときがあります。

 具体的には、[ 1, 1, 2, 3, 3, 4, 4, 4 ]を、[ 1, 2, 3, 4 ]としたいのです。

 普通のJavaScript?では、重複を排除するやり方はたくさんあるのですが、こちらはなんだか冴えません…良いのがないのです(^_^;)

■ 配列と値を投げるイメージ

 そこで、配列と値を投げて、trueかfalseが帰ってくる関数を作りました。コピペで使ってください。

 unifnと命名しましたが、ユニーク(唯一)ファンクションと読んでください。すげえ簡単で恐縮ですが、自分も参考にしたいので…

【投げる側】
if(unifn(値, 配列)){
配列.push(値)
}

投げる側は、値と配列を投げます。関数側はあればfalseを、なければtrueを返します。このif文は、true(配列にない)なら、pushするという書き方です。邪魔くさい場合は、1行にしてもいいです。

if(unifn(値, 配列)){配列.push(値)}


一方、関数側はこちらです。

【関数】
function unifn(u1,u2){
for(var u=0; u<u2.length; u++){
if(u1==u2[u]){return false}
}
return true
}

配列に同じ値があればfalseを返しておわり、なければ最後までループしてtrueを返すという設計です。こちらも、邪魔くさければ、行数減らしてください。
function unifn(u1,u2){
for(var u=0; u<u2.length; u++){if(u1==u2[u]){return false}}
return true
}

以上です。お役に立てれば幸いです!

お役に立ちましたらツイートお願いします!




このサイトで配布しているイラストレーターのアクションやスクリプトファイルを無断で転載・配布・販売することを固く禁じます。ご紹介いただける際は必ずURLリンクにてお願いいたします。 このサイトで配布しているイラストレーターのアクションやスクリプトファイルの使用で、ファイルの破損やアプリケーションに不具合が発生した場合でも、責任は負いかねますのでご承知おきくださいませ。自己責任での使用をお願いいたします。

© 2017 GOROLIB DESIGN
Released under the MIT license.





このエントリーをはてなブックマークに追加 Share on Tumblr Clip to Evernote 編集





◆ #いきなりHTML 2(レスポンシブ対応)
なんと!スライスもコーディングも全自動!イラレからHTML+CSSへ一発出力します

◆ スクリプトで時短革命
デザイン業界にもRPAを!スクリプトはオーダーメイドがイイんです!

◆ 10倍ラクするIllustrator仕事術〜ベテランほど知らずに損してる効率化の新常識
イラレ使いにこれ1冊!ホントに10倍ラクできます




※このスクリプトは、スクリプト使い放題マガジン2(初月無料)に含まれています

参考:スクリプト使い放題マガジン2(月額)もごひいきに(初月無料です)

※この製品は、macOS High Sierra + Illustrator CC2017にて検証済みです。


■ 自動で塗り足し作ります
(クリックで動きます)
タイトルなし

スクリーンショット 2019-04-12 4.45.07

 おつかれさまです。@gorolibです。

 すでに公開している「塗り足し作成スクリプト」について。

参考:アートボードの塗り足しを自動でつくって自動で並べちゃうスクリプトです

 私の中では常にレギュラーメンバーであり、とても頼もしい道具です。しかし、ダイアログを設けずに自動化を推し進めたため、少々不都合が生じておりました。

 具体的には、アートボードとの相対位置により、塗り足しを付ける付けないを自動判定するため、思い通りにいかないケースがたまにありまして…

 タテ版とヨコ版に分けたのも、自動化し過ぎたためであり、若かったのね、ムフフ。

 タテ版とヨコ版を1本化して、ダイアログで制御すれば、もっと汎用的になり、より大人なスクリプトになるかと、今回、集大成版を作成した次第です。


■上下左右どちらでも良くってよ♪

 塗り足しの対象は、パスアイテムのみです。今回、上下左右、任意の方向に塗り足しを伸ばせるようにしました。前回は整列の要素も入れていたのですが、今回は単純に「塗り足しまで伸ばす」というコンセプトにしています。

スクリーンショット 2019-04-12 4.20.05


 ただし、現在のドキュメントの塗り足し値は、やっぱりスクリプトからは拾えないので、3ミリ固定にしています。


■だいたい3方向になるはずなので…

 塗り足しは、だいたい3方向になるはずなので、ダイアログのチェックボックスの初期値はすべてオンにしています。

 具体的には、アートボード上端の帯は「下以外」なので下のチェックを外す、アートボード下端の帯は「上以外」なので上のチェックを外す、というオペレーションになります。

スクリーンショット 2019-04-12 4.45.07


スクリーンショット 2019-04-12 4.43.55


■3ミリオフセットも可能です(おまけ)

 全方向に塗り足しをつけると、アートボードサイズ+塗り足しのオブジェクトになります。

スクリーンショット 2019-04-12 4.20.05

 つまり、選択オブジェクトをアートボードサイズにして、さらにオフセット3ミリにしたものになります。これはこれで使えますが、あくまでおまけですので、ご承知おきくださいませ…

(クリックで動きます)
タイトルなし2

■今回のスクリプト情報
(クリックで動きます)
タイトルなし

スクリーンショット 2019-04-12 4.20.05


【スクリプトファイル名】
G663_fittoBleedUltimate

【使い方】
(1)対象となるパスアイテムを選択します
(2)このスクリプトを起動します
(3)塗り足しの方向を選択します

【仕様】
(1)パスアイテム以外は反応しません
(2)塗り足しは3ミリ固定です
(3)選択された方向に塗り足しを作成します

お役に立てれば幸いです!

20180917_193644_5
20180917_193644_4

お役に立ちましたらツイートお願いします!




このサイトで配布しているイラストレーターのアクションやスクリプトファイルを無断で転載・配布・販売することを固く禁じます。ご紹介いただける際は必ずURLリンクにてお願いいたします。 このサイトで配布しているイラストレーターのアクションやスクリプトファイルの使用で、ファイルの破損やアプリケーションに不具合が発生した場合でも、責任は負いかねますのでご承知おきくださいませ。自己責任での使用をお願いいたします。

© 2017 GOROLIB DESIGN
Released under the MIT license.





↑このページのトップヘ