Chameleon: A Color-Adap0ve Web Browser for Mobile OLED - - PowerPoint PPT Presentation
Chameleon: A Color-Adap0ve Web Browser for Mobile OLED Displays Mian Dong and Lin Zhong Rice University Display is a major power consumer in a smartphone A.
Chameleon: ¡A ¡Color-‑Adap0ve ¡Web ¡Browser ¡ ¡for ¡Mobile ¡OLED ¡Displays ¡
Mian ¡Dong ¡and ¡Lin ¡Zhong ¡ Rice ¡University ¡
is a major power consumer in a smartphone
power ¡ ¡consump6on ¡in ¡ a ¡smartphone,“ ¡2010 ¡
2010 ¡ 2009 ¡ 2011 ¡
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 ¡!!! ¡
An OLED-friendly theme works for
but not for
in the web are White
LiveLab: ¡A ¡field ¡study ¡(25 ¡users; ¡12 ¡months) ¡
Non-Mobile Mobile OLED- Friendly
visited by iPhone users are
LiveLab: ¡A ¡field ¡study ¡ ¡ (25 ¡users; ¡12 ¡months) ¡
¡ ¡Max: ¡ ¡70% ¡ ¡ ¡Min: ¡ ¡20% ¡ ¡ ¡Median: ¡50% ¡
1
Generate Device Specific OLED Power Model
i ¡= ¡1 ¡ N ¡ N ¡ i ¡= ¡1 ¡
Google Nexus One Nokia N85 Samsung Galaxy S
0 ¡ 6 ¡ 0 ¡ 255 ¡
R ¡ G ¡ B ¡
0 ¡ 255 ¡
R ¡ G ¡ B ¡
0 ¡ 255 ¡
R ¡ G ¡ B ¡
Linear ¡RGB ¡Values ¡ Power ¡(μW) ¡
2 ¡
Treat GUI Objects and Images Differently
Color Transformation of GUI Objects
RGB ¡ Pixel ¡# ¡ RGB ¡ Pixel ¡# ¡
Color Counting Color Mapping Color Painting
Color Transformation of Images
3
Keep Color Consistency for Each Website
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 ¡ ¡
4 ¡
Calculate Color Maps Offline
Color Transformation of GUI Objects
RGB ¡ Pixel ¡# ¡ RGB ¡ Pixel ¡# ¡
Color Counting Color Mapping Color Painting
50% ¡ 60% ¡ 70% ¡ 80% ¡ 90% ¡ 1 ¡ 2 ¡ 3 ¡ 4 ¡ 5 ¡ 6 ¡ 7 ¡ 8 ¡ 9 ¡ 10 ¡ 11 ¡ 12 ¡
Display ¡Power ¡ReducKon ¡ Week ¡
Op0mal ¡ Trained ¡by ¡1w ¡ Trained ¡by ¡2w ¡ Trained ¡by ¡3w ¡ Trained ¡by ¡4w ¡
hHp://confabulator.blogspot.com/2007/01/how-‑liHle-‑web-‑sites-‑have-‑changed-‑over.html ¡
5 ¡
Give User Options
20 Participants
R’ = λR G’ = λG B’ = λB
↓25%
R’ = λRR G’ = λGG B’ = λBB
↓34%
R’ = R* G’ = G* B’ = B*
↓72%
R’= λ(1-R) G’= λ(1-G) B’= λ(1-B)
↓66%
0 ¡ 2 ¡ 4 ¡ 6 ¡ 8 ¡ CNN ¡ Facebook ¡ Google ¡ Weather ¡ ESPN ¡ User ¡Number ¡ Inversion ¡ Arbitrary ¡ Green ¡ Dark ¡
Different users prefer different transformations for a website
0 ¡ 1 ¡ 2 ¡ 3 ¡ 4 ¡ 5 ¡ CNN ¡ Facebook ¡ Google ¡ Weather ¡ ESPN ¡ Scores ¡(1 ¡to ¡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
RGB ¡ Pixel ¡# ¡
Resource ¡ Loading ¡ Parsing ¡ Style ¡ Forma]ng ¡ Layout ¡ Calcula0on ¡ Internet ¡ Scrip0ng ¡ Pain0ng ¡ Display ¡ DOM ¡Tree ¡ Render ¡Tree ¡ Render ¡Tree ¡ w/ ¡Layout ¡ Bitmap ¡
¡ ¡
– Arbitrary ¡
min Power s.t. for any i, j ∆E ((Li’, ai’, bi’), (Lj’, aj’, bj’)) = λ·∆E ((Li, ai, bi), (Lj, aj, bj))
RGB ¡ Pixel ¡# ¡
L ¡ a ¡ b ¡
DrawPoint ¡(x, ¡y, ¡RGB) ¡ DrawPoint ¡(x, ¡y, ¡LUT(RGB)) ¡
Resource ¡ Loading ¡ Parsing ¡ Style ¡ Forma]ng ¡ Layout ¡ Calcula0on ¡ Internet ¡ Scrip0ng ¡ Pain0ng ¡ Display ¡
Chameleon Fennec
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 ¡ Educa0on ¡ High ¡School ¡ Students ¡ Law ¡ Science ¡
Transformation is Well Accepted especially with a Low battery level
Original ¡ Transformed ¡
Baeery ¡Level ¡High ¡ Baeery ¡Level ¡Low ¡
system ¡power ¡reduc0on ¡for ¡web ¡browsing ¡
users ¡if ¡performed ¡properly ¡
studying ¡users ¡
hep://www.ruf.rice.edu/~dongmian/Chameleon.html ¡
Motivation
1
Theory
2
Design
3
Evaluation
4
Conclusion
5
Human ¡factor ¡team ¡ interacts ¡with ¡the ¡ par0cipants ¡ Par6cipants ¡use ¡the ¡ instrumented ¡phone ¡in ¡ the ¡field ¡ SoOware ¡team ¡deals ¡with ¡ the ¡logger ¡and ¡data ¡without ¡ knowing ¡the ¡par0cipants ¡ Internet ¡
Logger ¡updated ¡daily ¡ Data ¡collected ¡daily ¡
Logo Images Background Images
0 ¡ 5 ¡ 10 ¡ 15 ¡ 20 ¡ 25 ¡ 0.25 ¡ 0.5 ¡ 1 ¡ 2 ¡ 4 ¡ Series ¡DuraKon ¡(s) ¡ Timeout ¡Value ¡(s) ¡ 0 ¡ 5 ¡ 10 ¡ 15 ¡ 20 ¡ 25 ¡ 0.25 ¡ 0.5 ¡ 1 ¡ 2 ¡ 4 ¡ Inter-‑Series ¡Interval ¡(s) ¡ Timeout ¡Value ¡(s) ¡ Time ¡
Interval ¡ Dura0on ¡
Timeout ¡ Timeout ¡ Timeout ¡
Render ¡ Tree ¡
alpha=50% ¡ Resource ¡ Loading ¡ Parsing ¡ Style ¡ Forma]ng ¡ Layout ¡ Calcula0on ¡ Internet ¡ Scrip0ng ¡ Pain0ng ¡ Display ¡
I=(V1- V2)/R DAQ ¡ BaZery ¡ R ¡ V1 ¡ V2 ¡
¡
R=0.0 ¡ G=0.0 ¡ B=0.0 ¡
¡
R=0.2 ¡ G=0.0 ¡ B=0.0 ¡
¡
R=0.4 ¡ G=0.0 ¡ B=0.0 ¡
¡
R=0.6 ¡ G=0.0 ¡ B=0.0 ¡
¡
R=0.8 ¡ G=0.0 ¡ B=0.0 ¡
¡
R=1.0 ¡ G=0.0 ¡ B=0.0 ¡
P=V2 x I P=c P=c+f(0.2) P=c+f(0.4) P=c+f(0.6) P=c+f(0.8) P=c+f(1.0)
the ¡most ¡omen ¡used ¡applica0ons ¡
L ¡= ¡20 ¡ L ¡= ¡40 ¡ L ¡= ¡60 ¡ L ¡= ¡80 ¡
R’ = λR G’ = λG B’ = λB
↓25%
R’ = λRR G’ = λGG B’ = λBB
↓34%
R’ = R* G’ = G* B’ = B*
↓72%
R’= λ(1-R) G’= λ(1-G) B’= λ(1-B)
↓66%
0 ¡ 25 ¡ 50 ¡ 75 ¡ 1x1 ¡ 5x5 ¡ 10x10 ¡ 20x20 ¡
Time ¡(ms) ¡ Sampling ¡Window ¡
framebuffer ¡reading ¡ color ¡contribu0on ¡vector ¡upda0ng ¡
0% ¡ 20% ¡ 40% ¡ 60% ¡ Original ¡ Dark ¡ Green ¡ Arbitrary ¡ Inversion ¡
Average ¡% ¡Usage ¡Time ¡
Transformation is Well Accepted especially with a Low battery level
Baeery ¡Level ¡High ¡ Baeery ¡Level ¡Low ¡
0 ¡ 2 ¡ 4 ¡ 6 ¡ 1 ¡ 2 ¡ 3 ¡ 4 ¡ 5 ¡ 6 ¡ 7 ¡ 8 ¡ 9 ¡ 10 ¡ 11 ¡ 12 ¡
Color ¡Map ¡Switch ¡Number ¡ Time ¡since ¡Trial ¡Starts ¡(Week) ¡ Algorithm ¡ Parameter ¡
Color ¡Conversion ¡
VLD ¡ ZZ ¡ DQ ¡ IDCT ¡ Reordering ¡
100010 ¡ 010001 ¡ 110001 ¡ 111101 ¡