Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
スポンサーロゴサイズの統一
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Kite
August 28, 2016
Design
3.5k
7
Share
スポンサーロゴサイズの統一
縦横比がバラバラなロゴを、大体同じぐらいのサイズに見えるようにする方法
Kite
August 28, 2016
More Decks by Kite
See All by Kite
個人からチームまで、情報・タスク管理の一元化はNotionにお任せ!
ixkaito
12
74k
WordPress でも大丈夫!実例で見るウェブパフォーマンス改善
ixkaito
7
5.5k
WordPress でも大丈夫!実例で見るウェブパフォーマンス改善
ixkaito
22
7.9k
タイポグラフィベーシック (+ デザインアイデア)
ixkaito
13
4.2k
WordPress の今とこれから
ixkaito
1
2k
世界で一人しかできない WordPress コアを写経する話 ― 修行の先に見たものとは?
ixkaito
5
15k
WordPress の今とこれから
ixkaito
4
2.6k
Let's Think about Right Answers of Design and UI/UX
ixkaito
0
460
ブラウザのデフォルトスタイルを見てみよう
ixkaito
3
1.6k
Other Decks in Design
See All in Design
速く作れるかではなく、速く学べるか ― 学習ループを回すパイロットの途中報告
nagata03
0
330
チームをデザイン対象にする / Design for your team
kaminashi
1
1.3k
AI時代に求められるUXデザインのアプローチ
xtone
1
3.9k
第18回サイゼミ
lw
1
3.8k
Frontier
rwang05
0
130
保育現場にAIを 〜人と技術に橋を架けるデザインで考えてきたこと〜 uiuxcamp2026-hoiku-ai-design
hiro93n
1
230
From the Visible Crossroads: Turning Outputs into Outcomes
takaikanako
2
1.4k
公開スライド)熊本市様-電子申請中級編
garyuten
0
1.2k
図面資産×AI 眠れる資産を起こす挑戦
aonomasahiro
0
120
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
2.3k
社長の宿題への回答 「新卒×AI」が生み出す価値
saki822
2
140
改正JISを見据えた、企業のアクセシビリティ対応ロードマップ
securecat
1
370
Featured
See All Featured
Everyday Curiosity
cassininazir
0
210
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
We Have a Design System, Now What?
morganepeng
55
8.1k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
5.8k
Amusing Abliteration
ianozsvald
1
170
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.9k
The Invisible Side of Design
smashingmag
302
52k
Producing Creativity
orderedlist
PRO
348
40k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
65
55k
Design in an AI World
tapps
1
210
Skip the Path - Find Your Career Trail
mkilby
1
120
YesSQL, Process and Tooling at Scale
rocio
174
15k
Transcript
Grand Frontend Osaka 2016 / Kite มଶత$44τϦοΫ൪֎ฤ εϙϯαʔϩΰαΠζͷ౷Ұ
WordPress core contributor Ruby on Rails contributor Wocker developer Bathe
developer Frasco developer Web & graphic designer Programmer Kite KITERETZ inc. CEO & Funder ! kite.koga " ixkaito # ixkaito
εϙϯαʔϩΰαΠζͷ౷Ұ
༷ ॎԣൺ͕όϥόϥͳϩΰ
ߴ͞෯Ͱ߹Θͤͯɺಉ͡େ͖͞ʹݟ͑ͳ͍ ࣦഊྫ
ಉ͡େ͖͞ʹݟ͑ΔΑ͏ʹ͢Δʹɺ໘ੵ͕ಉ͙͡Β͍ʹͳΔΑ͏ʹ͢Δඞཁ͕͋Δ ࣦഊྫ
Ұ൪ԣͳ ॎͰΑ͍ ϩΰΛج४ʹɺൣғͰऔΕΔ࠷େ໘ੵΛٻΊΔ Γํ
ྫ 300 * 50 = 15,000px Γํ
x : y = 1.5 : 1 x y Γํ
x y x : y = 1 : 1
x * y = 15,000 1.5 * y * y
= 15,000 y = √10,000 y = 100px x * y = 15,000 1 * y * y = 15,000 y = √15,000 y ≒ 122.474487139px Γํ
Γํ 122px 100px x * y = 15,000 1.5 *
y * y = 15,000 y = √10,000 y = 100px x * y = 15,000 1 * y * y = 15,000 y = √15,000 y ≒ 122.474487139px
ެࣜ 短辺 = √(最大面積 ÷ 縦横比)
࣮ࡍϩΰʹΑͬͯృΓͭͿ͠෦ͷ໘ੵ͕ҧ͍·͢ͷͰɺ ࠷ޙࣗ͝ͷͰ֬ೝ͠ɺඍௐ͢Δ͜ͱΛΦεεϝ͠·͢ɻ ֮ॻ
࠷ޙʹ
,*5&3&5;JOD גࣜձࣾΩςϨπ Ͱɺ ຐ๏͍ʹͳΓ͍ͨਓΛืू͠·͢ɻ ϦϞʔτɺύʔτλΠϜܴɻ αΠτ͔Β IUUQLJUFSFU[DPN 'BDFCPPLϝοηʔδ͔Β IUUQGBDFCPPLDPNLJUFLPHB (JU)VC*TTVF
IUUQTHJUIVCDPNLJUFSFU[