どもども！皆さんこんばんは。龍ちゃんです。今日も元気にコーディングしていますか？私は最近、あまりコードを書いていないなぁ〜とか思っちゃいまして。今回も遊び場の方でWebコーディングをしていましたね。
冷静になって考えてみたんですけど、ロジックを組んだりしているわけではないので、「コーディングじゃなくてデザインでは？」などと考えていたんですよね。まぁWebのフロントに関して言えば、曖昧な感じになっているわけです。できないよりは、できたほうがいいというのも事実なので遊び程度にまとめていきますね。デモ、今回はちょっとだけJavaScript書きましたね。今回の遊びの結果を置いておきます。
さてさて、前回の「Tailwindで遊んでみたVol.1」では「Github Pageでデプロイをやってみたよ」というのが強かったのでデザインは力を入れていません。ですので、今回はちゃんとFigmaを使ってデザインの当たりをつけて作成してみました。正直にお話をすると、Figmaを使用してデザインを作り出して3ヶ月なのでほぼ未経験なのですが、これがまた感動ものツールですね。この話はまたいずれ記録＆布教記事として流していこうかなと思います。それでは、実際に見てもらったほうが楽しいと思うのでFigmaのリンクを置いておきますね。こちらは、いじったりはできないですけど覗けるはずですので覗いてみてください。リンクはこちらです。
今回のテーマは、ゲームっぽさですね。とりあえず、デスクトップ版のスクショを置いておきます。これは完成版ですね。
着想なんですけど、そんなものは偶然です。今回は、ヘッダーデザインでいいのを見たので作りたいと思いまして、ヘッダーのデザインからサイト全体のデザインを決めていった流れになります。ゲームっぽさの部分は、あなたが今いるうちのホームページから得た着想ですね。特にこだわったところに関しては、モバイルデザインでのサブメニューですね。ちょこっと調整をしていい感じに表示がされたらいいなぁーとか考えていましたね。こちらがスクショです。なんだか、ゲームのボードみたいですよね。
でも実際考えてみると、このフォント見にくいですよね。今回は、デザイン先行しちゃったパターンなので見やすさなんて気にしていなかったんですが、本当に使ってもらうページの場合は、読んでほしいテキストは読みやすいフォントに変えるべきだなと考えてはいました。
ソースは相変わらず公開しているので、気になっちゃう方はどうぞクローンしてください。というかどこかに野良の先輩デザイナーの方はいらっしゃいませんか？師匠になってほしいですね。
まぁ記録を残すというのは、過去を振り返るためにも成長を図るためにも必要なことだと思うので積極的に残して広い世界に公開して、後悔していきましょう。てかまだ見ぬ師匠が僕のことをボロカス叩けるようにデザインの記録を残していこうかなと思います。
デザインを作ってはいますけど、ページに載っけるコンテンツも特にないので、僕が好きなお店や街の紹介でも置いているので、飲兵衛の方はそちらを参考にどうぞちなみに好きな街は赤羽と北千住です。
ではでは、また思いついたら作成をして公開していきますね。
シリーズ次の記事はこちら( *´艸｀)
