【実践】Webデザインはこんな感じで作る！ノーカット製作の流れ。

🎨 実践的なスキルを身につけるオンラインスクール 『HIROCODE Academy（ヒロコードアカデミー）』🎨 現場で即戦力として通用するデザインとコーディングの技術を、ヒロ本人が直接指導します。 詳細・受講のお申し込みはこちら👉👉👉 https://hirocodeweb.com ------------------------------------------------------------------------------------------ 今回は、ウェブデザインの制作の流れを紹介しています。 AdobeXDを使用したデザインの手順や、デザインをする上で、何を考えているかなどを知っていただけたらと思います☺️ 🔽 続きの動画はこちら：HTMLコーディング 🔽    • 【実践】HTML/CSSコーディングの流れ！ノーカット製作風景。HTML編   🔽 第2弾はこちら：【ノーカット】FigmaでWebデザイン 🔽    • 【Figma実践】WEBデザインで、ポートフォリオサイトを作る！ノーカット制作の流れ...   🎥 この動画の構成 🎥 00:00　WEBデザインはこんな感じで作る 00:44　AdobeXDを使用してデザインをはじめる 01:17　デザインのサイズについて 01:40　トップビュー（メインビジュアル）の作成 　　　 写真素材（O-dan / Adobe Stock） 02:22　コンテナ（.container）の横幅 02:46　ナビゲーションの注意点 03:08　ロゴについて 03:40　コーディング（HTML CSS）について 04:04　アイコン素材（flaticon） 04:50　アイコンの種類について 05:20　トップビュー（メインビジュアル）の高さ 05:37　画面スクロールについて 06:15　Macbookのモックアップを挿入 07:22　特徴（feature）のセクション 09:29　コピーライト（© / copyright） 10:16　ドロップシャドーで雰囲気を出す 10:29　光るようなシャドー 10:47　完成！ 📂 今回作成したデザインファイル 📂 https://www.craft.do/s/R5pbWq4PobjFit ⭐️ 自分でWebサイト作ってみませんか？ ⭐️ 誰でも、できる！Webサイト公開の流れ！    • 【10分でサイト公開】誰でもできる！Webサイト公開の流れ！   ✅ご視聴いただきありがとうございます🙇‍♂️ この動画を気に入っていただけたら、ぜひチャンネル登録よろしくお願いします❗️ ◆ チャンネル登録 http://www.youtube.com/hirocode?sub_c... ◆ Twitter. ツイッター   / hirocodeweb   ◆ Instagram. インスタグラム   / hirocodeweb   🔋 僕が使っている、おすすめのデバイス 🔋（アフィリエイト広告を使ってます！） ---- マウス ---- 【 ロジクール アドバンスド ワイヤレスマウス MX Master 3 】 https://amzn.to/34Zn5LH " ボタンカスタマイズによって作業の効率化が図れます。アプリケーションごとにカスタマイズ可能です。 " ---- キーボード ---- 【 ロジクール アドバンスド ワイヤレスキーボード KX800 MX KEYS 】 https://amzn.to/38S1B4i " 打ちやすく疲れにくく、タイピング音も静か。長時間コーディングする方にオススメ。 " ---- パソコン ---- 【 Apple 13インチMacBook Pro 2022 】 https://amzn.to/3bDPYmU "最新M2チップ搭載！初期投資で良いパソコンの使用をオススメします。 " ---- 周辺機器 ---- 【 Apple AirPods Pro 】 https://amzn.to/3rAyU4u " カフェでの作業や通勤時間など、ノイズキャンセリング機能で周りの雑音に影響されることなく集中できるようになります。他にApple機器を使用している方はAirPodsがオススメです。 【 Apple iPad Pro 11インチ 】 https://amzn.to/3mZuvoo " macに搭載されているSidecarという機能で、iPadをサブディスプレイとしての利用が可能です。 " 📕 おすすめ書籍 📕 ---- デザイン 基礎編 ---- 【 1冊ですべて身につくHTML ＆ CSSとWebデザイン入門講座 】 https://amzn.to/3o8vofO " webデザインの基礎とコーディング(HTML/CSS)の基礎がわかる。入門者におすすめの一冊です。 " 【 なるほどデザイン 】 https://amzn.to/2X48Z77 " デザイン全般について、図解で視覚的に分かりやすく説明がされている書籍。デザインに興味がある人にオススメです。 " ---- デザイン 思考編 ---- 【 誰のためのデザイン？ 】 https://amzn.to/3o4gzun " デザインにおける役割を理解できる。デザインをする上で何を考える必要があるのかが分かる本。 " 【 IAシンキング Web制作者・担当者のためのIA思考術 】 https://amzn.to/2KETvEn " デザイン以前のサイト設計における思考の方法を身につけるための一冊。 " ---- 書籍デバイス ---- 【 キンドルペーパーホワイト Kindle Paperwhite 】 https://amzn.to/3n2AwRh " 200冊あったビジネス書を処分してこちらを導入。一部デジタル化されていない書籍はありますが、紙の本に特別なこだわりのない方は電子書籍での読書をオススメします。 🎧 BGM 🎧 ---------------------------------------------------------- Music Title: Happy And Joyful Children Music Link:    • Happy Children Background Music / Joyful U...   ----------------------------------------------------------