BLOG マイロプスブログ

access_time2019.04.01

ブログ

2019/3/19 cssnite afterdark参加レポート

こんにちは、折坂です。
今回は、先日参加したCSS Nite After Dark「現場で活用できるマイクロインタラクションの作り方」の参加レポートです。

●マイクロインタラクションとは?
ユーザーのアクションに対するフィードバックやステータスの変化を正しく伝えるための細かなデザインのこと
引用:https://webdesign-trends.net/entry/7583より

●CSS Niteとは?
https://cssnite.jp/

●講師の池田泰延さん
https://twitter.com/clockmaker

  • ・発表の概要
  • ・実際に現場にどう落とし込むか?
  • ・Nuxt.jsへの挑戦
  • ・まとめ

発表の概要

発表は以下のようにマイクロインタラクションに関して網羅的にまとめられており、
二時間でよくまとまったなと関心してしまう内容でした。

  • ・マイクロインタラクションの役割
  • ・ウェブの世界でのマイクロインタラクション
  • ・マイクロインタラクションの必要性
  • ・デザインソフトでの制作
  • ・エンジニアが実装する場合
  • ・今後のマイクロインタラクション

さすが、大阪では再演版をやるぐらいあります。
*この記事を書いてる時点で、すでに再演版もキャンセル待ち!!


参考になったことと感想をいくつか挙げてみました。

  • ・マイクロインタラクションの役割は、ユーザーの認知と行動の手助けである。
  • ・AppleやGoogleなどの先進的な企業はデザインシステムにマイクロインタラクションが組み込まれている。特にAppleのヒューマンインターフェイスガイドラインは、参考になりそうである。
  • ・コンテンツの種類で、マイクロインタラクションの役目が違う。 ウェブの場合は、UIの理解の手助けがメイン。
  • ・池田さんの情報源の紹介、やはりインターネットの海のなかにはまだまだ知らないサイトがあるのだなと、関心してしまいました。海外にはまだまだ知らないサイトがありますね。

実際に現場にどう落とし込むか?

翌日、早速情報を社内共有しました。
マイロプスでは、セミナーと書籍は全面的に会社サポートですが、
参加したら発表がマストです。
予想通りでしたが、ディレクター、デザイナー、エンジニア間での
マイクロインタラクションについての取り扱い(誰が発案し、どのように伝えていくか?)あたりが、話題の中心となりました。
また、社内ではアニメーションに関する知識・経験が薄いので、そこらも勉強の必要があるなと感じるところでありました。

池田さんの発表では、AfterEffectやAnimateとの連携なども発表され、
その中でも、AfterEffect+bodymovinは、実は本サイトのトップでロゴのアニメーションに使いたかったので改めてチェックしてみます。


NUXT.jsへの挑戦

発表の後半でNUXT.js(https://ja.nuxtjs.org/)が紹介されました。
名前は知っていたけど、案件では登場したことなく、事前情報ほぼない状態で説明きいたのですが、控えめにいって凄いですね。
インストールすると、開発環境から、ローカルサーバ、デプロイツール、テストツールまでパッケージで組み込まれるようです。
マイロプスでもよく使うSassとwebpackの環境もはいっているようです。
以前、Movable Type(DATA.API)で、SPAを制作したときは、フロントエンドのインタラクションが弱めで、そこらに強いフレームワークを探していたのですが、DATA.APIと組み合わせるのにちょうどいいかもしれません。


まとめ

CPUが高性能化し、回線が早くなることで10年ぐらい前だとflashで実装していたような表現を、jsをはじめとする代替技術で実装できるようになってきました。
きっと、モバイルは、よりネイティブアプリの挙動に近づいていき、そのために高度な実装が要求されてくるような局面がやってくるのではないでしょうか?

いち制作者としては、難しい技術に挑戦しセンセーショナルなものを作りたいところもありますが、高度な技術が全てのクライアントに必要なわけではないで経営者としては、どのように舵取りしていこうかなと前向きに悩ましいところであります。
ただどんな凄い技術が開発されても、それに惑わされず自分たちのビジョンにそって、クライアントに向き合いビジネスに邁進できればと思います。


ここで求人の話

マイロプスでは一緒に働いてくるエンジニア、デザイナーを募集中です!

  • ・ITとデザインのチカラで、なにか面白いことができないかと思っている人。
  • ・デザインを制作だけでなく人と人、モノ、コトとの関係性の設計と捉え、 社会を動かす重要な概念だと思っている人。

特に、NUXT.jsやPWAなど高度なフロントエンド周りの実装ができるひと、興味があるかたお待ちしております!!

Orisaka

株式会社マイロプス代表取締役 千葉県出身、中央大学理工学部卒業、STRAMD第7期生 製版DTP、映像制作、プログラマー、ウェブ制作 などを経て 2006年 ギャラリーバーノイエ創業 2008年 株式会社マイロプス代表取締役 就任 趣味は、バスケットボールと釣り
twitter @toshi_104i

関連記事

  • access_time2019.02.20

    ブログ

    CSS Nite After Dark 2019 「実サイトで学ぶウェブ解析のキホン」 参加レポート

  • access_time2019.03.25

    ブログ

    "第2回 ZOZO 前澤社長のお年玉リツイート企画は、どのくらい世の中に影響を与えたのか?"に参加してきました

  • access_time2019.03.06

    ブログ

    『未来のレッスン:デザインフィクション ──脱人間中心の試み』に参加してきました。