コミュ障だから明日が僕らをよんだって返事もろくにしなかった

何かを創る人に憧れたからブログをはじめたんだと思うよ

初心者だからデザインを学ぶことにした 13th

初心者がデザインを学んでみる その13

初心者なんでデザインを学んでみることにします。あんまり長々とこのシリーズを続けて書くのもよろしくないのですが、旬なネタを思いついてしまったのでまた性懲りもなくやることにします。

前回記事
inujini.hatenablog.com

なんかつくった

■ 旅館の予約サイトのバナーをつくった
f:id:andron:20200711143437j:plain
どういう因果か知らないけどもこの自粛ムード漂う国内で旅行しようぜみたいな雰囲気を出し始めたんで今このチャンスを逃したらネタにする機会はないなと思い作ってみた。バナーのお題は旅館予約サイトなんだけども某キャンペーンのネタと絡めたいのでちょっとコピーとかそういうのを独自に修正。旅館予約サイトって何をアピールするのがいいんだろうね…。そして某キャンペーンはどうなってしまうんだろうね。



CSSでできること
CSSで色々サンプル作ってみようのお話。
スケジュール風

チャット風

斜めメニュー

こんな感じのできるっぽいですよ。みんなもやろう。

ところでレスポンシブとか作るのにわりと必須な知識なんだけども以下のやつの使い方がまだよくわからん……。文字類とかこれで指定するとサイズを変更した時にあさっての方向にレイアウトが崩れるから個人的にあんまり使いたくない…。
max-width - CSS: カスケーディングスタイルシート | MDN
min-width - CSS: カスケーディングスタイルシート | MDN
デザイン難しいね。



Figmaプラグインに詳しくなってしまった
コレのプラグインについて詳しくなってしまいました。
Figma: the collaborative interface design tool.

プラグインとかこの辺からとってくることができます。
www.figma.com

まだレッスンが全部更新されてなくて途中段階なのでどうまとめていくかわりと悩んでいますが講座が全部修了したらどこかで自分用にまとめたいな。とりあえず僕の中でこれヤバくないって思ったので一個ピックアップしておきます。

コレ
Figma - HTML To Figma | Easily convert any webpage to Figma layers by URL * How does it work * 1) Install the plugin 2)...
Figmaで使ったやつそのままHTML/CSSに書き出します。まあ使ってないんで実際の使い勝手は知らないんですけどねw。


といったことをやってみたのでした。


つづく