Post on 12-Apr-2018
Chameleon: A Color-Adaptive Web Browser for Mobile OLED Displays
Mian Dong and Lin Zhong
Rice University
is a major power
consumer in a
smartphone
Display
A. Carroll, "A analysis of power consumption in a smartphone,“ 2010
Power = 2.0W OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!!
Power = 2.0W Power = 0.5W OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!!
OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!! OLED Rocks !!!
50% of the webpages
visited by iPhone users are
Non-Mobile
LiveLab: A field study (25 users; 12 months)
Max: 70% Min: 20% Median: 50%
Single pixel i
A display with N pixels
Pi = a ∙ Ri + b ∙ Gi + c ∙ Bi
P = ∑ Pi = ∑ (a ∙ Ri + b ∙ Gi + c ∙ Bi) i = 1
N N
i = 1
Nexus One Nokia
N85
Samsung
Galaxy S
0
6
0 255
R
G
B
0 255
RGB
0 255
R
G
B
Linear RGB Values
Pow
er (μ
W)
Color Transformation of GUI Objects
RGB
Pix
el #
RGB P
ixe
l #
Color Counting
Color Mapping
Color Painting
Top 20 websites contribute 90%
LiveLab: A field study (25 iPhone users; 12 months)
0% 20% 40% 60% 80% 100%
Top 1
Top 5
Top 10
Top 20
Average % of usage (with Max and Min) of all users
of the webpages visited by each user
Color Transformation of GUI Objects
RGB
Pix
el #
RGB
Pix
el #
Color Counting
Color Mapping
Color Painting
50%
60%
70%
80%
90%
1 2 3 4 5 6 7 8 9 10 11 12
Dis
pla
y P
ow
er
Re
du
ctio
n
Week
Optimal Trained by 1w Trained by 2w
Trained by 3w Trained by 4w
2 Weeks of training work for 3 Months
http://confabulator.blogspot.com/2007/01/how-little-web-sites-have-changed-over.html
Websites remain
Color Consistent over many years
Dark R’ = λR
G’ = λG
B’ = λB
↓25%
Green R’ = λRR
G’ = λGG
B’ = λBB
↓34%
Arbitrary R’ = R*
G’ = G*
B’ = B*
↓72%
Inversion R’= λ(1-R)
G’= λ(1-G)
B’= λ(1-B)
↓66%
Original
0
2
4
6
8
CNN Facebook Google Weather ESPN
Use
r N
um
be
r
Inversion Arbitrary Green Dark
Different users prefer different
transformations for a website
0
1
2
3
4
5
CNN Facebook Google Weather ESPN
Sco
res
(1 t
o 5
)
Inversion Arbitrary Green Dark
Even the same user may favor different
color transformations for different websites
1 Generate Device Specific
OLED Power Model
2 Treat GUI Objects and
Images Differently
3 Keep Color Consistency
for Each Website
4 Calculate Color Maps
Offline
5 Give User Options
Model
Building Color
Mapping Color
Counting
Color
Painting
Early
Stages
Layout
Calculation
Painting
Display
Mobile Device
Chameleon
Service Chameleon Browser Engine
Color Maps
Power
Model
Color
Histogram
Render Tree
w/ Layout
Bitmap
Mobile User
User
Options
Color Counting
RGB
Pix
el #
Resource Loading
Parsing
Style Formatting
Layout Calculation
Internet
Scripting
Painting
Display
DOM Tree
Render Tree
Render Tree w/ Layout
Bitmap
Mapping Optimization
• Input:
• Output:
• Algorithm – Arbitrary
min Power
s.t. for any i, j
∆E ((Li’, ai’, bi’), (Lj’, aj’, bj’)) = λ∙∆E ((Li, ai, bi), (Lj, aj, bj))
RGB
Pix
el #
L
a
b
Painting GUI Objects
DrawPoint (x, y, RGB) DrawPoint (x, y, LUT(RGB)) Resource Loading
Parsing
Style Formatting
Layout Calculation
Internet
Scripting
Painting
Display
A Field Trial 36 Participants; 3 Months
Female Male
Age <20
Age 26-30
Age >30
Age 21-25
Art & Literature
Business
Computer Science
Engineering
Education
High School Students
Law
Science
Transformation is Well Accepted
especially with a Low battery level
47% 63%
Original Transformed
Battery Level High Battery Level Low