【Webデザイン初学者向け】Adobe XD超基礎ショートカット+テクニック（5分）｜Kouhei Hayashi / はやし こうへい｜note
僕はデジタルハリウッドSTUDIO福岡でWebデザイン専攻の講師をしております。カリキュラムの中で、Adobe XDを使った授業も実施しています。 特に「Webデザイン初心者の方」の操作を隣で見ていると、「移動」や「拡大・縮小」など、基本的な使い方で手の進みが遅くなっていることに気が付きました。 ああ、Adobe XDに慣れていないのではなく、そもそもAdobe慣れしていないのだと！そんな「Webデザイン初学者」の方や、「Adobe製品をはじめて触る」方に、今のうちにクセづけておいて欲しい超基礎テクニックをご紹介します。 「テクニック」という言葉が大袈裟に聞こえる程、先輩デザイナーの方は日常的に無意識に繰り返している動作なので、便利な新機能やプラグインの以前に身につけておくべき、とても大事なことです。 Adobe XD上でのお話になりますが、Photoshop（以下Ps）やIllustra
【webデザインの学習】XDでwebサイトの模写をしてみる｜ちづみ
こんにちは！ちづみ です！(ブログはこちら）（＾_＾） 以前このようなツイートをして、少し反響があったので、私がいつもXDでwebデザインの模写する時に行っている手順をnoteにまとめました😊 ✅拡張を駆使した速い模写の準備(XD) クロームの拡張Window Resizer で予定のカンプの幅にブラウザを変更 ↓ クロームの拡張Full Page Screen Captureでスクショ ↓ XDの拡張Mimicにurlをコピペ ↓ スクショを複製し1枚はトレース用に薄くひく ↓ サイトの検証も見ながら数値等を確かめつつ模写 pic.twitter.com/BSV8KPnBNM — ちづみ (@098ra0209) October 6, 2019
ワイヤーフレーム模写で学ぶ！Adobe XDチュートリアル
Adobe XDでこれからワイヤーフレームを引いていきたい方へ！爆速の制作環境Adobe XDへようこそ！ この記事では、既存サイトを「模写」しながら、ワイヤーフレーム作成に必要なAdobe XDの主要機能と手順を紹介しちゃいます。題材は先日別記事(RFPの話)でも紹介した “Boston.gov” です。 書体がかわいいので(Montserrat + Lora)、手順上書体設定を反映していますが、日本語サイトでやる場合はヒラギノ／メイリオでいいと思います。また、ワイヤーの粒度は人によりますので、それぞれの粒度でやってみてください（筆者の粒度は相当細かい方だと思います。別にレイアウトをデザイナーさんに指示するつもりはないのですが、CMSでのコンポーネント化はかなり意識して作業しています）。 さて、まずはAdobe Experience Design CC (Beta) を開きます。macO
Adobe XDでLINEデザインを作ってみた【使い方解説】
Adobe XD CCってどういうツール？ Adobe XD CCはWebサイトやスマホアプリなどを手軽にデザインするためのツールで使い方も簡単。さらに、デザインした複数のページを簡単につなげて、実際に動いているかのようなプロトタイプを作る事もできるんだ！ Adobe XD CCはそれらを直感的な操作で仕上げる事ができ、軽量で使いやすいUIになっているので、人気がぐんぐん上がっているのだ。 まずは完成形のデザイン 今回はAdobe XD CCで「ドラえもんのLINEグループ」というコンセプトで簡単にデザインしてみた。作業時間だけで言えば「15分」もあればデザインできてしまう。 今回はこのデザインを元にAdobe XD CCの使い方を学んでいこう！ Adobe XD CCのスタート画面の使い方 Adobe XD CCをインストールしたら最初に次の画面が立ち上がり、デバイスから選ぶ形でアートボ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
