デザインスクール風のサイトデザインを作ってみた(canva,chatGPT)
デザインに関しては素人なのですが、最近canvaでサイトのデザインを実験的に作ってみてます!
今回はデザインスクールっぽいサイトのデザインを作ってみました。「デザインスクール」をイメージして作ったというよりデザイン的にデザインスクールっぽくなってしまったので、デザインスクールに着地した感じです、、
以前作ったサイトのデザインシリーズ
デザインを作る
ChatGPTに、キャッチコピーを考えてもらう
canvaで、シンプルな図形を探して配置していく
canvaで、「素材」から「波」や「多角形」などのシンプルな図形を探し、適当に配置していきます。
無料版でも多少は使用できる素材があるので、がんばって探していきます。
フォントは、デザイン性があるフォントを選択
フォントは、デザイン性があるフォントを選択したら、デザインスクールっぽくなりました。(なった気がします。)
完成したデザイン
なんとなくデザインスクールっぽいデザインになったかと思います!
最終的にはこのデザイン画像をHTMLに反映させる
上記デザインは画像の段階ですが、実際のサイトに反映する場合は、上記のデザイン画像からロゴとボタン部分を取り除いた画像を作成し、HTMLにその画像と、ロゴとボタンを配置していく流れになるかと思います。(リンクになる箇所はHTMLで実装するイメージ。)
HTML化する際には、bootstrapベースのHTMLコードを、ChatGTPに作ってもらうのが効率良さそうな気がしますね!
おわりに
最後まで読んでいただき、ありがとうございます!
私はサーバーサイドの人間なので、デザインが不得意なのですが、普段やったことがないことにチャレンジするのは、色々と発見があり勉強にもなります!(慣れていない分、労力がかかり大変なのですが。)
noteの見出し画像作成で、canvaで作る機能がありますが、そこのテンプレートデザインが参考になるのと、デザイン性に特化したWEBサイトを見ているだけでも参考になります。
今後もWEBサイトのデザインを中心に、何かしらのデザイン作成に取り組んでいこうと思います!
おまけ
最近、ChatGPTを使用し、色々なことを模索しています。
もしよければ、以下の記事も見て頂けると嬉しいです!
この記事が参加している募集
この記事が気に入ったらサポートをしてみませんか?