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

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

あのな、ウチなこれからデザインやっていこうと思うんや

デザインをアートでなく "設計" ととらえるとセンスとかでなく理詰めでとらえることができるのでおすすめ

つい先日リンクは貼らないけども某サービスにデザイン入門的な講座ができていたのを知ったでやってみました。ちなみに有料講座なんだけど、一部無料だし知識としての話なので用語さえ知っていれば下にある解説みながらすればググって解決できるのであんまり有料である意味をあまり感じない……。まあ、それは言ってはいけない約束なんでしょうけどね……。まあ、僕課金してないから詳細はよくわかんないです。


今日の学び

てなわけで無料範囲でできることのまとめとか書いていこうと思います。

f:id:andron:20190217090738p:plain

Webでのレイアウト決定までには大まかに上記のような流れがあります。多少なにかしらの要素は前後ある気がするけどデザインの要になる部分をこんな風に作るって感じなのだと思ってる。


参考:コンセプトとデザイン
【S5-Style】Webデザインギャラリー / Web Design Inspiration
縦長のwebデザインギャラリー・サイトリンク集|MUUUUU.ORG
I/O 3000 | Webデザインギャラリー
コンセプトそのものは載っていないんですけど、まあ扱っている製品見て何となくのターゲット層などを逆算しながらつかえば参考になるやつ。


参考:配色サンプル
Adobe Color CC
配色の見本帳 | キーカラーで選ぶ配色パターン - 色見本と理想の配色との出会い
色の組み合わせとかに使えるやつ。Adobeのやつがメインカラー・サブカラーとか決めるのに便利。


参考:フォントデザイン
Google Fonts
良い感じのフォントを探すのに便利なサイト。ただし欧文フォントメイン。ちなみにフォントいじるときに使われるタイポグラフィ用語は以下の通り。

  • タイポグラフィ…文字や書体など読みやすくるするための表現手法
  • カーニング…文字間のスペース
  • ラッキング…字送り
  • レディング…行送り
  • ウェイト…文字幅
  • ジャンプ率…見出しと本文との大きさの比率


参考:Web・アプリデザイン
Design - Material Design
Themes - iOS - Human Interface Guidelines - Apple Developer
デザイン手法の参考になるやつ。


デザインについての基本的なことはこんな感じだそうです。んで、つい最近こういう系のサイトはこれ使ってアーカイブしておけば便利になるんだってことに気づいてこれを利用していくことにしてみる。
mix.com
ぶっちゃけるとデザインに関しての学びを書いてみる記事っていうか上のサイト(Mix)の使い勝手を試してみたいから作った記事だったりする。


おまけ

ついでに同サービスで今のところ完全無料でできるPython講座も終えた。
f:id:andron:20190217075337p:plain
奇跡の騎士になった。追加内容は例外処理っぽいです。

例外処理サンプル

# ゼロ除算エラーサンプル
try:
    print(100 / 0)
    # raise ZeroDivisionError
except ZeroDivisionError as e:
    print('catch ZeroDivisionError:', e)
finally:
    print('完了')