Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
fitme
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
namikuguri
December 31, 2013
Design
97
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
fitme
2013年頃に考えたブラウザのUI
namikuguri
December 31, 2013
More Decks by namikuguri
See All by namikuguri
実例から学ぶ CSSアニメーション
namikuguri
1
1.5k
かるくCalc()
namikuguri
0
220
SVG Basic
namikuguri
0
270
SVG Graph Animation
namikuguri
0
300
石
namikuguri
0
370
僕はあの日夕暮れ時に書いたスタイルガイドを忘れない
namikuguri
0
880
誰と作るデザイン?
namikuguri
0
640
CSS の構造化、その目的
namikuguri
0
120
About color
namikuguri
0
120
Other Decks in Design
See All in Design
エンジニア経験0のデザイナーが アプリを0からリリースまで 作ってみる
abokadotyann
2
490
Edmonton River Slidedeck
edmontonriver
0
470
Luna's Light
shemeetscity
0
700
もっともらしさ生成器と暮らす – AI懐疑派の試行錯誤
sekiguchiy
0
220
インターンから2年新卒フロントエンドエンジニアから見たサイボウズのアクセシビリティ
taku10101
0
210
広い関与の可能性に どう向き合うのか? 私たちは。|Timee MarketingDesign 2026-06-18
bebe
0
1.3k
言幹と言葉(Stems & Leaves)
kakukoki
0
260
AI-Slopなデザインを生まないためのデザインプロセス戦略
takanorip
10
6.5k
AIが作るデザインの レビューコストと向き合って分かったこと. -正社員デザイナー1人の組織でデザインハーネスを立ち上げた話-
hidekiietaka
1
360
ひとりで作れる時代に、 判断をみんなで持つには。/ Build alone share judgment
kgsi
1
900
デザイナーがいない部署にハーネスを設計する
kenichiota0711
5
5.9k
Bet AI Day 2026丨デザインハーネス:専門職の判断基準をコードのように運用する
layerx
PRO
6
7.8k
Featured
See All Featured
[RailsConf 2023] Rails as a piece of cake
palkan
59
7.1k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
400
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
2
760
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
30 Presentation Tips
portentint
PRO
1
460
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
2
6.4k
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
1
560
Designing Dashboards & Data Visualisations in Web Apps
destraynor
232
55k
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.6k
Building a Scalable Design System with Sketch
lauravandoore
464
34k
How to Think Like a Performance Engineer
csswizardry
28
2.9k
Transcript
W
/FX#SPXTFS'JU.F ৗੜ׆ʹ༻͢ΔαʔϏεͷ૿ՃɺσόΠεͷ ଟ༷ԽɺϢʔβʔͷଐੑʹ߹Θͤͯɺ࠷దͳ6*ͷ มߋΛՄೳʹ͢ΔͨΊʹ࡞Γ·ͨ͠ɻ
None
'JU.Fͱ ࣗͷར༻έʔεʹ߹ͬͨΠϯλʔϑΣʔεΛ࣮ݱ͍ͨ͠ %FTLUPQϒϥβΛ͏Ϣʔβʔ͚ͷɺ 'JU.Fͱ͍͏ϓϩμΫτɺ %FTLUPQ্Ͱಈ࡞͢Δ8&#ϒϥβΞϓϦέʔγϣϯͰ͋Δɻ ͜Εϒϥβͱͯ͠ͷ࠷ݶͷػೳΛআ͖ɺλϒͷΧςΰϦΛ Γସ͑Δ͜ͱ֦ுΛߦ͏͜ͱͰɺϢʔβʔͷར༻༻్ʹ߹ͬͨϒ ϥβΛ࣮ݱ͢Δ͜ͱ͕Ͱ͖ɺ 0QFSBͱҧͬͯɺ ࠨαΠυόʔͷػೳΛվྑ͠ɺαΠυόʔͷ໊લΛzύωϧzͱͯ͠
ओ࣠ʹஔ͍ͨΠϯλʔϑΣʔε͕උΘ͍ͬͯΔɻ
None
1. ϒϥβදࣔྖҬͷ 2. σόΠεؒͷಉظɺදࣔՕॴͷ 3. ΧελϚΠζͷෆศ͞ͷ ϒϥβͷ3ͭͷɺFit Me ͷઓ
1. ϒϥβදࣔྖҬͷ 2. σόΠεؒͷಉظɺදࣔՕॴͷ 3. ΧελϚΠζͷෆศ͞ͷ ϒϥβͷ3ͭͷɺFit Me ͷઓ
1. ϒϥβදࣔྖҬͷ Լهͷཧ༝͔ΒϒϥβͷදࣔྖҬॎΛ͘͢Δ ͜ͱΛҙࣝͨ͠΄͏͕͍͍ɻ - ਓߦͷจࣈ͕ଟ͍จষΛಡΉͱർΕΔ - ଟ͘ͷϒϥβ͕ԣ෯ʹ༨ͳ༨നΛ͍࣋ͬͯΔ
1. ϒϥβදࣔྖҬͷ ·ͨɺλϒΛ্ʹऔΔ͜ͱͰ … - title ͷจࣈ͕λϒΛ։͘͜ͱͰݟ͑ʹ͘͘ͳ Δɻ࠷ऴతʹ favicon
title දࣔ͞Εͳ͍ɻ - λϒͷදࣔྖҬ͕ڱ·Δ͜ͱͰɺλϒͷΫϦοΫ ͕ߦ͍ʹ͘͘ͳΔɻ
1. ϒϥβදࣔྖҬͷ Google Chrome λϒ Firefox λϒ
1. ϒϥβදࣔྖҬͷ Fit Me ͷղܾํ๏ શͯͷλϒΛѲͰ͖ΔΑ͏ʹ͢ΔҝɺදࣔྖҬΛ ݮΒ͞ͳ͍ҝʹλϒΛύωϧʹදࣔ͢Δɻ λϒΛύωϧʹදࣔ͢Δ͜ͱͰҰఆͷදࣔྖҬɺ ΫϦοΫྖҬΛ֬อ
1. ϒϥβදࣔྖҬͷ λϒΛύωϧʹදࣔ͢Δ͜ͱͰҰఆͷදࣔྖҬɺ ΫϦοΫྖҬΛ֬อ
1. ϒϥβදࣔྖҬͷ 2. σόΠεؒͷಉظɺදࣔՕॴͷ 3. ΧελϚΠζͷෆศ͞ͷ ϒϥβͷ3ͭͷɺFit Me ͷઓ
ՈձࣾͰDesktopɺ֎ͰTabletMobileΛ ͏ͳͲɺϢʔβʔ͕ར༻γʔϯʹ߹ΘͤͯσόΠε ΛΓସ͍͑ͯΔɻ طଘͷϒϥβͰɺಉظΛ࣮ߦ͢ΔػೳͷஔՕ ॴɺಉظޙͷ༻ํ๏͕Θ͔Γʹ͍͘ɻ 2. σόΠεؒͷಉظɺදࣔՕॴͷ
σόΠεΛΓସ͑ͨ࣌ʹλϒཤྺɺϒοΫϚʔ Ϋ͕ಉظ͞Εͳ͍ͷෆศɻDesktop্Ͱશͯཧ Ͱ͖ΔΑ͏ʹ͢Δɻ σόΠεͷΓସ͑πʔϧͷൃݟ͘͢͠ɺ͍ ͍͢ॴʹஔ͘ɻ 2. σόΠεؒͷಉظɺදࣔՕॴͷ
2. σόΠεؒͷಉظɺදࣔՕॴͷ Google Chrome ಉظʢ৽͍͠λϒ Footerʣ Firefox ಉظʢελʔτϖʔδ Footerʣ
2. σόΠεؒͷಉظɺදࣔՕॴͷ Fit Me ͷղܾํ๏ DashboardΟϯυλϒʹDesktopɺ TabletɺMobileͰΓସ͑ද͕ࣔ༰қʹͰ͖ΔΑ͏ ʹ͢Δɻ
2. σόΠεؒͷಉظɺදࣔՕॴͷ μογϡϘʔυ
2. σόΠεؒͷಉظɺදࣔՕॴͷ ύωϧʢΟϯυʣ
1. ϒϥβදࣔྖҬͷ 2. σόΠεؒͷಉظɺදࣔՕॴͷ 3. ΧελϚΠζͷෆศ͞ͷ ϒϥβͷ3ͭͷɺFit Me ͷઓ
3. ΧελϚΠζͷෆศ͞ͷ Ϣʔβʔͷଐੑ͕֦େ͢Δத 1ͭͷΠϯλʔϑΣʔεͰຊʹ͍͍͢ͷΛ ࡞Δͷ͍͠ɻ
3. ΧελϚΠζͷෆศ͞ͷ ϢʔβʔʹϒϥβͷػೳΛֶशͯ͠Β͍ɺ ࣗʹ߹ͬͨΠϯλʔϑΣʔεΛϢʔβʔ͕ࣗ࡞ Γ্͛Δඞཁ͕͋Δɻ
3. ΧελϚΠζͷෆศ͞ͷ Firefox ΧελϚΠζ
3. ΧελϚΠζͷෆศ͞ͷ Firefox ͷΑ͏ʹͯ͢Λදࣔ͠ɺॎͷྖҬΛڱΊ Δ͜ͱ͚ͩ͠ͳ͍Α͏ʹ͢Δɻ
3. ΧελϚΠζͷෆศ͞ͷ Fit Me ͷղܾํ๏ ݱࡏɺଞͷϒϥβͰόʔͱͯ͠ѻΘΕ͍ͯΔ ͷΛύωϧʹؚΊɺ୳͍ͯ͠Δͷ͕ҰఆͷதͰ ݁͢ΔΑ͏ʹ͢Δɻ
3. ΧελϚΠζͷෆศ͞ͷ Οϯυ
3. ΧελϚΠζͷෆศ͞ͷ ϒοΫϚʔΫ
3. ΧελϚΠζͷෆศ͞ͷ App
3. ΧελϚΠζͷෆศ͞ͷ ཤྺ
3. ΧελϚΠζͷෆศ͞ͷ ϝϞ
3. ΧελϚΠζͷෆศ͞ͷ μϯϩʔυʢ্෦ʣ
3. ΧελϚΠζͷෆศ͞ͷ μϯϩʔυʢԼ෦ʣ
1. ϒϥβදࣔྖҬͷ 2. σόΠεؒͷಉظɺදࣔՕॴͷ 3. ΧελϚΠζͷෆศ͞ͷ ϒϥβͷ3ͭͷɺFit Me ͷઓ
ࣗʹͽͬͨΓͳϒϥβΛ͋ͳͨʹ 'JU.F
࡞ऀ