quickgrapher/quickgrapher-walkthrough.html at master · huntergdavis/quickgrapher · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!--
Sliders.html, a simple javascript equation parser that creats dynamic sliders based on the equation
based on original work by Hunter Davis, 2010
Copyright Discursive Labs, LLC
We still need to decided on a license for our internal tools we share with the community
So if you'd like this to be gpl, send us an email
hunter or mark at discursivelabs.com
-->
<!doctype html>
<html lang="en">

  <head>
    <meta charset="utf-8"/>
    <title>QuickGrapher Help</title>

    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <link rel="stylesheet" media="all" href="http://www.hunterdavis.com/quickgrapher/css/less-style.css"/>
    <meta name="viewport" content="width=device-width; initial-scale=1"/>
    <!-- Add "maximum-scale=1" to fix the Mobile Safari auto-zoom bug on orientation changes,
      but keep in mind that it will disable user-zooming completely. Bad for accessibility. -->
    <!--script src="/js/obfs.js" type="text/javascript" charset="utf-8"></script-->
  </head>

  <body>
    <div id="container">
      <div id="inner">
        <span style="width: 100%;">
          <a href="http://www.hunterdavis.com/quickgrapher/">
            <img class="logo" src="http://www.hunterdavis.com/quickgrapher/images/logo_1.png"></img>
          </a>
        </span>

        <h2>QuickGrapher - A Quick Start Guide</h2>
        <div class="instructions">
        QuickGrapher is an equation graphing and interaction tool designed from the ground up to be easy to use and intuitive. If you have never used QuickGrapher before and are wondering where to begin, have a look at the two step-by-step annotated walkthroughs below. Or, you can view a set of introductory videos <a href="http://www.hunterdavis.com/quickgrapher//quickgrapher-tutorials.html">here</a> and read a list of frequently asked questions <a href="http://www.hunterdavis.com/quickgrapher//quickgrapher-faq.html">here.</a> <br/>

        <h2>Walkthrough 1 - Interacting With An Equation</h2>
        <ol>
        <li>Select An Equation From the Examples Box</li>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/1/examples_v2.jpg"/>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/1/examplesopen_v2.jpg"/>
        <li>Adjust the Variable Values with Sliders</li>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/1/variables_v2.jpg"/>
        <li>Click Re-Solve, or Enable "Dynamic Graph Updates"</li>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/1/resolveordynamic_v2.jpg"/>
        </ol>

        <h2>Walkthrough 2 - Creating an Equation</h2>
        <ol>
        <li>Select Functions From the Functions Box</li>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/2/functions_v2.jpg"/>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/2/functionsopen_v2.jpg"/>
        <li>Name Your Graph and Enter Variables</li>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/2/graphname_and_variable_v2.jpg"/>
        <li>Click "Graph!"</li>
        <li>Adjust the Variable Values with Sliders</li>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/2/adjust_variables_v2.jpg"/>
        <li>Click Re-Solve, or Enable "Dynamic Graph Updates"</li>
        <img class="walkthroughs" src="http://www.hunterdavis.com/quickgrapher/images/walkthroughs/2/finished_product_v2.jpg"/>
        </ol>

        </div>


      </div>
    </div>
    <center>
      Email: <font style="font-weight: bold">hunter @ hunterdavis.com/quickgrapher/</font><br/>
      Copyright 2011 Discursive Labs, LLC
    </center>
    <div id="beta_box" style="position:absolute; top: 0px; right: 0px; padding: 4px; font-weight: bold; font-size: 13pt; color: rgb(195,220,235); background-color: rgb(164,157,143); width: 120px; text-align: right; border: 1px solid rgb(144,136,125);">
        <div style="text-align: center;">We love feedback & suggestions!</div><br/><br/>
        <font style="font-size: 10pt;">Let us know your thoughts in an email to</font>
        <div style="text-align: left; color: rgb(53, 52, 49); margin-bottom: -5px; padding-bottom: 10px; border-bottom: 1px solid black"><br/>beta <font style="color: rgb(255,255,255);">@</font><br/><font style="font-size: 10pt;">hunterdavis.com/quickgrapher/</font></div>
    </div>
    <script type="text/javascript">
        // Google analytics
        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-19995643-2']);
        _gaq.push(['_trackPageview']);

        (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
    </script>
  </body>

</html>