Skip to content

Commit

Permalink
''first'' final version for Codemotion
Browse files Browse the repository at this point in the history
  • Loading branch information
LuisGC committed Nov 25, 2015
1 parent 3e09586 commit a034576
Show file tree
Hide file tree
Showing 7 changed files with 85 additions and 41 deletions.
20 changes: 19 additions & 1 deletion css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -121,6 +121,23 @@ body{
width: inherit;
}

.section-image{
display: block;
margin-left:auto;
margin-right:auto;
left: 0;
right: 0;
bottom:0;
z-index:-1;
position:absolute;
padding-bottom: 40px;
}

.fixed_height{
height: 300px !important;
width: auto;
}

.with_logo{
top: 10%;
}
Expand Down Expand Up @@ -335,7 +352,8 @@ a:link:hover {
display: block;
}

/* EOF Fallback */

.step .notes {
display: none;
}
/* EOF Fallback */
Binary file added img/gifs/developer.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added img/gifs/doubtful.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added img/gifs/thank_you.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added img/gifs/why_not.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added img/gifs/without_words.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
106 changes: 66 additions & 40 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@

<div id="impress">

<div id="title" class="step slide with_height" data-x="3500" data-y="2000" data-z="1000" data-scale="5" data-rotate-x="-25" >
<div id="title" class="step slide with_height" data-x="3600" data-y="1500" data-z="1000" data-scale="5" data-rotate-x="-25" >
<div class="title">
<p><em>Technical debt</em></p>
</div>
Expand Down Expand Up @@ -80,11 +80,13 @@
</div>
</div>

<div id="recurring-comments" class="step slide" data-x="3500" data-y="2000" data-z="-2000" data-rotate-y="90" data-scale="1">
<div id="recurring-comments" class="step slide" data-x="-750" data-y="-3500" data-scale="3">
<div class="section-title">
<h4>Recurring comments</h4>
</div>

<div class="section-image">
<center><img src="img/gifs/doubtful.gif" alt="Without words" class="img_back fixed_height" /></center>
</div>
<div class="notes">
<ul>
<li>Have we not documented this services?</li>
Expand All @@ -99,52 +101,68 @@ <h4>Recurring comments</h4>
</div>
</div>

<div id="recurring-comments-2" class="step slide" data-x="3400" data-y="2100" data-z="-2000" data-rotate-y="90" data-scale="1">
<div id="recurring-comments-2" class="step slide" data-x="-750" data-y="-3500" data-z="-200" data-rotate-x="-10" data-scale="1">
<div class="section-title">
<p>Have we not documented this services?</p>
</div>
</div>

<div id="recurring-comments-3" class="step slide" data-x="3300" data-y="2200" data-z="-2000" data-rotate-y="90" data-scale="1">
<div id="recurring-comments-3" class="step slide" data-x="-750" data-y="-3500" data-z="-300" data-rotate-x="20" data-scale="1">
<div class="section-title">
<p>I thought we had tested this module...</p>
</div>
</div>

<div id="recurring-comments-4" class="step slide" data-x="3200" data-y="2300" data-z="-2000" data-rotate-y="90" data-scale="1">
<div id="recurring-comments-4" class="step slide" data-x="-750" data-y="-3500" data-z="-500" data-rotate-x="40" data-scale="1">
<div class="section-title">
<p>Fixing this will break that...
<br />
I think</p>
</div>
</div>

<div id="recurring-comments-5" class="step slide" data-x="3100" data-y="2400" data-z="-2000" data-rotate-y="90" data-scale="1">
<div id="recurring-comments-5" class="step slide" data-x="-750" data-y="-3500" data-z="-700" data-rotate-x="60" data-scale="1">
<div class="section-title">
<p>Don't touch that!
<br />
last time someone touched $whatever broke</p>
</div>
</div>

<div id="recurring-comments-6" class="step slide" data-x="3000" data-y="2500" data-z="-2000" data-rotate-y="90" data-scale="1">
<div id="recurring-comments-6" class="step slide" data-x="-750" data-y="-3500" data-z="-900" data-rotate-x="80" data-scale="1">
<div class="section-title">
<p>Write a comment and we'll fix it later</p>
</div>
</div>

<div id="recurring-comments-7" class="step slide" data-x="2900" data-y="2600" data-z="-2000" data-rotate-y="90" data-scale="1">
<div id="recurring-comments-7" class="step slide" data-x="-750" data-y="-3500" data-z="-1100" data-rotate-x="100" data-scale="1">
<div class="section-title">
<p>OMG!
<br />
I just changed ONE line!</p>
</div>
</div>

<div id="survey" class="step slide" data-x="3000" data-y="-2000" data-scale="3" data-z="-3000" data-rotate="-30" data-rotate-y="-90">
<div id="visual-definition" class="step slide" data-x="2200" data-y="-3000" data-scale="3" >
<div class="slide-title">
<p>The most widespread opinion:</p>
</div>
<div class="slide-content">
<br /><br />
<center><img src="img/technical-debt-chart.jpg" alt="Visual definition of Technical Debt" class="img_back maxed_height" /></center>
<div class="source">
<p>Source: <a href="http://softwareengineeringdaily.com/2015/11/17/machine-learning-and-technical-debt-with-d-sculley/">Software Engineering Daily</a></p>
</div>
</div>
</div>

<div id="survey" class="step slide" data-x="5300" data-y="-3500" data-scale="3" >
<div class="section-title">
<h3>Technical Debt... <br /><em>is it good or bad?</em></h3>
<p>but... <em>is it good or bad?</em></p>
</div>
<div class="section-image">
<center><img src="img/gifs/without_words.gif" alt="Without words" class="img_back fixed_height" /></center>
</div>
<div class="notes">
<p>Ron Jeffries:<p>
<ul>
Expand All @@ -154,19 +172,6 @@ <h3>Technical Debt... <br /><em>is it good or bad?</em></h3>
</div>
</div>

<div id="visual-definition" class="step slide" data-x="3500" data-y="-1000" data-scale="4">
<div class="slide-title centered-title">
<h3><em>Visual Definition</em></h3>
</div>
<div class="slide-content">
<br /><br />
<center><img src="img/technical-debt-chart.jpg" alt="Visual definition of Technical Debt" class="img_back maxed_height" /></center>
<div class="source">
<p>Source: <a href="http://softwareengineeringdaily.com/2015/11/17/machine-learning-and-technical-debt-with-d-sculley/">Software Engineering Daily</a></p>
</div>
</div>
</div>

<div id="reasons" class="step slide" data-x="8000" data-y="-500" data-scale="4">
<div class="slide-title">My reasons to give this talk</div>
<div class="slide-content">
Expand All @@ -179,26 +184,31 @@ <h3><em>Visual Definition</em></h3>
</div>
</div>

<div id="content" class="step slide" data-x="8500" data-y="2500" data-scale="5">
<div id="content" class="step slide" data-x="8500" data-y="2000" data-scale="5">
<div class="slide-title centered-title">
<h3><em>Content</em></h3>
</div>
<div class="slide-content">
<ol class="lv2_indent">
<li>Introduction to tecnnical debt</li>
<li>Introduction to technical debt</li>
<ul class="lv1_indent">
<li>Analogies with financial debt</li>
<li>Types of technical debt</li>
<li>Symptoms</li>
<li>Advantages and disadvantages</li>
</ul>
<li>How, when and why <i>borrow</i></li>
<li>Technical debt vs low quality code</li>
<ul class="lv1_indent">
<li>Avoiding unitended debt</li>
<li>How to borrow intentionally</li>
<li>Technical debt vs low quality code</li>
</ul>
<li>Paying off technical debt</li>
</ol>
</div>
</div>

<div id="intro" class="step slide" data-x="9000" data-y="4000" data-rotate="90">
<div id="intro" class="step slide" data-x="9000" data-y="4200" data-rotate="90">
<div class="slide-title"><em>Introduction</em></div>
<div class="slide-content">
<p><i>Shipping first time code is like going into <em>debt</em>. A little debt speeds development so long as it is paid back promptly with a rewrite. [...] The <em>danger</em> occurs when the debt is not repaid. Every minute spent on not-quite-right code counts as <em>interest</em> on that debt. Entire engineering organizations can be brought to a stand-still under the debt load of an unconsolidated implementation.</i></p>
Expand All @@ -218,7 +228,7 @@ <h3><em>Content</em></h3>
</div>
</div>

<div id="analogies" class="step slide" data-x="8000" data-y="4000">
<div id="analogies" class="step slide" data-x="8500" data-y="4200">
<div class="slide-title"><em>Analogies</em> with financial debt</div>
<div class="slide-content">
<ul class="lv2_indent">
Expand All @@ -242,7 +252,7 @@ <h3><em>Content</em></h3>
</div>
</div>

<div id="types-of-debt" class="step slide" data-x="7000" data-y="4000" data-rotate="90">
<div id="types-of-debt" class="step slide" data-x="7500" data-y="4200" data-rotate="90">
<div class="slide-title">Types of technical debt</div>
<div class="slide-content">
<ul class="lv0_indent">
Expand Down Expand Up @@ -270,7 +280,7 @@ <h3><em>Content</em></h3>
</div>
</div>

<div id="symptoms" class="step slide" data-x="6250" data-y="4000">
<div id="symptoms" class="step slide" data-x="7000" data-y="4200">
<div class="slide-title">Symptoms</div>
<div class="slide-content">
<ul class="lv0_indent">
Expand Down Expand Up @@ -300,7 +310,7 @@ <h3><em>Content</em></h3>
</div>
</div>

<div id="advantages-and-disadvantages" class="step slide" data-x="6500" data-y="5000" data-rotate="-90">
<div id="advantages-and-disadvantages" class="step slide" data-x="5800" data-y="4200" data-rotate="-90">
<div class="slide-title">Advantages and disadvantages</div>
<div class="slide-content">
<ul class="lv0_indent">
Expand Down Expand Up @@ -332,8 +342,17 @@ <h3><em>Content</em></h3>
</div>
</div>

<div id="how-when-why" class="step slide" data-x="8000" data-y="-3500" data-scale="3">
<div class="section-title centered-title">
<p>How, when and why</p>
</div>
<div class="section-image">
<br /><br />
<center><img src="img/gifs/why_not.gif" alt="Why not" class="img_back fixed_height" /></center>
</div>
</div>

<div id="avoiding-unintended-debt" class="step slide" data-x="7500" data-y="5000">
<div id="avoiding-unintended-debt" class="step slide" data-x="5900" data-y="5200">
<div class="slide-title">Avoiding unintended debt</div>
<div class="slide-content">
<ul>
Expand All @@ -349,7 +368,7 @@ <h3><em>Content</em></h3>
</div>
</div>

<div id="how-to-borrow" class="step slide" data-x="8500" data-y="5000" data-rotate="90">
<div id="how-to-borrow" class="step slide" data-x="5900" data-y="5800" data-rotate="180">
<div class="slide-title">How to borrow intentionally</div>
<div class="slide-content">
<ul class="lv0_indent">
Expand All @@ -364,7 +383,7 @@ <h3><em>Content</em></h3>
</div>
</div>

<div id="technical-debt-vs-bad-code" class="step slide" data-x="5000" data-y="-2500" data-z="-20000" data-scale="3" data-rotate-y="90">
<div id="technical-debt-vs-bad-code" class="step slide" data-x="8800" data-y="5300" data-rotate-z="90" data-scale="2">
<div class="section-title">
<h3>Technical debt <br /><em>vs</em> <br />Low quality code</h3>
</div>
Expand All @@ -384,7 +403,11 @@ <h3>Technical debt <br /><em>vs</em> <br />Low quality code</h3>

<div id="paying-technical-debt" class="step slide" data-x="-250" data-y="-1500" data-scale="3">
<div class="section-title">
<h3><em>Paying</em><br /> technical debt</h3>
<h3><em>Paying off</em> technical debt</h3>
</div>
<div class="section-image">
<br /><br />
<center><img src="img/gifs/developer.gif" alt="Developer" class="img_back fixed_height" /></center>
</div>
<div class="notes">
<ul>
Expand Down Expand Up @@ -429,7 +452,7 @@ <h3><em>Paying</em><br /> technical debt</h3>
</div>
</div>

<div id="bibliography" class="step slide" data-x="3500" data-y="4500" data-scale="4">
<div id="bibliography" class="step slide" data-x="3500" data-y="5000" data-scale="4">
<div class="slide-title centered-title">Bibliography</div>
<div class="slide-content">

Expand Down Expand Up @@ -490,10 +513,13 @@ <h3><em>Paying</em><br /> technical debt</h3>
</div>
</div>

<div id="questions" class="step slide" data-x="3500" data-y="3400" data-scale="3" data-rotate-y="90">
<div class="section-title lower">
<h3>Ask Me Anything !!</h3>
<div id="questions" class="step slide" data-x="7300" data-y="5000" data-scale="3">
<div class="section-title">
<p><em>Ask Me Anything !!</em></p>
</div>
<div class="section-image">
<center><img src="img/gifs/thank_you.gif" alt="Thank you" class="img_back fixed_height" /></center>
</div>
</div>

<div id="overview" class="step" data-x="3500" data-y="2000" data-rotate-x="-25" data-scale="12"></div>
Expand Down

0 comments on commit a034576

Please sign in to comment.