Shoeisha Technology Media

CodeZine(コードジン)

記事種別から探す

DeNAのスマホアプリのUX向上に活かされている技術とアイデア

「Yahoo! JAPAN DeNA iOSエンジニア UI/UXデザイナー勉強会」レポート 【DeNA編】

  • LINEで送る
  • このエントリーをはてなブックマークに追加

 7月16日に、Yahoo! JAPANとDeNAの合同イベント「iOSエンジニア・UI/UXデザイナー勉強会」開催されました。今回は後編として、DeNAのエンジニア/デザイナーによる発表の中から、いくつかピックアップしてレポートします。

目次

 ヤフーサイドを取り上げた前編も、ぜひ併せてご参照ください。

「現場でのデザイナーとエンジニアの連携の実際」(DeNA吉田さん)

株式会社ディー・エヌ・エー iOSエンジニア 吉田正史さん
株式会社ディー・エヌ・エー iOSエンジニア 吉田正史さん

 吉田さんは「QuizNow」というクイズアプリを開発しており、開発現場において、デザイナーとエンジニアがどうやって連携しているか、どうやって効率化を図っているかについての発表を行いました。

 一昔前のWebの時代と比べ、ネイティブアプリ開発では扱うデザイン要素が増えました。写真や動画、アニメーション、サウンドなどのさまざまな表現方法を取り入れることができるようになった反面、実装することやデザインすることが多くなり、エンジニアとデザイナーの間のコミュニケーションが難しくなっています。

「Rabbit Cam」での事例

 吉田さんは、エンジニアとデザイナーとのやりとりを効率化する手法の一つとして、「調整用アプリの作成」を挙げました。

 「Rabbit Cam」という動画合成アプリの開発で活用した方法で、「動画フィルターの調整やアニメーションスタンプの確認の作業で役に立った」とのこと。本番向けのアプリとは別に調整専用のアプリを作成してデザイナーに渡し、そのアプリを使ってフィルタのパラメータ調整やスタンプの確認の作業を行ってもらいます。この手順で進めることによって、詳細なアウトプットをデザイナーに作ってもらってから、一気にエンジニアが実装をすすめることができたそうです。

 また、「デザイナーのイメージ通りのものが作れた」「デザイナーとエンジニアの間のやりとりのコストが削減できた」などの効果があったと振り返りました。一見すると調整アプリの作成自体にもコストがかかるように思えますが、それを上回るような効果があったそうです。

Rabbit Camの調整用アプリ:動画フィルターのパラメータ設定をリアルタイムに反映して確認できる
Rabbit Camの調整用アプリ:動画フィルターのパラメータ設定をリアルタイムに反映して確認できる

「QuizNow」での事例

 また、「QuizNow」というクイズアプリの演出アニメーション作成に関しては「先にデザイナーに完成イメージの動画を作成してもらい、それを見ながら実装を進める」という方法を採用したそうです。効果については、「質問や確認に使う時間が削減できた。動画の中で本番向けアプリでも使えそうな部分はそのまま使うことで工数を削減できた」と振り返りました。

QuizNowでデザイナーに作ってもらった完成イメージの動画
QuizNowでデザイナーに作ってもらった完成イメージの動画

エンジニアとデザイナーの交流

 吉田さんが所属する開発チームでは「非エンジニア向けのアプリ開発勉強会」や「エンジニア向けのデザイン勉強会」などの勉強会を頻繁に行っており、エンジニア/デザイナーが双方の知識を持てるように努めているそうです。「エンジニアとデザイナーが、お互いのバリューを出せるようなやり方を見つけよう」とまとめました。

参考資料


  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

バックナンバー

連載:イベントレポート

もっと読む

All contents copyright © 2005-2017 Shoeisha Co., Ltd. All rights reserved. ver.1.5