projects / slides.git / blame_incremental
? search:
summary | shortlog | log | commit | commitdiff | tree
blob | blame (non-incremental) | history | HEAD
improve linebreaks in TS Meetup talk
[slides.git] / fosdem2011 / index.html
... / ...
CommitLineData
1<!DOCTYPE html>
2<html>
3<head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5 <meta name="Author" content="KaiRo - Robert Kaiser">
6 <title>In-Tab UI</title>
7 <link rel="stylesheet" type="text/css" href="slides.css">
8 <script type="text/javascript" src="slides.js"></script>
9 <link rel="contents" href="#index" title="Overview">
10 <link rel="index" id="link-toc" href="#toc" title="Content">
11 <link rel="start" id="link-start" href="#index" title="Start">
12 <!-- link rel="first" id="link-first" href="#" title="First page" hidden>
13 <link rel="previous" id="link-prev" href="#" title="Previous page" hidden>
14 <link rel="next" id="link-next" href="#" title="Next page" hidden>
15 <link rel="last" id="link-last" href="#" title="Last page" hidden -->
16</head>
17<body onload="docLoaded();">
18<header id="header"><div id="header-text">In-Tab UI</div>
19 <img id="headerlogo" src="template/header-logo.png" alt="">
20</header>
21<nav id="slidenav"><div id="subheader-text"></div>
22 <a href="#toc" id="nav-toc" accesskey="t">toc</a> ||
23 <a href="#index" id="nav-start" accesskey="s">start</a> ||
24 <a href="#" id="nav-prev" accesskey="p" hidden>&lt; prev</a>
25 <span id="nav-prev-nolink" class="nolink">&lt; prev</span> |
26 <a href="#" id="nav-next" id="goNext" accesskey="n" hidden>next &gt;</a>
27 <span id="nav-next-nolink" class="nolink">next &gt;</span>
28</nav>
29
30<article id="toc" title="Table of Contents">
31<h1>Table of Contents</h1>
32<h2>In-Tab UI</h2>
33
34<div class="captionedbox">
35<p class="captionedbox-caption">The following slides can be found in this presentation:</p>
36<div class="captionedbox-content">
37<ul id="toc-list">
38</ul>
39</article>
40
41<article id="index" title="Start Page">
42<h1>In-Tab (In-Content) UI</h1>
43
44<div class="simplebox">
45<mark><a href="http://home.kairo.at/">Robert Kaiser</a></mark>,
46"KaiRo" &lt;kairo@kairo.at&gt;
47<br><small>Mozilla contributor, add-on developer, SeaMonkey coordinator</small>
48</div>
49
50<div class="captionedbox">
51<p class="captionedbox-caption">Slides:
52 <a href="http://slides.kairo.at/fosdem2011/">http://slides.kairo.at/fosdem2011/</a></p>
53<div class="captionedbox-content small">
54<ul class="small">
55 <li>Created for
56 <a href="http://fosdem.org/2011/schedule/track/mozilla_devroom">Mozilla
57 Developer Room</a> at <a href="http://www.fosdem.org/">FOSDEM 2011</a> in
58 Brussels.</li>
59 <li>Written with in HTML 5 with CSS 3 and JavaScript.</li>
60 <li>Navigation with links on all slides, with accesskeys
61 (e.g. "n"/Alt+Shift+N for "next") or back/forward keys</li>
62 <li><a href="#toc">Table of Contents</a></li>
63 <li><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/at/"><img
64 alt="Licensed under CC-BY-SA," style="border-width:0;vertical-align:bottom;"
65 src="cc-by-sa-80x15.png" /></a> 02/2011 Robert Kaiser</li>
66</ul>
67</div>
68</div>
69</article>
70
71<article id="basics" title="Basics">
72<h1>Basic Description</h1>
73
74<div class="simplebox">
75<ul>
76 <li>Eliminate separate windows</li>
77 <li><mark>Integrate UI</mark> into browser tabs</li>
78 <li>Non-modal, non-popup</li>
79 <li>Hide web-specific controls for those tabs</li>
80</ul>
81</div>
82</article>
83
84<article id="current" title="Current State">
85<h1>Current State</h1>
86
87<div class="simplebox">
88<ul>
89 <li>about:config</li>
90 <li>Session restore</li>
91 <li>Network error and phishing/malware warning pages</li>
92 <li><mark>FF4 add-ons manager</mark></li>
93</ul>
94<div class="cent topmargin">
95<img src="minefield-addons-manager.png" alt="Add-ons manager">
96</div>
97</div>
98</article>
99
100<article id="plans-prefs" title="Plans: Preferences">
101<h1>Plans: Preferences</h1>
102
103<div class="simplebox">
104<a href="http://blog.stephenhorlander.com/2010/06/01/in-content-ui-visual-unification/">Stephen
105Horlander, June 2010</a>: <mark>preferences</mark> among targets - mockup:
106<div class="cent topmargin">
107<img src="win7-preferences-network.png" alt="Win7 Network Preference Mockup">
108</div>
109</div>
110</article>
111
112<article id="plans-tentative" title="Plans: Tentative">
113<h1>Plans: Tentative</h1>
114
115<div class="simplebox">
116Stephen's blog post and
117<a href="https://wiki.mozilla.org/Firefox/Projects/Incontent_Page_Design">in-content
118page design</a> wiki page go further:
119<ul>
120 <li><mark>Library</mark> (History and Bookmarks View)</li>
121 <li><mark>Downloads</mark> Manager</li>
122 <li>Toolbar <mark>Customization</mark></li>
123 <li>Tab View</li>
124 <li>Home tab</li>
125 <li>About Firefox</li>
126 <li>Help</li>
127</ul>
128<mark>Non-goal</mark>: "Redesign all windows and panels"
129tracking bugs: bug 584942
130</div>
131</article>
132
133<article id="exp-dataman" title="Tahoe">
134<h1>Tahoe Data Manager</h1>
135
136<div class="simplebox cent">
137<img src="minefield-tahoe-dataman.png" alt="Tahoe Data Manager">
138</div>
139</article>
140
141<article id="exp-dlman" title="Jökulsárlón">
142<h1>Jökulsárlón Download Manager</h1>
143
144<div class="simplebox cent">
145<img src="minefield-jokulsarlon-dlman.png" alt="Jökulsárlón Download Manager">
146</div>
147</article>
148
149<article id="exp-mbrot" title="Mandelbrot">
150<h1>KaiRo.at Mandelbrot</h1>
151
152
153<div class="simplebox cent">
154<img src="minefield-mandelbrot.png" alt="KaiRo.at Mandelbrot">
155</div>
156</article>
157
158<article id="demo" title="Demo">
159<h1>Demo</h1>
160
161
162<div class="simplebox">
163Let's take a look at some currently working examples of in-tab UI!
164</div>
165</article>
166
167<article id="end" title="Discussion">
168<h1>Open Discussion</h1>
169
170<div class="captionedbox">
171<p class="captionedbox-caption">Thanks for your attention!</p>
172<div class="captionedbox-content">
173We should have some time for discussion now.
174<ul>
175 <li>Any open questions?</li>
176 <li>Any unmentioned issues?</li>
177 <li>Anything I forgot to mention?</li>
178</ul>
179</div>
180</div>
181</article>
182
183</body>
184</html>
KaiRo's slides for various talks, see slides.kairo.at