|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<title>Foo</title> |
|
<meta charset="utf-8" /> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" /> |
|
<style type='text/css'> |
|
body { |
|
font-family: 'Helvetica'; |
|
letter-spacing:-5px; |
|
background:#000; |
|
background-size:100%; |
|
color:#fff; |
|
margin:0; |
|
padding:0; |
|
font-weight:bold; |
|
} |
|
|
|
h1, h2, h3, p { |
|
margin:0; |
|
} |
|
|
|
em, a { |
|
font-style:normal; |
|
color:#8dbd0c; |
|
} |
|
|
|
a { |
|
background: #34d0e7; |
|
color:#000; |
|
text-decoration:none; |
|
} |
|
|
|
img { |
|
width:100%; |
|
} |
|
|
|
div { |
|
cursor:pointer; |
|
cursor:hand; |
|
position:absolute; |
|
top:0; |
|
left:0; |
|
} |
|
|
|
</style> |
|
<script type='text/javascript'> |
|
window.onload = function() { |
|
var s = document.getElementsByTagName('div'), cur = 0; |
|
if (!s) return; |
|
function go(n) { |
|
cur = n; |
|
var i = 1e3, e = s[n]; |
|
for (var k = 0; k < s.length; k++) s[k].style.display = 'none'; |
|
e.style.display = 'inline-block'; |
|
e.style.fontSize = i + 'px'; |
|
if (e.firstChild.nodeName === 'IMG') { |
|
document.body.style.backgroundImage = 'url(' + e.firstChild.src + ')'; |
|
e.firstChild.style.display = 'none'; |
|
} else { |
|
document.body.style.backgroundImage = ''; |
|
document.body.style.backgroundColor = e.style.backgroundColor; |
|
} |
|
while ( |
|
e.offsetWidth > window.innerWidth || |
|
e.offsetHeight > window.innerHeight) { |
|
e.style.fontSize = (i -= 10) + 'px'; |
|
if (i < 0) break; |
|
} |
|
e.style.marginTop = ((window.innerHeight - e.offsetHeight) / 2) + 'px'; |
|
if (window.location.hash !== n) window.location.hash = n; |
|
document.title = e.textContent || e.innerText; |
|
} |
|
document.onclick = function() { |
|
go(++cur % (s.length)); |
|
}; |
|
document.onkeydown = function(e) { |
|
(e.which === 39) && go(Math.min(s.length - 1, ++cur)); |
|
(e.which === 37) && go(Math.max(0, --cur)); |
|
}; |
|
function parse_hash() { |
|
return Math.max(Math.min( |
|
s.length - 1, |
|
parseInt(window.location.hash.substring(1), 10)), 0); |
|
} |
|
if (window.location.hash) cur = parse_hash() || cur; |
|
window.onhashchange = function() { |
|
var c = parse_hash(); |
|
if (c !== cur) go(c); |
|
}; |
|
|
|
go(cur); |
|
}; |
|
</script></head><body> |
|
<div><style> |
|
em{ color: #5cd3fa;} |
|
body {padding: 200px !important;} |
|
ul {padding-left: 50px;} |
|
</style> |
|
|
|
<h1>Jason Tucker</h1> |
|
<p>Improving Support Documentation by using Video in the Dashboard.</p> |
|
<p><em>wpmedia.pro</em></p> |
|
<p><em>wpwatercooler.com</em></p> |
|
</div> |
|
<div><h1>Why video?</h1> |
|
<p>Text Based Learner </p> |
|
<p>vs. </p> |
|
<p>Visual Learner</p> |
|
</div> |
|
<div><h1>Here is why</h1> |
|
<ul> |
|
<li>YouTube is the second largest search engine</li> |
|
<li>Over 6 billion hours of video are watched each month</li> |
|
<li>That's almost an hour for every person on Earth</li> |
|
</ul> |
|
</div> |
|
<div><h1>Look Great</h1> |
|
<ul> |
|
<li>Clean the room you are recording in</li> |
|
<li>Control the noise in the room</li> |
|
<li>Light the room and you</li> |
|
</ul> |
|
</div> |
|
<div><h1>Sound Great</h1> |
|
<ul> |
|
<li><em>Blue Snowball</em> – $69</li> |
|
<li><em>Røde Podcaster</em> – $229</li> |
|
<li><em>Apogee MiC</em> – $199</li> |
|
</ul> |
|
</div> |
|
<div><h1>Main Steps</h1> |
|
<ul> |
|
<li>Recording video from your screen</li> |
|
<li>Saving the file to your computer</li> |
|
<li>Uploading the file to Vimeo or YouTube</li> |
|
<li>Display video with your text documentation</li> |
|
<li>Profit</li> |
|
</ul> |
|
</div> |
|
<div><h1>Screencasting software</h1> |
|
<p>OS X</p> |
|
<ul> |
|
<li><p><em>Quicktime</em> Free</p> |
|
</li> |
|
<li><p><em>ScreenFlow</em> $99 <em><a href="http://wpmedia.pro/screenflow">http://wpmedia.pro/screenflow</a></em></p> |
|
</li> |
|
<li><p><em>SnapzProX</em> $69 <em><a href="http://wpmedia.pro/snapzprox">http://wpmedia.pro/snapzprox</a></em></p> |
|
</li> |
|
</ul> |
|
</div> |
|
<div><h1>Screencasting software</h1> |
|
<p>OS X</p> |
|
<ul> |
|
<li><p><em>Screenflick</em> $29 <em><a href="http://wpmedia.pro/screenflick">http://wpmedia.pro/screenflick</a></em></p> |
|
</li> |
|
<li><p><em>Screeny</em> $14 <em><a href="http://wpmedia.pro/screeny">http://wpmedia.pro/screeny</a></em></p> |
|
</li> |
|
<li><p><em>Screenr</em> $19 / mo ☹ <em><a href="http://wpmedia.pro/screenr">http://wpmedia.pro/screenr</a></em></p> |
|
</li> |
|
</ul> |
|
</div> |
|
<div><h1>Screencasting software</h1> |
|
<p>Windows</p> |
|
<ul> |
|
<li><em>Camtasia</em> $99 <em><a href="http://wpmedia.pro/camtasia">http://wpmedia.pro/camtasia</a></em></li> |
|
</ul> |
|
</div> |
|
<div><h1>Screenflow</h1> |
|
<ul> |
|
<li>Record Screen & PIP of you</li> |
|
<li>Edit video after recording</li> |
|
<li>Add annotations to the video</li> |
|
<li>Save video to local computer</li> |
|
<li>Upload video to Vimeo or YouTube</li> |
|
</ul> |
|
</div> |
|
<div><h1>Plugins</h1> |
|
<h3>WPHelp - Free</h3> |
|
<p><a href="http://wpmedia.pro/wphelp">http://wpmedia.pro/wphelp</a></p> |
|
<h3>Easy Contextual Help for WordPress - $12</h3> |
|
<p><a href="http://wpmedia.pro/contextual">http://wpmedia.pro/contextual</a></p> |
|
</div> |
|
<div><h1>Hide your icons</h1> |
|
<ul> |
|
<li><em>Camoflague</em> $6 |
|
<a href="http://wpmedia.pro/camoflague">http://wpmedia.pro/camoflague</a></li> |
|
</ul> |
|
<p>Hide all of your stuff on the desktop</p> |
|
</div> |
|
<div><h1>Camoflague</h1> |
|
<p><img src="http://wpmedia.pro/wp-content/uploads/2013/09/camo3.gif" alt=""></p> |
|
</div> |
|
<div><h1>Highlight your mouse cursor</h1> |
|
<ul> |
|
<li><em>mouseposé</em> $5 |
|
<a href="http://wpmedia.pro/mousepose">http://wpmedia.pro/mousepose</a></li> |
|
</ul> |
|
<p>Hide all of your stuff on the desktop</p> |
|
</div> |
|
<div><h1>Mousepose</h1> |
|
<p><img src="http://wpmedia.pro/wp-content/uploads/2013/09/mouse.gif" alt=""></p> |
|
</div> |
|
<div><h1>Demo</h1> |
|
</div> |