/ Meet the Designer

Meet the Designer #3 | Sercan Yavasoglu x Patika

Meet the Designerは毎回Artefactに所属するUIデザイナーが登場し、デザインした一つのプロダクトを通してそれぞれのデザインプロセスや考え方、テクニックに迫るシリーズです。

Sercan Yavasoglu

https://dribbble.com/sercanyavasoglu

1_r2YtOOobnYG6ufMsLfzQfw

複数のデジタルエージェンシーやグローバル企業にて6年間経験を積んだのち、フリーランスに転向。
UIデザインを得意領域としながら、ロゴデザインやスタートアップ企業のブランディングも手がける。

Patika

http://www.patika.me/

1_IuAefHwNECfbTTpOCVxvPA

様々な目的に合った瞑想を行うことを助けるモバイルアプリ。
近年、スタートアップ企業などでも生産性や効率アップのために取り入れられている"瞑想"をアプリを使いながら簡単に実践できるように開発されており、毎日ストレスなく直感的に使えることを目指したUIデザインが特徴。

"自己紹介をお願いします。"

Sercan Yavasogluといいます。

グラフィックデザインを専攻した後、卒業制作としてとある企業向けにUIデザインを制作したことをきっかけに、その会社でデザイナーとしてのキャリアを開始しました。その後、様々なデジタルエージェンシーやグローバル企業にて多様なデザイン経験を積み、フリーランスへ転向しました。

PatikaはフリーランスとしてUIデザインを手がけ、35,000を超えるユーザーに日々利用されるアプリに成長しました。

"Patikaをデザインすることになったきっかけについて教えてください"

Patikaはフリーランスとしての初期に手がけたプロジェクトの一つでした。
過去に働いていたデジタルエージェンシーの友人の紹介を通してプロジェクトを知り、アプリのコンセプトを自分自身がとても気に入っていたこともあり、アプリのUIデザインを良くしたいというモチベーションを持ってプロジェクトに参加することができました。

"Patikaをデザインする際に担当した領域、ワークフローについて教えてください"

ロゴ、ブランディング、UIデザイン(モバイルとWeb)、App StoreとGoogle Playのデザイン、広告用バナーなどサービスのデザインに関する全てを担当しました。

ワークフローとしては、まずロゴをはじめとしたブランディング領域のデザインから入ることでコンセプトやターゲットのイメージを明確にしました。
UIデザインのためには始めからグラフィックデザインに取り組むのではなく、

  1. ワイヤーフレームの制作
  2. ワイヤーフレームの決定
  3. UIコンポーネント(ボタン、ナビゲーションなど)の制作
  4. InVisionでのプロトタイプ作成
  5. プロトタイプを使ったβテスト

といったアプリのロジックを構成する要素に多くの時間をかけ、デザインがビジネスバリューを最大限に引き出せることを確認した上でアプリ全体のUIデザインを行いました。

1_rhOiJknzSjRz3K8xLmkArw

"PatikaのUIデザインのためにこだわった点、インスピレーションの元として参考にしたものなどはありますか?"

"瞑想"という繊細なトッピックを取り扱うアプリであったため、強すぎる色味やあまりに明確なコントラストといったものを使わない様に気をつけました。今回のアプリの場合使いやすさだけでなく、アプリを利用するユーザーの感じる色味や雰囲気などを含めたUXデザインを考えることが重要でした。

シンプルなメイン画面を基本としながら、ユーザーが直感的に操作できる様なアイコンセットのデザインに時間をかけました。

"UX面で気をつけたことなどあれば教えてください。"

PatikaではUXデザインを行う際に、他多くのスタートアップ企業と同様、ユーザーテストのための被験者を雇うための予算がありませんでした。

そこで、様々なカフェにて周りに座っているお客さんをターゲットにコーヒー1杯に引き換え、デザインやプロトタイプを実際に試してもらうという方法をとりました。

この方法で様々なユーザーフィードバックをプロダクトの企画、設計段階で得ることができ、リリース前に大きなUX的な問題を解決することができました。

1_zqRs299I5xnPodu2tjravQ@2x

結果として、リリース後にもUX面で大きな改修や後戻りをする必要がなくプロジェクトを継続することができています。

ただし、デザイナーとしては常にデザイン上の間違いや改善点を見つけることを心がけており、それらを改善することが現在の楽しみでもあります。

"デザイナーとしてデザイン以外の部分でプロジェクトに貢献できる部分は何ですか?"

スーパーマーケットのアプリであってもハンバーガー屋さんのアプリであっても、デザイナーがプロジェクトに参加したアプリとそうでないアプリを並べた時に見えてくる違い、それがデザイナーの生み出す価値です。

これは、色味、フォント、イラストなどのわかりやすいデザイン的な部分のみならず、プロダクトの360度全ての設計に感する設計に責任を持つことがデザイナーの仕事だということです。

そのためにも、デザイナーは常にプロジェクトに関して誰よりも理解を深め、主体的にプロジェクトに関わる必要があると思います。その上で、最新技術やトレンドといったデザイナーとしての知見を持ってプロジェクトを成功に導くことができると思います。

これらの総合的な設計をプラットフォームに関わらず(TVやビルボードなども含めなんでも)行うことができるデザイナーこそが本当のデザイナーと言えるでしょう。

"制作に使用したツール、環境等について教えてください。"

Adobe XD, Sketch App, Photoshop, Illustrator, Invision ve Zeplinを主に使っています。

ワイヤーフレームを制作する際には紙と鉛筆で設計した後に、Adobe XDで具体的なアウトアプットを制作、アイコンを制作する際にも紙と鉛筆でコンセプトを練った後にIllustoratorでデザインするなど、ソフトウェアが発達した今でも紙と鉛筆は手放せない重要なツールです。

仕事環境については、お気に入りのカフェや自宅、クライアントのオフィスなど様々です。

静かであること、インターネットが速いこと、コーヒーが美味しいことが生産性を高めるために重要な基準となっています。

"納品の際に工夫していることはありますか?"

スタイルガイドラインを必ず制作するようにしています。

スタイルガイドラインは、後からプロジェクトに参加するデザイナーが簡単に新しいデザインを追加できるためにとても重要だと思います。

また、スタートアップのサービスなどで常に細かい修正を繰り返す必要がある場合、エンジニアがちょっとした修正を行う場合にもスタイルガイドラインがあると全体の統合性を損なうことなくプロジェクトをアップデートすることができます。

"今後挑戦していきたい領域・プロジェクトなどはありますか?"

新しいブランディングやプロダクトに関わることは常に大きなモチベーションとなります。

そのため、今後もブランディングからUIデザインまで一貫して関われる様なプロジェクトに関われると良いと思います。