Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Webとスマホとデザインと- 地方から広がるつながるデザイナーのお仕事 -   CSS Nite in FUKUI, Vol.6 2013.02.23              山森美穂
自己紹介福井県在住のデザイナーふたりの女の子のおかあさん               CSS Nite LT     16:10似顔絵を描くのが大好きグラフィック・Webデザインを経て、アプリのUIデザインをやってハマる            ...
自己紹介 江市めがね会館にある株式会社jig.jpに就職したペーペー   CSS Nite LT   16:10もちろん!                        へ                               ん    ...
Agenda        Webデザインとアプリデザイン        デザイナーからみたエンジニア文化Fukui        福 井 、マッシュア プ!                  ッ
Webデザインとアプリデザイン
違          対象    CSS Nite LT   16:10Webデザイン   操作性          素材                アプリデザイン          組み方
Webデザイン                       対象                         アプリデザイン各ブラウザ対応                     CSS Nite LT   16:10IE Firefox ...
Webデザイン              操作性                         アプリデザインマウスで選択&クリック         CSS Nite LT   16:10マウスで細かく選択ロールオーバーがある        ...
ユーザーが 使うか決まるUI                       歩きながらや、                                       CSS Nite LT   16:10 CSS Nite LT   16:25...
Webデザイン                  素材                         アプリデザイン全体のデザイン                CSS Nite LT   16:10サイトデザインは比較的固定で、コンテンツを...
アイコンはアプリの 顔      むげんメモ                             CSS Nite LT   16:10      3日間話し合いながら作成       melocy<メロシー>       ロゴとアイコンだ...
Webデザイン              組み方                         アプリデザインHTML                CSS Nite LT   16:10CSS                  主にエンジニ...
同tool  主にPhotoshopやFireworksを使用UX  ユーザーが、いかに使いやすく分かりやすいか、  いつ見て、どのように使うのかを考えながら作るbranding  デザイナーの役割を活かし全体をブランディング
デザイナーからみたエンジニア文化
CSS Nite LT   16:10BtoCのアプリ開発企画∼開発∼運営までを一貫して行っているエンジニアと社内デザイナーがチームで開発
今年1月   「教えて!おと ちゃん」 リース              う    をリ  !
今年1月   「教えて!おと ちゃん」 リース              う    をリ  !
デザイナーからみた   エンジニア文化アジャイル<スクラム>での開発   CSS Nite LT   16:10言葉の違いやミーティングの時間エンジニアさんはマニアック!
デザイナーからみた   エンジニア文化アジャイル<スクラム>での開発      CSS Nite LT   16:10  Web制作ではよくありがちな  ウォーターフォール 開発者の間で一般的になってきている     アジャイル        ...
CSS Nite LT   16:10    おとうちゃん、    アジャイルってなに?  考えるな!感じろ!     考えるな!感じろ!
CSS Nite LT   16:10  ですよね…おとうちゃんということで、実際に体験してみた
アジャイルとはウォーターフォール                  CSS Nite LT      16:10ディレクション→制作→チェックのように一直線に行程を流す     スクラムは一種の手法                  スプリント...
役割プロダクトオーナー何をどんな順番で作るかを                 CSS Nite LT   16:10決める人。スクラムマスタープロダクトオーナーからの要望をチーム内で割り当てたり計画・進 の管理をする人。           ...
デザイナーからみた     エンジニア文化     短期間のスパンで、できること01   できないことや優先順位が明確に                       CSS Nite LT   16:10✔ 短期間でフィードバックで改善✔ 1日...
アジャイルの感想ミーティング時間が長いので複数プロジェクト掛け持ちが苦しい                    CSS Nite LT   16:10はじめの設計がかなり重要であり最初に決めたコンセプトを、全員で毎回共有することが大切マニアッ...
Fukui福 井 、マッシュア プ!          ッ
マッシュア プとは          ッ  いろいろ種類があるので一概には言えないですが…すでにある2つ以上のモノや、人、情報等を  混ぜ合わせたり組合わせたりして    新しいモノを作り出すこと           ×
Mashup Awards 8昨年はmelocy<メロシー>は2位でした!
福井勢の応募&健闘がめざましく、全国でも応募数5位・受賞率2位という結果
めがね会館にある            MAの運営福井のWebコミュニティ                                 Web制作に関わる人の   WCAF        ふくい産業支援センター               ...
地方からでも 発信できる! エンジニアとデザイナーと情報のMashup  もっとエンジニアさんとデザイナーで話をしてほしい。 お互いに持っている能力を出して、もっと楽しいモノづくりを。アプリ開発には、デザイン重要!と言われながらも デザイナー不...
ハッカソンします!          おやつツキハッカソン&アプリ初心者デザイナーさんWelcome!※今回は少々甘口です。
まとめ
地方にいながら発信&人のマッシュアップができる                CSS Nite LT   16:10コミュニケーション力は重要身近なところから始めよう                   地方、いいよ!とにかく手を動かして作り、...
デザイナーの役割フル活用でよりよいモノづくり                 CSS Nite LT   16:10作るだけでなくプロジェクトを   Webデザイナーは、良い方向へと導く役割も      アプリ開発でも             ...
ありがとうございました。 CSS Nite in FUKUI, Vol.6 2013.02.23
Webとスマホとデザインと - 地方から広がるつながるデザイナーのお仕事 -
Upcoming SlideShare
Loading in …5
×

Webとスマホとデザインと - 地方から広がるつながるデザイナーのお仕事 -

0 views

Published on

Published in: Design
  • Be the first to comment

Webとスマホとデザインと - 地方から広がるつながるデザイナーのお仕事 -

  1. 1. Webとスマホとデザインと- 地方から広がるつながるデザイナーのお仕事 - CSS Nite in FUKUI, Vol.6 2013.02.23 山森美穂
  2. 2. 自己紹介福井県在住のデザイナーふたりの女の子のおかあさん CSS Nite LT 16:10似顔絵を描くのが大好きグラフィック・Webデザインを経て、アプリのUIデザインをやってハマる 山森美穂昨年のCSS Nite in FUKUI に登壇! mihoYamamori
  3. 3. 自己紹介 江市めがね会館にある株式会社jig.jpに就職したペーペー CSS Nite LT 16:10もちろん! へ ん ら こお仕事は、デザイナー こアプリのUIデザインをしています めがね会館
  4. 4. Agenda Webデザインとアプリデザイン デザイナーからみたエンジニア文化Fukui 福 井 、マッシュア プ! ッ
  5. 5. Webデザインとアプリデザイン
  6. 6. 違 対象 CSS Nite LT 16:10Webデザイン 操作性 素材 アプリデザイン 組み方
  7. 7. Webデザイン 対象 アプリデザイン各ブラウザ対応 CSS Nite LT 16:10IE Firefox Chrome... iOS / Android WindowsPhone....PC画面最近ではタブレット&スマホも対応の対象に スマホ画面 iOSはiPhone/iPad数種 Androidはサイズ多様
  8. 8. Webデザイン 操作性 アプリデザインマウスで選択&クリック CSS Nite LT 16:10マウスで細かく選択ロールオーバーがある 指でタップ&フリック 指の大きさで選択 AppleやGoogleでの ガイドライン Microsoftも…
  9. 9. ユーザーが 使うか決まるUI 歩きながらや、 CSS Nite LT 16:10 CSS Nite LT 16:25 片手しか使えないときでも タップしたときに反応 + ロールオーバーがないので、 直感で押せる、押したくなる 押したのが分かるボタン 指の大きさを考慮した 大きさと配置
  10. 10. Webデザイン 素材 アプリデザイン全体のデザイン CSS Nite LT 16:10サイトデザインは比較的固定で、コンテンツを作り上げる事が中心 全体のデザイン・コンテンツ全ページ・ファビコン 全体をデザインしても、・Flash アイコンやボタンが多い… 各画面、操作性を考えながら iOS/Androidそれぞれで… ・ホームアイコン ・通知アイコン ・ステータスアイコン ・iTunesストア用/GooglePlay用
  11. 11. アイコンはアプリの 顔 むげんメモ CSS Nite LT 16:10 3日間話し合いながら作成 melocy<メロシー> ロゴとアイコンだけで 検討の期間ふくめ1ヶ月くらいかけて決定
  12. 12. Webデザイン 組み方 アプリデザインHTML CSS Nite LT 16:10CSS 主にエンジニアサイドFlash ネイティブJavaScript 各OSの専用のツール 専用の言語で作られていくデザイナーで完結できる HTML JavaScript
  13. 13. 同tool 主にPhotoshopやFireworksを使用UX ユーザーが、いかに使いやすく分かりやすいか、 いつ見て、どのように使うのかを考えながら作るbranding デザイナーの役割を活かし全体をブランディング
  14. 14. デザイナーからみたエンジニア文化
  15. 15. CSS Nite LT 16:10BtoCのアプリ開発企画∼開発∼運営までを一貫して行っているエンジニアと社内デザイナーがチームで開発
  16. 16. 今年1月 「教えて!おと ちゃん」 リース う をリ !
  17. 17. 今年1月 「教えて!おと ちゃん」 リース う をリ !
  18. 18. デザイナーからみた エンジニア文化アジャイル<スクラム>での開発 CSS Nite LT 16:10言葉の違いやミーティングの時間エンジニアさんはマニアック!
  19. 19. デザイナーからみた エンジニア文化アジャイル<スクラム>での開発 CSS Nite LT 16:10 Web制作ではよくありがちな ウォーターフォール 開発者の間で一般的になってきている アジャイル アジャイル?アジャイル?教えて!おとうちゃん!
  20. 20. CSS Nite LT 16:10 おとうちゃん、 アジャイルってなに? 考えるな!感じろ! 考えるな!感じろ!
  21. 21. CSS Nite LT 16:10 ですよね…おとうちゃんということで、実際に体験してみた
  22. 22. アジャイルとはウォーターフォール CSS Nite LT 16:10ディレクション→制作→チェックのように一直線に行程を流す スクラムは一種の手法 スプリント #1 1weekアジャイル スプリント #2短い期間で区切って、 1week設計→開発→テストを繰り返し、 スプリント #3軌道修正しながら完成を目指す 1week計画の最後には、レビューとふりかえりを毎回行う
  23. 23. 役割プロダクトオーナー何をどんな順番で作るかを CSS Nite LT 16:10決める人。スクラムマスタープロダクトオーナーからの要望をチーム内で割り当てたり計画・進 の管理をする人。 プロダクトオーナー スクラムマスターチーム割り当てられた作業の実行。成果物を生み出す人。 チーム
  24. 24. デザイナーからみた エンジニア文化 短期間のスパンで、できること01 できないことや優先順位が明確に CSS Nite LT 16:10✔ 短期間でフィードバックで改善✔ 1日1日の作業目標を持つ✔ 常に成果物がある02 チームでMTGを重ねて、 アジャイル の 意識の共有とコミュニケーション スクラム!✔ お互いの専門用語意味の違いの改善✔ コミュニケーションで目的を同じに
  25. 25. アジャイルの感想ミーティング時間が長いので複数プロジェクト掛け持ちが苦しい CSS Nite LT 16:10はじめの設計がかなり重要であり最初に決めたコンセプトを、全員で毎回共有することが大切マニアックなエンジニアとのコミュニケーションと理解する能力がとても重要! やってよかったね!
  26. 26. Fukui福 井 、マッシュア プ! ッ
  27. 27. マッシュア プとは ッ いろいろ種類があるので一概には言えないですが…すでにある2つ以上のモノや、人、情報等を 混ぜ合わせたり組合わせたりして 新しいモノを作り出すこと ×
  28. 28. Mashup Awards 8昨年はmelocy<メロシー>は2位でした!
  29. 29. 福井勢の応募&健闘がめざましく、全国でも応募数5位・受賞率2位という結果
  30. 30. めがね会館にある MAの運営福井のWebコミュニティ Web制作に関わる人の WCAF ふくい産業支援センター CSS Nite 佐藤さん 盛り上がっている 福井の開発者コミュニティ ご当地アプリ博 江から広がる FITEA オープンデータ
  31. 31. 地方からでも 発信できる! エンジニアとデザイナーと情報のMashup もっとエンジニアさんとデザイナーで話をしてほしい。 お互いに持っている能力を出して、もっと楽しいモノづくりを。アプリ開発には、デザイン重要!と言われながらも デザイナー不足らしいですよ?
  32. 32. ハッカソンします! おやつツキハッカソン&アプリ初心者デザイナーさんWelcome!※今回は少々甘口です。
  33. 33. まとめ
  34. 34. 地方にいながら発信&人のマッシュアップができる CSS Nite LT 16:10コミュニケーション力は重要身近なところから始めよう 地方、いいよ!とにかく手を動かして作り、発信することで地方からでも世界に発信できる Fukui
  35. 35. デザイナーの役割フル活用でよりよいモノづくり CSS Nite LT 16:10作るだけでなくプロジェクトを Webデザイナーは、良い方向へと導く役割も アプリ開発でも 活躍できるデザイナー不足と言われている今がチャンス
  36. 36. ありがとうございました。 CSS Nite in FUKUI, Vol.6 2013.02.23

×