59分割ヤバイ


こばかなさんと、グリッド分割の話をしてるときに出たネタなのだけど。

グリッドの59分割ヤバイよねぇというお話。

画面を59分割すると、様々な比率で端数がでない。汎用的なグリッド分割できて素敵。個人的にはnoteで図表を描く時は、

・幅620px
・天地左右マージン15px
・グリッド59分割 10px

を意識すると、色々と便利だと思う。

これ全部、ピクセルパーフェクトに分割できる。

1分割 = 590px grid
2分割 = 290px grid
3分割 = 190px grid
4分割 = 140px grid
5分割 = 110px grid
6分割 = 90px grid
8分割 = 65px grid (厳密には10の倍数でないので△)
10分割 = 50px grid
12分割 = 40px grid
15分割 = 30px grid
20分割 = 20px grid
24分割 = 15px grid(厳密には10の倍数でないので△)
25分割 = 14px grid(厳密には10の倍数でないので△)
30分割 = 10px grid

ヤバイと思うのだけど、なかなかすごさが伝わらない。技術スタディの類だけど、こういうマジックナンバーで遊ぶの楽しいよね。(70代か80代にもこういう数字あった記憶)。

むかしから布教してるつもりが、やはり周囲で知ってる人が少ないのでnoteに書いてみるなど。


この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

note.user.nickname || note.user.urlname

よろしければ、サポートお願いいたします! 頑張っているnoteチームのみんなに、回らないお寿司をご馳走しようと思います。

嬉しいー(お返事がランダムに出せるようになりました)
763

#デザイン 記事まとめ

デザイン系の記事を収集してまとめるマガジン。ハッシュタグ #デザイン のついた記事などをチェックしています。広告プロモーションがメインのものは、基本的にはNGの方向で運用します。
13つのマガジンに含まれています

コメント5件

3分割の数値が違っていますよ。190だと思います。
2分割は290pxですかね…?
計算が合わなくて頭をひねってました
もともと、12分割は、
約数が、2,3,4,6,12と多いので、
画面分割としてBootstrapやMaterialDesignなどでよく使われています。
それを5倍したら60分割で、
約数は、2,3,4,5,6,10,12,15,20,30,60
なので別段マジックナンバーとは思えません。
60-1=59となっているのは、マージンを取ってる関係でそうなっているのでしょう。
マジックナンバーとは思えないが、
具体的な数字でマージンを取りながら60分割した場合はどうなるか?というのを示してみせたことは大きな意味があると思います。
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。