wp-admin自動家計簿マネーフォワードを担当しているディレクターの村里です。#4』のレポートです。Vol.1』と題して、エンジニアを中心にデザインツールSketch.appについての勉強会を開催しました。開催の趣旨は、よくあるエンジニアにデザインのことをもっと深くわかってもらうこと、ではなく、エンジニアがデザイナーに頼らずとも自力で作業を進ようになることです。そのきっかけとしてのSketch.appの入門イベントです。いうのも、マネーフォワードのスマホ開発チームでは、デザイナーとエンジニアの間でのデザインファイルのやりとりの際にスライスした画像ではなく、Sketch.appのファイルをそのまま渡してエンジニア側で切り出ししてもらっています。これを社内の文化として根付かせたいという思いもありました。エンジニアドリブンを目指すマネーフォワード。←なぜなのかデザインのことが理解できるかも?何を読み取ればいいのかこれからのエンジニア-デザイナのやりとりの境界線は?実演します!ざっと内容を要約すると、Sketch.appとはどんなツールなのか?Sketch.appの魅力と、他のツールとの違いや使い分けなどを説明しました。←なぜなのかSketch.appはPhotoshopやIllustratorなどのデザインソフトと違い、ツールの数も少なく操作が簡単ですデザイナーからエンジニアに作業が移動するときには画像だけでなく、Viewを作るのに必要な背景や文字の色、大きさなどのメタ情報も必要になります。エンジニアにデザインを渡すときにこれらの情報を指示書として作成すると毎回の負担が大きくなってしまいます。実際Sketch.appを使ってエンジニアが直接デザインファイルを触りながらプログラミングができるようになり、社内のエンジニアからは作業がしやすくなったとのコメントをもらいました。デザインのことが理解できるかも?何を読み取ればいいのか前章とかぶる内容でもありますが、デザインファイルを直接触れることによって、デザイナーが作ったガイドや構造をみる機会も増えますので、デザインの意図を理解することができるようになります。これらのことは一見エンジニアの負担が増えるように思えますが、Sketch.appによって作業自体は簡単・効率化されますので、その分デザイナーとエンジニアがデザインについてコミュニケーションの機会を増やすことができるといいなーと思っています。これからのエンジニア-デザイナのやりとりの境界線は?結論からいうと、お互いの作業領域をある程度知ることが必要で、デザイナーもプログラミングを知る必要があるし、エンジニアもデザインの意図が汲めないと円滑に作業が進みません。私がいたグラフィックデザインの業界でも、カメラの性能や印刷技術が向上するに伴いそれぞれの職域の境界線がなくなってきていることを実感しましたので、Webやスマホの世界でもそういう流れになってくるのではという思いがあります。いった話に加え、実際にSketch.appを使いながら、簡単にデザインができるソフトであることを紹介しました。vol.1では概要的な話メインでしたが、今後はもっとワークショップ的なところも含めてやっていきたいと思っています。2014年最後のマネーフォワードエンジニアブログになりますが、2015年もマネーフォワードはあたらしことをどんどんやっていきたいと思っています。みなさん、良いお年をお迎えください。エンジニアだってデザインがわかりたい!!マネーフォワードでは、デザインもプログラミングもできるスーパーデザインエンジニアを募集しています。