Create Mockups for a Website Homepage in Adobe XD

提供:
Coursera Project Network
このガイド付きプロジェクトでは、次のことを行います。

Create a webpage mockup in Adobe XD

Clock2 hours
Intermediate中級
Cloudダウンロード不要
Video分割画面ビデオ
Comment Dots英語
Laptopデスクトップのみ

By the end of this project, you’ll be able to create mockups for a website homepage. You’ll build your mockups with Adobe XD, a vector-based graphics design and prototyping program. XD gives you the ability to design multiple iterations of webpages, all the way from wireframes to high-fidelity mockups. Since the designs are vector-based, you’ll also have the flexibility to edit and resize quickly and easily. You’ll be able to test and compare lots of different designs, with high-fidelity images and text. During this project, you’ll build a homepage for a coffee subscription website. First, you’ll get used to navigating the XD workspace. Then you’ll design common parts of webpages, import and adjust images, and insert text. As you complete these steps, you’ll add colors, character styles, and components to your asset list, giving you the ability to quickly make changes across the whole page. By the end of the project, you’ll be comfortable creating webpage mockups with Adobe XD. Note: This course works best for learners who are based in the North America region. We’re currently working on providing the same experience in other regions.

あなたが開発するスキル

  • Web Design
  • Graphic Design
  • XD

ステップバイステップで学習します

ワークエリアを使用した分割画面で再生するビデオでは、講師がこれらの手順を説明します。

  1. Navigate Adobe XD workspace

  2. Design your homepage mockup’s header and footer

  3. Import images into your Adobe XD mockup

  4. Insert and edit text in your Adobe XD mockup

  5. Save and share your homepage mockup

ガイド付きプロジェクトの仕組み

ワークスペースは、ブラウザに完全にロードされたクラウドデスクトップですので、ダウンロードは不要です

分割画面のビデオで、講師が手順ごとにガイドします

よくある質問

よくある質問

さらに質問がある場合は、受講者ヘルプセンターにアクセスしてください。