Share on FacebookTweet about this on TwitterShare on Google+

D2Dで4/2に京都コワーキングスペースcoto(コト)で開きました「WEBグラフィックツール今昔 ?デザインワークフローの転換?」のレポートです。
当日は花見日よりにもかかわらずcotoの定員に近い26名の方が参加していただきました。

P1000094

※D2Dとは”Dev & Design Draft” 特定の技術やプロダクトに限定せずに、Web制作者が今イチバン気になる情報を知ろうという領域横断型の勉強会シリーズです。
https://d2draft.doorkeeper.jp/

簡単な当日のタイムスケジュールを説明し挨拶が終わったあと、最初に登壇いただいたのは

Illsutratorでのウェブデザインワークフロー例の紹介
川井昌彦(Cherry Pie Web

P1000091

以前はFireworksを使っていた川井さんは現在はIllustratorを中心にデザインをされているという事です。
実際に仕事で使ったデザインデータを見ながら解説していただき非常にわかりやすかったです。
IllustratorでWEBデザインをする際の初期設定や、文字スタイル、段落スタイル、グラフィックスタイル、グローバルカラーを活用しCSS的な考え方でIllustratorのデザインをしていくというところは以外と昔からIllustratorを使っている人が活用していない使い方で是非印刷系の方に見て欲しい内容でした。
印刷の経験も長い川井さんの視点が大変参考になりました。

詳しい資料はこちらをご覧ください。
http://prezi.com/mojhh25kig3u/?utm_campaign=share&utm_medium=copy

2人目は京都で活躍するフリーランスのウェブデザイナー完山さん。完山さんも実際に納品したデザインファイルを例に解説してくれました。

DSC02119
完山さんはIllustratorでデザインレイアウトをした後、Photoshopに書き出すファイルを持っていきアセット管理でデータを書き出す流れで主に制作しているということです。
制作の途中でのクライアントとのコミュニケーションに便利な様々なツールや画像圧縮に便利なツールなどの紹介もしてくれました。クライアントとのコミュニケーションに後で紹介するプロトタイピングツールを使ってスムーズな確認を行っているところも含めて、フリーランスでデザインから構築までをクライアントと近い距離感で仕事をしている完山さんらしいワークフローで役立つ実践的な内容でした。

詳しい資料はこちらをご覧ください。
https://docs.google.com/presentation/d/1ipdFr4nN0gbHdiJvKLV2LVcISAvMGbrmXSbCvfNaA-8/edit#slide=id.g1289d4a935_2_156

最後に私こと杉山が発表しました。

DSC02134

これからのデザインワークフローの話をしました。

ウェブデザインフローについて昨年あたりからコラボレーションサービスやプロトタイプサービスがリリースされ、デザインするアプリケーションやフォントを持っていないプログラマやコーダーといかに制作をスムーズにすすめるかにいくつかの答えを提供しています。
そのベースとなるフォーマットの多くがPhotoshopとSkecthになっている。その2つが標準になりつつある理由は、2つのソフトのデータフォーマットがオープンであり、アプリを所有していなくてもCLIやJavascript,Rubyなどからレイヤーや画像が取り出せるインターフェイスが用意され、それを元に開発されたサービスが数多くリリースされているという理由です。
そしてカンバセーションツールを各サービスが自前で作るのでなくSlackにつなげるようになっている傾向である事を話しました。
これからのデザインツールもベンダーが1社ですべてを開発するのではなくオープンでつながる事がキーになってくるということです。
そしていくつかコラボレーションサービスを実際に操作して紹介しました。

当日使ったスライドはこちら
webdesign-workflow.pdf

3人の登壇のあとは、1時間質疑応答と来場者の方から出された疑問やお題をみなさんでディスカッションしました。

ウェブ系のワークショップは技術系のものが多く、デザイン系が少ない気がするのでまたやって欲しいという声も複数いただいたので、是非また大阪や神戸でも調子に乗って開催できればと思います。