Adobe XD Creative Challenge シーズン3 Week1

  • 最終更新日:

こんにちは、みおです。
Adobe XD Creative Challenge シーズン3が始まりました!!
もちろんシーズン3も参加します!

Week1の課題は『#01 ファイルアップロード』『#02 単語学習アプリ』でした。

Adobe XD Creative Challenge シーズン3についてはこちらのAdobeブログでご確認ください。
https://blogs.adobe.com/japan/cc-web-adobe-xd-creative-challenge-season3/

#01 ファイルアップロード

Week1 1つ目の課題は『ファイルアップロード』です。
今回チャレンジするXDの機能は

リピートグリッド
ドラッグ
自動アニメーション

の3つです。

この課題は2パターン作りました。
1つ目のアートボードはこちら。

シンプルな写真のアップロードの画面だけなのでアートボード数も少ないです。
ローディングのアニメーション用でアートボードを6枚使ってます。

もう1種類のアートボードはこちら。

こちらは部屋の模様替え(色替え)のシミュレーション。
ソファをXDのパスで書いてたらめっちゃ時間がかかってました(←
そしたら時間がなくなって決まった色にしか変更できず…。
他の色も追加できたりっていうのも考えてましたが間に合いませんでした(泣
ちゃんと時間考えて進めないとダメですね。。。

プレビューはこちらから
▼ 1つ目

▼ 2つ目

プロトタイプはこちらから
▼ 1つ目
https://xd.adobe.com/view/4e26f555-0c16-48e9-6798-4843c19deb88-3817/

▼ 2つ目
https://xd.adobe.com/view/be754658-4fb8-4b4d-7623-4db2d76cebc7-c844/

#02 単語学習アプリ

Week1 2つ目の課題は『単語学習アプリ』。
今回チャレンジするXDの機能は

自動アニメーション
ドラッグジェスチャー
コンポーネント

の3つです。

アートボードはこちら。

10問分つくったのでその分アートボードは多いですが、やってることは単純です。
CC道場の解説動画ではカードが裏返る動きを実装してましたが、うまくできなかったので諦めました…。

プレビューはこちらから

プロトタイプはこちらから
https://xd.adobe.com/view/fe442a2a-bdd4-4e10-4a17-d63a01010afc-8875/

まとめ

シーズン2は単純なことしかできなかったので、シーズン3は変わったことやってみようと思いましたがやっぱり難しいですねー。
もっとデザインの勉強しなければ…。

9月18日(水)にはWeek2の課題が発表されます。
途中から参加しても参加賞がもらえる可能性もあります。
素晴らしい作品にはノベルティなどももらえるチャンスも!
ぜひ途中からでも参加してみんなで盛り上げましょー!!!