星降る夜の映画祭トレース Part2 #100DaysDesign #Day4
Day2 でトレースした星降る夜の映画祭りを、自分なりにいじって遊んでみた
Before
After
改善ポイント
- 文字のサイズを全体的に大きく。
- 色味がさすがに少なく感じたので ☆ に黄色を使用。
- 映画の紹介をもう少し目立たせたかったので、画像を使用。
- fontの色を暗くした
妥協ポイント
- Fontの形状変更の方法がわからない(イラレとかでやって画像にするのかな...)
- レスポンシブのこと考えたら大変そう(本家はちゃんと考えてるから偉い)
- 色彩とかfont-weightとかそこまで正確に調査をしていない。
学び
1. fontはとりあえず以下を抑えておくのが鉄板ぽい。確かにこの辺使うだけでおしゃれ感でた。
日本語: Noto-sans JP, ヒラギノ角ゴシック, 游明朝体 英語: Helvetica Neue, Lato
2. fontに対して原色白はよくない?
ほんのすこしだけグレーをまぜる。たしかに優しい印象が出る。
感想
良いかどうかはつゆ知らず。社内のデザイナーに金曜日にレビューしてもらおう。
アルゴリズム問題: モンスターvsうさぎvs人間
TopCoderOpen 2008 Qual Round 1に出題されたEasy問題
いったいどこがEasyなんだ......
人間が1人、モンスターがM匹、ウサギがB匹います。ここから、モンスターか人間がいなくなるまで無作為に2匹(もしくは1人と1匹)を選び出し、以下の行動を繰り返します。
- モンスターとモンスターが選ばれると、両方のモンスターが死にます
- モンスターとモンスター以外が選ばれると、モンスター以外が殺されてしまいます
- ウサギとウサギが選ばれると、何も起こりません
- ウサギと人間が選ばれると、人間の生存確率が最も高くなるように、ウサギを殺す、またはそのままにする、のどちらかの選択をします
モンスターの数Mとウサギの数Bが与えられたときに、最後に人間が生き残る確率を答えなさい。ただし、M、Bともに1000以下の整数とする。
以下、ヒントと回答です。 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
ヒント
①うさぎは実は考慮しなくていい。
②モンスターが奇数だったら...?
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
私の回答 by Ruby
MONSTER = ARGV[0].to_i PERSON = 1 class Integer #Override # 5C2 = 10 みたいなやつ def c(m) (1..self).to_a.combination(m).to_a.length end end def recursive_battle(monster, result=1) return 0 if monster.odd? #偶数なら生存確率0% return result if monster <= 0 #基底部 existence_this_time = existence(monster) #今回の生存確率を計算 existence_total = result * existence_this_time #前回までの生存確率 * 今回の生存確率 recursive_battle(monster - 2, existence_total) #Monsterの数を2匹減らして、再帰する。 end def existence(monster) 1.0 - (monster.to_f / (monster + 1).c(2).to_f ) end puts recursive_battle(MONSTER, PERSON)
解説そのうち載せます。
アルゴリズム問題: モンスターvsうさぎvs人間
TopCoderOpen 2008 Qual Round 1に出題されたEasy問題
いったいどこがEasyなんだ......
人間が1人、モンスターがM匹、ウサギがB匹います。ここから、モンスターか人間がいなくなるまで無作為に2匹(もしくは1人と1匹)を選び出し、以下の行動を繰り返します。
- モンスターとモンスターが選ばれると、両方のモンスターが死にます
- モンスターとモンスター以外が選ばれると、モンスター以外が殺されてしまいます
- ウサギとウサギが選ばれると、何も起こりません
- ウサギと人間が選ばれると、人間の生存確率が最も高くなるように、ウサギを殺す、またはそのままにする、のどちらかの選択をします
モンスターの数Mとウサギの数Bが与えられたときに、最後に人間が生き残る確率を答えなさい。ただし、M、Bともに1000以下の整数とする。
以下、ヒントと回答です。 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
ヒント
①うさぎは実は考慮しなくていい。
②モンスターが奇数だったら...?
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
私の回答 by Ruby
MONSTER = ARGV[0].to_i PERSON = 1 class Integer #Override # 5C2 = 10 みたいなやつ def c(m) (1..self).to_a.combination(m).to_a.length end end def recursive_battle(monster, result=1) return 0 if monster.odd? #偶数なら生存確率0% return result if monster <= 0 #基底部 existence_this_time = existence(monster) #今回の生存確率を計算 existence_total = result * existence_this_time #前回までの生存確率 * 今回の生存確率 recursive_battle(monster - 2, existence_total) #Monsterの数を2匹減らして、再帰する。 end def existence(monster) 1.0 - (monster.to_f / (monster + 1).c(2).to_f ) end puts recursive_battle(MONSTER, PERSON)
トレース祭り2日目 星降る夜の映画祭 #100DaysOfDesign #Day2
100DaysOfDesign トレース祭り2日目
星降る町の映画祭サイトをトレースした。 star-cinema-festival.com
学んだこと
- fontの幅だけでかなり印象が違う
- 言わずもがなfontの種類ではかなり印象が違う
- fontの調査方法(WhatFont? を活用)
- 近接効果のために、形状を変えるのもテクニックとしてあり(Figmaではできなかった)
できなかったこと
fontの形状をいろいろ変えること(Figmaだとできない?)
明日やること
本家の下の部分が、改善の余地があるので、 自分なりに作ってみる。
2018年 細字系フォント 決定版!
細字系
日本語: 'Noto Sans Japanese' 英語: 'Helvetica-Neue''
font-family: 'Helvetica-Neue', 'Noto Sans Japanese', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'MS Pゴシック', 'MS PGothic', sans-serif; font-weight: lighter;
NotoSans Japaneseはwebフォントなので以下のようにインストールしましょう。
<link href="https://fonts.googleapis.com/earlyaccess/notosansjapanese.css" rel="stylesheet">
サンプル画像
うつくしい....
#100DaysOfDesign Figmaでデザインの練習はじめた
デザイン学習はじめた。
目的は、以下の2つ
1. デザイナーの仕事を巻き取って、スピードを上げたい。
社内のデザイナーがパツパツのため、 重要度の低いデザインのしごとを自分で巻きとり、自己完結してスピードをあげたい。
2. 自分の独自の強みとしたい。
機械学習やらアルゴリズムごりごりエンジニアの方面では、数学ニガテな自分では勝てない。 サーバーサイドエンジニアがやりたがらないデザインの方面で1つ強みを形成しくという戦略。 スライドデザインとかは得意だったので適正もあると判断した。
FIgmaでデザイン学習開始
Figmaというツールでデザインの学習をはじめた。 このツール、Webエンジニアがちょこっとデザインを学びたい時には最高だと思う。 理由は2つ
1. (今の所)無料である
Adobeはいわずもがな高い。Sketchは年9000円かかる。 一方でFigmaは今のところ無料である。
2. 同時編集できる。
スプレッドシートのように同時編集ができる。 社内のデザイナーにレビューをもらうのがめちゃくちゃ楽そう。
使い勝手はとてもよかった。
直近の目標を掲げる。 短期目標: 今月で10個のProductを上げること。 中期目標: 今年度中に50個のProductをあげること。