Adobe XD でモックアップ書いた【Day6】
こんちは、ぐちです！
冷静に休日にブログ書くのは、大体予定入っているし厳しいっすね💦
昨日の進捗を報告したいと思います
昨日はAdobe XDでポートフォリオサイトのモックアップを書きました！↓
Cacooの使用を断念
以前こちらの記事で「Cacoo」というサイトを紹介したのですが、
使ってみると、
・機能が少ない
・要素ごとのピクセル幅がわからない
などの理由から、やっぱり使用を断念しました(>_<)
DLしなくて済むので、用途を選べばパッと使えていいかもしれないです。
Adobe XDが強すぎた
その代わりに昨日から使い始めた、Adobe XDですが、
色々と便利すぎることがわかったので、こちらを紹介させていただきます。
ダウンロードはこちらから↓
what is Adobe XD?
Adobe XDは、webサイトや、モバイルアプリなどのデザインに適した、オールインワンのUX/UIソリューションです。デザイン、プロトタイプ、共有、すべてをXDでおこなえます。
とのこと。
AdobeシリーズのUX、UIに特化したソフトです！
UI/UX用のソフトで有名なのは
「sketch」等ですが、こちらは、買い切りとはいえ数千円します💦
XDは小容量で使用する場合は無料となっております！
個人でちょっとWebデザイン始めてみたいなーって方にはオススメかなとおもいます。
便利な用法などはいつかまとめたいと思います。。。！
自分が使う上で参考にさせていただいたサイト↓
モックアップの説明
作ってみたのがこちらです！
まあ見ての通り
ショボショボ丸なんですが、一作品目なのでお許しください(笑)
素人ながら気を付けた点は
配色を灰色・水色・濃い水色にして、統一性があるようにした
ことです。
本に紹介されていた、製氷機のサイトのカラーコードを真似したのですが、
現在そちらのサイトはリンク切れでした。。。
左上にロゴを配置したり、フォントとかももっと最適解あると思うんですが、
とりあえず、モックアップ➡コーディングの流れを掴んでみたかったので、
サクッと作成しました。
後にReactで再実装する予定なので、その時にもっとがっつり
デザインしてみたいと思います！
では～
