LoginSignup
5
8

More than 3 years have passed since last update.

【初心者】UIの設計にはAdobeのXDが超絶便利だった件

Last updated at Posted at 2019-10-08

はじめに

こんにちは、僕です。今回はアプリ設計の経験がなかった僕がとりあえずUI作成にと使用したツール「AdobeXD」が超絶便利だったので初心者の方用に参考になればと思い書きました。

使用環境

Adobe XD 22.7.12.3 (スターター)

良かった点

無料

有料版もありますが、まずはスターターで十分です。
このソフトをタダで使えるなんて良い時代に産まれました。

操作性の良いUI

何と言っても一番のメリットはここでしょう。おしゃれなアプリ作成には持ってこいです。本当に使いやすい
他にいくつかUIツールを試しましたが、UIツールなのにそもそもソフト自体のUIが悪いソフトが多すぎます。
それにくらべAdobeXDは白を基調にしたInstagramやAirbnbなどに似たシンプルなデザインで初心者にも使いやすい用に作られています。
スクリーンショット 2019-10-08 11.59.25.png

「アプリを設計したいが、専門的な知識はない」
「でもストアでよく見るあんなダサいデザインにしたくはない」
と思う方にとっては最高のツールではないかと思います。

さらに、これはアプリ開発の話ですがデバイスプレビュー機能という実際にスマホで動かしているような画面で作品を確認する機能もついています。簡単にですがこのボタンでどこに飛ぶといった設定もできるのでおすすめです。さらに、USB接続で専用アプリを入れたiPhoneとリアルタイムで同期し、プレビューができるので、絶対に使いましょう。
スクリーンショット 2019-10-08 16.06.03.png

テンプレートが多い

AdobeXDでは世界中のクリエイターが作ったテンプレートがネットに転がっています。

Adobe XDで簡単にプロトタイプを作れる!おすすめの無料テンプレート15選

とても質のいいテンプレートがたくさんあります。
基本的なフレームワークができていればある程度感覚でなんとかなるものです。
特に僕と同じように学生さんで、他の学生とデザインで差をつけたい人や
開発専門だがデザインにも少し手を出したい!って方は、本当にこのちょっとした努力で評価がかなり変わるので試してみてください!
スクリーンショット 2019-10-08 15.32.40.png
これは僕がテンプレートを参考に一時間程度で作ったフリマアプリのプロフィール画面ですが、デザイン知識のない学生でもここまでできるものです。
なお、デザイン画面はSVGでエクスポートすることでXcode等でもそのまま使えるので安心ですね。

最後に

僕と同じように「デザインの知識がないがアプリのデザインをしたい」という方には本当にぴったりのツールだと思います。
ダウンロードは下記からできます。ぜひお試しあれ。

Adobe体験版ダウンロード

5
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
8