Border

Violet

App, Logo / Design, Develop (2021)

Logo, App Icon

UI

Description

シンプルなTumblrクライアントアプリ「Violet」を個人制作した。
App Store、Google Playで公開中。

クロスプラットフォームでリリースしたい、書き慣れたJavaScript(TypeScript)でアプリを開発したい、ということでReact Native + Expoでの開発を選択した。
リリース後、Hermes + EAS Buildにも対応し、バイナリサイズの大幅な削減もできた。

デザインはFigmaで作成。
iOS/Androidでなるべく共通のUIにはするが、タイポグラフィやナビゲーション周りなど、両OSで文脈が異なる箇所はしっかりデザインを変え、それぞれのOSでアプリを使っても違和感のないようなUIを目指した。
Reblog/Like/シェアボタンを画面下部にフローティングで表示し、また、画面をダブルタップ/トリプルタップでLike/Reblogをできるようにするなど、昨今の大画面スマートフォンでも片手で操作しやすいように考慮している。

アプリのロゴはVioletの「V」をモチーフにしてデザインした。

多言語対応もおこなっている(現在は日本語と英語のみ)。

URL

https://violet-app.tumblr.com/

Design Tool

  • Figma

Teck Stack

  • React Native /
  • Expo