Figmaを使ってデザイン案作ってみた その1

記事
IT・テクノロジー
デザインツールのFigmaを使ってHPのTOPページのデザインをしてので
ポートフォリオと備忘録の意味を兼ねてこちらにアップしておきます!
Corporate-site1_pc_top.png


Corporate-site1_sp_top.png

作成するにあたってのポイント
・工業機械系のコーポレートサイトをイメージ

・TOPページはお知らせ、製品一覧、会社概要、アピールポイントエリアの4つに絞ることで、短くも長くもない丁度良いボリューム感のあるTOPページが完成

・背景に白を選ぶことで全体に統一感が生まれ、スッキリと洗練された印象に
・画像を多く使うことで視覚への訴求効果が高く、見ていて楽しいレイアウトデザイン

・「詳しくはこちら」などの詳細ボタンを設置し、下層ページでじっくり読んでもらうようなデザイン設計が可能

・PCサイズ(1440px)とスマホサイズ(375px)の両方でデザインした
ザっとですがこのようなテーマで作成しました。

Figmaはだいぶ慣れてきましたがまだまだ使ったことのない便利な機能が隠されているはず・・・!
使いながら色々試していきたいと思います(^^♪
次回はこのデザインに沿ってwordpressを使いローカル環境で構築していく予定です!
サービス数40万件のスキルマーケット、あなたにぴったりのサービスを探す