お題探しで見つけた物【UIデザイン学習サイトCocoda!】
こんにちは、そうまです。
自社課題の「webサイト製作」をするためにお題を探していたら見つけた
【UIデザイン学習サイトCocoda!】を触ってみたのでメモします。
UIデザイン学習サイトCocoda!とは「UIデザイナーになりたい人のための練習の場所」だそうです。
架空の依頼が入門編から今日のお題まで様々で、企業とコラボレーションし選考を兼ねたお題までありました。
パッとみた感じプログラミング学習をしている人なら知っている人もいるかもしれませんが、デザイン版「Progate」ぽい感じだと思ってください。
基本的にお題は「アプリケーション画面の製作依頼」が主になっています。
各お題毎に「こういう人がターゲットでこういう風に改善して欲しい」など書かれた10秒くらいの動画が用意されていますので確認してから進めます。
また、こんなアプリを参考にしてね！など参考資料も用意してくれているので良心的です。
サービスを利用するためには新規登録をしてください。
登録内容はメールアドレスとパスワードくらいでした！
ちなみに無料です。
新規登録したあと「コンテンツ」というところから色々なお題が見れるのですが、初心者向けコンテンツと大きく書いてある3つのお題があったので入門編をやって見ました。
一番左の「はじめてのUI-入門編-」って書いてあるやつですね！
開くと一見とても驚きます。
「Adobe Xd」を使うのかと！！
「Adobe Xd」が何かと言うと「アプリケーション画面」や「webサイト」を画面を制作するのに役だつ新しめのAdobeツールです。
PhotoshopとIllustrator要らずとも言われているツールになりますが
作るものによっては必要だと思います。
最近話題の 「Adobe Xd」、私は課題のために1ヶ月買おうと思っていたのでかなり驚きました。あとでちゃんと買います。
無料の体験版があるらしいのでググって探してきます。
webの画面を作るのにいいらしいけど納品に向かないのでは？という話を小耳に挟む程度の知識でしたので思わず「いい練習機会を得た！」と叫びそうになりました。
はじめの課題は「Xdの準備」ですので迷わない事と通信環境がよければ10分くらいで終わります。
中のチュートリアルもサクッと目を通しておくのが入門編の第一課題です。
課題はスライドショーが数枚あり読み終わると、動画がいくつかあるページに飛びます。
詳しく操作が見れるので慣れるために入門編はやっておくと良いです。
入門編は全部で３フェーズくらいあり、導入→お手本のUIを作ってみよう→ECアプリのオリジナルUIを作ってみようという感じで進みます。
第２フェーズではSNSのプロフィール画面を制作しますが
動画で説明してくれるので結構さっくり進めることができます。
こんな感じのを作ります。
画像は用意されているのを使用して進めることができますので
ご安心ください。私は、アイコンの写真だけは自分のツイッターから拾ってきました。
URLは自分のポートフォリオサイトを記載したり一部お手本とは違いますがあまり大きく変えることはしていません。
正直見本を見たとき「え？こんなクオリティ高そうなの作るの？作れるの？」と思いました。
ちゃんと作ることができました！
終わると「できたものを投稿しよう」というものに変わりますが
Xd、画像の書き出しかたがいまいちわからず結構苦戦しました。
Photoshop、Illustratorなどは別名保存で拡張子をちょいちょいと選択して
保存できますがXdは別名保存は「.xd」でしか保存できない…のだと思います。
.jpgなどで保存するには「編集」→「書き出し」→「すべてのアートボード…」で希望したいところに保存してください。
そしたらファイルを画面から選択して投稿してください。
すると別の投稿を見てくれた参加者から「いいね」などの反応をもらうことができます。時々、コメントをもらえることもあるみたいです。
投稿された作品はポートフォリオがわりにもなるようですので、どんどん課題をこなして増やして行くのもいいと思います。
「みんなのフィード」という項目からは投稿された作品をたくさん見ることができますのでぜひ見てください。
私はCocoda!に出会えてXdを使ういい機会を得られたと思いますし、
一人で使っていたら結局最後まで使わずにいる気がしました。
投稿した作品は多くの人の目に触れられますし、反応をもらえることもあります。
しかし、反応をもらえるのは「いい感じの作品」が多くて
フィードバッグしてもうらうための環境ではない気がしました。
もし、Cocoda!を使うとしたら「Xdを使いこなせるようになりたい。」「UIデザインについて触れてみたい」という駆け出しはじめた人たちのためのサービスだと思います。
もっと良いものを作るために「どう直したらより良いものになるか」というコメントが欲しいという方はデザインのコミュニティに入った方が良い経験を得られるのではないかなと思います。
