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
Kite
August 28, 2016
Design
3.5k
7
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
スポンサーロゴサイズの統一
縦横比がバラバラなロゴを、大体同じぐらいのサイズに見えるようにする方法
Kite
August 28, 2016
More Decks by Kite
See All by Kite
個人からチームまで、情報・タスク管理の一元化はNotionにお任せ!
ixkaito
12
75k
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.7k
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
言幹と言葉(Stems & Leaves)
kakukoki
0
150
広い関与の可能性に どう向き合うのか? 私たちは。|Timee MarketingDesign 2026-06-18
bebe
0
270
Drawing for Animation
lynteo
2
310
kintone開発におけるライターの役割の変化〜AI活用を添えて〜 / Changes in the Role of Writers in Kintone Development
keroyama
0
140
AIネイティブスタートアップにおけるプロダクト開発の新常識 / Product Development Tips in AI-Native Startups
saka2jp
2
1.3k
情報を翻訳する-伝わる可視化3原則とオープンデータ活用-
hjmkth
1
310
「親切なオンボーディング」 が招く罠 ー AI時代のUXデザイン
godlingkogami
1
140
デザイナーが主導権を握る、AI協業の本音と実践
satosio
7
3.4k
AIスライド生成を進化させるMDファイル
kenichiota0711
1
1.4k
研修担当者が一番伸びた 熊本市役所✕AI『泥臭いAI研修』のワークショップ設計について
garyuten
2
440
少人数チームで_使われるプロダクトにたどり着くための_デザインハーネス.pdf
nishame
1
1.1k
つくり方を変えていく | change-how-we-build
mottox2
2
1.4k
Featured
See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6k
Utilizing Notion as your number one productivity tool
mfonobong
4
430
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.6k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
1.1k
Mobile First: as difficult as doing things right
swwweet
225
10k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
500
Designing for Performance
lara
611
70k
Docker and Python
trallard
47
4k
The Invisible Side of Design
smashingmag
301
52k
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
2
340
How to Think Like a Performance Engineer
csswizardry
28
2.7k
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
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[