会場

東京テクニカルカレッジ B1F テラホール（アクセスマップ）

• JR東中野駅 東口改札から徒歩1分
  • 中央線快速は、東中野駅に停車しません。中央・総武線（各駅停車）をご利用ください。
  • くわしくは道順のご案内をご参考ください。

タイムテーブル

LT概要とスピーカー紹介（各5分・発表順）

前半パート

「Photoshopで大量バナー制作を自動化するお話」

アスタミューゼ株式会社 取締役 （兼 デザイン部長） 白木 陽次（SHIRAKI Yoji）

PhotoshopではJSXというJavaScriptマクロが利用できます。こちらの使い方を、フォーマットが決まったバナーを自動作成する方法を通してご紹介したいと思います。

「色を変えたGoogle Mapsの「キャプチャ」と「コード」を自動生成するツール」

株式会社トライム デザイナー 葛西 恵示（KASAI Keiji）

カスタマイズしたGoogle Mapsを簡単に作成する自作ツールを紹介いたします。

「あるマークアップエンジニアの初期制作時のテンプレ事情」

STUDIO ONE マークアップエンジニア 岩堀 真吾 （IWAHORI Shingo）

受託制作においては、クライアントからの多様な要求にすばやく応えることが重要です。フリーのマークアップエンジニアである私が、制作の効率化のために普段使っているテンプレートについてご紹介します。

「こんなに変わる！npmとwebpackを使ってWEB開発をもっとラクに。」

株式会社スパイラルエッジ 渡辺 知規（WATANABE Tomonori）

webpackとは、サイト上で読み込む必要のあるJavaScriptやCSS、imageファイルといった複数のファイルを、1つないしは複数のファイルにまとめることができるツールですが、npmと掛け合わせて利用していくことで、開発チーム内で、統一された開発環境をwebpackを使って容易に構築することが可能です。今回は、実際の制作現場での利用を想定した“ラクする”webpackの使い方や設定例をご紹介します。

「gulp のビルドをもっと効率化するツールを作ってみた」

株式会社オロ フロントエンドエンジニア 片山 真也（KATAYAMA Shinya）

大規模サイトのビルドや複雑なビルド設定を楽にする Houl というツールの紹介をします。

「React/Storybookと、全員参加型のUI開発」

株式会社チームスピリット フロントエンドエンジニア 横内 宏樹（YOKOUCHI Hiroki）

ReactにはStorybookというコンポーネントガイドのようなツールが存在します。Storybookを用いて「ソースこそがスタイルガイド」「エンジニアもデザインに参加」を実現するためにTryしていることをお話しします。

後半パート

「ちゃんと使い分けたいIllustratorとPhotoshopの書き出し方法おさらい」

TIMING DESIGN デザイナー 北村 崇 （KITAMURA Takashi）

「スライスはさすがに使わない」と言う人が大半の現在、「それ以外の書き出し方法」について、書き出し機能毎の得手不得手、ちょっとしたTipsなどを踏まえながらおさらいしたいと思います。

「わりかし効率的なコラ画像術」

株式会社ライデン アシスタントデザイナー 野田 純生（NODA Junki）

デザイン制作の現場で割と重宝するコラ画像術。基本的なPhotoshop技術をベースに、効率よく写真に馴染む、コラ画像のツボを紹介します。

「効果測定の効率化のために行った3つのこと」

GMOペパボ株式会社 デザイナー かわかみ しずか（KAWAKAMI Shizuka）

エンジニアやデザイナーが、自身の行った施策の効果測定を効率的に行えるようにするために何を行ったのかをざっくりとお話します。

「ツールで解決するWordPressとモダンフロントエンドの開発手法」

株式会社ストロボスコープ ウェブデベロッパー 扇 克至（OUGI Katsushi）

WordPressでもCSSやJavaScriptはGulpなどモダンな開発手法を採用したくありませんか？　ツールを使って簡単に開発できる方法をご紹介いたします。

「Photoshopの自動処理で楽するお話し リサイズ編」

株式会社シーティーイー 本業はDTP 大澤 一志（OSAWA Kazushi）

Photoshopには「アクション」「ドロップレット」「バッチ」など標準で搭載されている自動処理の機能があります。これらを組み合わせることによる効率化の話と、さらにAdobe ExtendScript Toolkitで作成した「書き出し形式」に似た処理をするツールを使って楽する話をします。

「タスクランナーでラクするWeb開発 WordPress編」

株式会社エースユニオンデザイン マークアップエンジニア 齋木 弘樹 （SAIKI Hiroki）

業務でWeb制作をしている場合、日々の制作の中で「繰り返し」行っている作業の時間は思った以上に無視できません。これらはまとめてタスクランナーに任せてしまいましょう。このLTでは、WordPressのテーマ開発での活用事例を通してタスクランナーを使うメリットとポイントをご紹介します。

参加費

• 懇親会参加の方は事前決済、不参加の方は当日決済になります。
• DISTの収支は、すべてGitHub Wikiで公表しています。

勉強会のみ

1,000円（フリードリンク付き）

• 当日受付で1,000円をお支払いください。
• キャンセルしない人と、キャンセルの可能性がある人で参加枠を分けています。ご予定に応じてお申し込みください。
• 開場から休憩明けまで、会場1Fのカフェにてソフトドリンクを無料でご提供します。

勉強会＋懇親会

4,000円（勉強会：フリードリンク付き、懇親会：コース料理＋飲み放題）

• PayPalによる事前決済のみとなります。
• 具体的な流れは、PayPalによる事前決済についてをご参考ください。
• キャンセル・払い戻しは一切対応できません。あらかじめご了承ください。
• 懇親会のみの参加は受け付けていません。
• 懇親会に参加される方のみ、勉強会の参加費1,000円から500円分をデポジットとして返還します。
  • 懇親会の実費が3,500円のため、トータルの金額は勉強会の参加費1,000円（内500円が懇親会費として返還）＋懇親会費3,000円＝4,000円となります。
  • 懇親会に参加しない方は、500円分の返還はありません。

YouTube配信

会場設備の都合上、YouTube Live配信は中止となりました。ただし録画は行い、DISTのYouTubeチャンネルで、イベント開催後1～2週間以内に公開予定です。

なお、公開不可の箇所が一部カットされる場合がありますので、ご注意ください。内容をすべてをご覧になりたい方は、ぜひ当日会場にお越しください！

設備・機材の状況が整えば、当日は19:00前後からDISTのYouTubeチャンネルでライブ配信をします。設備・機材の都合でライブ配信がない場合でも、後日同チャンネルに動画をアップロードします。

更新履歴

イベント概要

暑い夏、効率化の夏がやって来る！　PSD、AI、XD、PDF、DOCX、XLSX、PPTX……山積みの拡張子を掻き分けては進み続けるWebデザインの現場では、時間に追われることもしばしば。膨大なタスクをスマートに捌いていくためには、効率化・自動化による時短がカギになります。

（「いやいや、私はまったく時間に追われてませんヨ、というアナタは、ぜひLT希望枠へ！）

DIST.17では、デザイナー、エンジニアなど様々な視点からの効率化術を、じりじりと照りつける太陽に夏バテ気味のあなたに送ります。

LTスピーカー募集！

LTスピーカーが定員に達したため、募集を終了しました。

LTスピーカーを希望される方を広く募集します。時間は5分、内容は「効率化・時短」にまつわることであれば、デザイン・プログラミングのTIPS、便利なサービスの紹介など何でもOKです（例：最強のデザインアセット管理、爆速でプロトタイプを作る方法、オレオレコードスニペット利用法など）。

希望者は、「LT希望枠」からお申し込みください。なお、LTスピーカーの方は参加費（1,000円）が無料となります。懇親会は実費（3,500円）でご参加いただけます。

対象

• デザインやプログラミングにおいて、余計な時間を短縮したい方
• 自分のやり方が本当に効率的なのか確かめたい方
• 時短に最適化された俺／私の方法を自慢したい方
• 学生でWeb制作業界に興味を持っている方
• 効率化のためなら徹夜をしてもいい、という方

DISTについて

DISTは、職種や技術の垣根を越えてWebに関わるすべての人を結ぶクリエイティブコミュニティです。有志が非営利で運営しています。

主な活動として、以下の3つをコンセプトとした勉強会を定期開催しています。

• 職種の垣根を越える
• 特定の技術に依存しない
• 今日から現場で使える

注意事項

• スタッフ枠は、通常参加の方はお使いいただけません。スタッフとして参加希望の方は、公式サイトのお問い合わせフォームよりお問い合わせください。
• 会場のWi-Fi一般開放はありません。
• 動画、写真の撮影を予定しています。撮影NGの方は事前にお申し出ください。
• お支払いいただいた参加費や懇親会費の返金は一切できませんので、あらかじめご了承ください。
• 主催者、参加者みんなで作り上げる勉強会です。準備や片付けにご協力をお願いします。