WEBデザイン課題:クリエイターのためのコワーキングスペース「Pass Office」

Figmaの練習問題

課題概要

Figma向けのWEBデザインの課題です。

フリーランスのクリエイター向けコワーキングスペース「Pass Office」のウェブサイトデザインの制作をお願いします!

Pass Officeは、利用者同士でインスピレーションを得て、新しいコラボレーションがどんどん生み出る場所を目指しています。

この課題は3つのレベルに分かれています。
学習者のスキルに合わせてレベルを選択してください。
レベルが高いほど難しくなります。

キャンバスサイズ 
PC版 : 横幅1366px
SP版:横幅375px 
納品形式 Figmaで出力したPNG

レベル1 : デザイントレース

見本サイトをそのまま再現してください。

レベル2:自由にアレンジ 【おすすめ】

実際に依頼された想定で、見本画像を参考にデザインを行ってください。
見本画像は「ワイヤーフレーム」の扱いでデザインしてください。

コンテンツの追加、変更、削除、キャッチコピーの変更等自由です。
この記事にある「ターゲットユーザー」等をよく読み制作を行なってください。

レベル3:オリジナル

「Pass Office」のサイトではなく、オリジナルのテーマを設定し、サイト制作を行なってください。
推奨テーマ : カフェ、美容院、コワーキングスペース
その場合以下のターゲットユーザー等は参考にせず、自分で設定を行なってください。

ターゲットユーザー

このコワーキングスペースは、フリーランスのクリエイター(デザイナー、エンジニア、ライター、動画編集者など)を主なターゲットとしています。

彼らは以下のようなニーズを持っています。

  • 集中して作業できる、快適で質の高い作業環境
  • 他のクリエイターとの交流やコラボレーションの機会
  • 作業の効率を高める設備(モニターなど)やサービス

サイトに含めるべきコンテンツ

以下の内容を盛り込んだウェブサイトをデザイン・制作してください。

トップページ

  • キービジュアル: 「毎日特別なコラボレーションが生まれる場所。」というコンセプトを伝えるデザインにしてください。(キャッチコピーは変えても良い)
  • Pass Officeについて: ターゲットであるクリエイター向けであることを明確に伝えます。
  • 3つの特徴: 「作業環境」「カフェ・ウォーターサーバー」「コミュニケーション」の3つの特徴を分かりやすく紹介します。
    • 作業環境: 十分な個人スペースとモニターの貸し出しが可能であることをアピールしてください。
    • カフェ・ウォーターサーバー: 美味しいコーヒーが飲み放題で、ウォーターサーバーも完備していることを伝えます。
    • コミュニケーション: 毎週利用者同士のイベントを開催し、新たなビジネスが生まれやすい環境であることを示します。
  • アクセスマップ: 所在地を地図で示します。
  • お問い合わせ(CONTACT)ページ: 名前、メールアドレス、内容を入力できるフォームを設置します。

デザイン・制作要件

  • テイスト: 「クリエイティブで洗練された、モダンなテイスト」を意識してデザインしてください。
  • レスポンシブデザイン: PCとスマートフォン、両方のデバイスで最適に表示されるようにデザインしてください。
  • ナビゲーション: サイト全体をスムーズに移動できるよう、トップページ、About、Access、Contact等への導線を分かりやすく設置してください。

素材

素材はフリー素材サイトから商用可のものを探して構築してください。

タイトルとURLをコピーしました