goodluck 150515

38
Copyright(C) 2015 Yuica Shiva All rights reserved. 司馬 ゆいか 株式会社 CINRA クリエイティブ Div. ディレクター

Upload: taichisugiura

Post on 22-Jan-2018

197 views

Category:

Presentations & Public Speaking


0 download

TRANSCRIPT

Page 1: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

司馬 ゆいか

株式会社C I N R A

クリエイティブD i v.

ディレクター

Page 2: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

CINRA?

Page 3: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

株式会社CINRAとは?

幸せのきっかけを、

多くの人に届ける

ウェブサイト制作 / コンテンツ制作 /

D T Pクリエーション / ブランド構築 / イベント制作 /

P R代行・キャスティング / アーティストプロモーション /

そしてオウンドメディア

なんでもやっている、クリエイティブカンパニーです。

Page 4: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

CINRA.NET

日本最大級のカルチャー・クリエイティブ系WEBマガジン

月間400万PV

200万人のユニークユーザー

約80,000人のTwitterフォロワー

※2015年5月現在

これまでの取材実績

細野晴臣 / YUKI / くるり / 星野源 / 北野武 / 蒼井優 / 松田翔太 / 岩井俊二 / 草間彌生 / 中村勇吾 / 松尾スズキ / 谷川俊太郎 / 浅野いにお / 美輪明宏 / 箭内道彦 / 片桐仁 / 藤原ヒロシ 他多数

※敬称略 / 順不同

Page 5: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

CINRA.JOB と CINRA.STORE

クリエイティブ求人サービス カルチャーオンラインストア

Page 6: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

クリエイティブ Div.(制作部)

得意なこと

・オウンドメディア構築

・美術・音楽・映画系ウェブサイト

・グローバル展開支援

・学校・ポータル・企業ウェブサイト

主な実績:

・早稲田大学オフィシャルサイト

・100 Tokyo(経済産業省)

・東京都江戸東京博物館

・こちら、銀座資生堂センデン部

Page 7: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

ディレクター

デザイナー

エンジニア

募集中

Page 8: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

司馬 ゆいか

Page 9: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

経歴

2011年12月〜 面白法人カヤック “ART-Merer” ディレクター

2012年11月〜 チームラボ株式会社

2013年 3月 武蔵野美術大学卒業

2014年 4月〜 株式会社CINRA ディレクター

Page 10: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

C a c o oとの出会い

Page 11: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

Cacooとの出会い

2012年11月

前職で上司に勧められる。(初めてのワイヤーフレーム)

「Cacooは便利だけど、チームのみんなは違うツールを使っているみたい・・・・」

2014年4月

CINRAにCacooを持ち込んだら、社内のワイヤーフレーム制作ツールを、Cacooに統一できた!

現在ではディレクター全員がCacooでワイヤーフレームを作成

・・たまに使うけれども、メインで使うツールではなかった・・

Page 12: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

現在CINRAでは、

ほぼ全ての案件が

Cacooにて管理されています。

その他に使われているツール

Page 13: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

ローカルファイルでの

案件進行は

めちゃくちゃめんどくさい

Page 14: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

1. アップデートの度に共有するのが

めんどくさい

Page 15: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

①アップデートの度に共有するのがめんどくさい

こんな経験はありませんか?

・ローカルでのバージョン管理がめんどくさい

・間違えて古い資料でデザインしてしまった

・そもそもメールで送られてきてたの、忘れてた

・てゆうかどのファイルが最新だっけ?

・いちいちまとめるのめんどくさい。

・デザイン段階での変更をワイヤーに反映するの超めんどくさいし不毛な作業すぎる

常に最新版が共有されていればいいのに!!

Page 16: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

Cacooだと常に最新版が共有できる!

・ファイルを更新したら、一言チャットを飛ばすだけでOK!

・ダウンロードしなくてよいので、確認する方の気も楽!

・Cacooが最新版であることが明確なので、古いファイルで作業しちゃったりしない!

・複数人で確認する場合も、一気に修正を入れることができる!(ファイルを回す必要がない)

「最新版がここにある」

さらに、それを皆に共有できている状態が

Cacooを使う意味なのでは

Page 17: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

2. 修正指示のやりとりが

めんどくさい

Page 18: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

②修正指示がめんどくさい

言葉でデザイン修正するのは齟齬が起こり危険

でも紙でやりとりするのもめんどくさい!

修正あるある

・ディレクターの指示がどのページのどこのことを言っているのかがわからない

・自分で出した指示なのにすっかり忘れていて確認が漏れる

・指示書と反映されたデザインを照らし合わせるの大変

・紙で文言修正もらうと手打ちになるのでとても困る

・ワイヤー段階で出てきた開発のメモはもはや何者でもない

Page 19: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

Cacooで修正指示をだせば万事解決

・修正箇所を図で説明できるので、齟齬がうまれにくい。

・文言の変更もコピペできるので、誤植がうまれにくい。

・外注さんへの指示も便利。

・修正と反映が同じファイルで確認できる。

・WF段階でも開発のメモや気付きが、最後までずっと残る。

ワイヤーフレームを「土台の資料」ではなく

メモや開発をひっくるめた

「制作の現場」として使用する

Page 20: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

DEMO

Page 21: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

▲Cacooにデザインを貼り、そこに各々コメントしていきます。

(ディレクター、ディベロッパー、時にはクライアントも。)

Page 22: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

▲更新されたデザインを同じシートに貼り付け。

すると、修正が反映されているかどうかが一目瞭然!

Page 23: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

3. 関連資料をまとめるのが

めんどくさい

Page 24: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

③関連資料をまとめるのがめんどくさい

・新しいメンバーが入ってきた時に、渡し忘れるファイルがある

・いつの間にかサイトマップが更新されている

・細かい仕様やパーツの仕様を伝え忘れる

・めっちゃ古いワイヤーが知らぬ間に開発陣にわたっていく

細かな仕様に関する資料の抜け漏れが

大きな事故につながりやすい!!!

Page 25: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

Cacooで全て管理してしまえばよいのでは

アップデートが頻繁に行われるものは

全部ここにいれておくと便利!!

サイトマップ、共通パーツの管理、各パーツの挙動の指示、CMSの操作方法、DB図、修正指示

全てここで管理すれば、全てここが最新だということが分かる。

Page 26: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

案件ごとのフォルダの中身

Page 27: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

①サイトマップ

一番最初に作るのがサイトマップ。

ここでページタイトルとIDをしっかり管理して、随時更新していく。

Page 28: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

②ワイヤーフレーム

ここで、説明はもちろんのこと

デザイン・開発、両方の懸念をどんどん書き込んでいく。

Page 29: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

③修正指示

ここに修正指示を書きこんで→ そのまま開発にパス

時にはクライアントにも書き込んでもらう

Page 30: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

こうやって使うと便利

Page 31: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

見出しをつけると便利

↑画面名エクスポートするときにとても便利

↓更新日時

前述のサイトマップに振ったID /画面名を各シートに記載先頭記号は、画面の状態によって使い分ける(デザインFIX・コーディング中など)

Page 32: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

テンプレートを作っておくと便利

応募フォームとか毎回作ってるのは気が遠くなる・・・

仕様によって変更のおそれがあるものや先に指定しておくべき事項は覚書しておく(毎回忘れがちなことたち)

Page 33: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

パーツ毎にわけると便利

純粋なサイトの「構成」だけを見ることができる

「要素」を確認できる。

変更があっても差し替えなくていい

Page 34: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

ポイントは、ずっと同じファイルを使うこと

ワイヤーの時のはなし

開発仕様メモ

デザインメモ

Page 35: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

クラウドでのファイル管理は

みんなでつかえば

もっと便利

Page 36: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

クラウドツールはひとりで使ってても意味が無い

以前はCacooを「作成ツール」として使っていましたが

「共有ツール」として使ってみたらもっと便利だった!

みんなで使うともっと便利!

Page 37: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

チーム全体でCacooを使うためには?

作図機能が優れているので、ついついそっちに引っ張られがち。

でも本当に便利なのは、常に最新版を共有出来るということ。

ただのWF作成ツールで完結せず

クラウドで管理できることの便利さを

みんなに説明することが大事!

Page 38: Goodluck 150515

Copyright(C) 2015 Yuica Shiva All rights reserved.

快適な進行管理のためも

チーム、会社を巻き込んで

Cacooを使うことを

おすすめします!