diff options
Diffstat (limited to 'all.html')
| -rw-r--r-- | all.html | 461 |
1 files changed, 256 insertions, 205 deletions
@@ -13,211 +13,262 @@ <script src="navbar.js"></script> <h2>All projects</h2> - <img src="screenshots/AutoImages.png" width=200 height=200><br> - <a href="AutoImages.html">AutoImages</a><br> - <p> - A computer program that creates art. It uses<br> - random functions to generate images. An explanation<br> - can be found <a href="explanation.html">here</a>.<br> - There is also AutoArtEvolve, which improves its<br> - images based on the ones you prefer:<br> - <iframe frameborder="0" src="https://itch.io/embed/43294?linkback=true&bg_color=fafafa&fg_color=000000&link_color=5ca4fa&border_color=9f9f9f" width="552" height="167"></iframe> - </p> - <hr> - - <video width="250" height="250" controls> - <source src="autovideo.mp4" type="video/mp4"> - </video><br> - <a href="AutoVideos.html">AutoVideos</a><br> - <p> - A computer program that creates videos. It uses<br> - random functions to generate videos. An explanation<br> - can be found <a href="explanation.html">here</a>.<br> - </p> - <hr> - - <audio controls> - <source src="autoaudio.wav" type="audio/wav"> - </audio><br> - <a href="AutoAudio.html">AutoAudio</a><br> - <p> - A computer program that creates audio. It uses<br> - random functions to generate audio. An explanation<br> - can be found <a href="explanation.html">here</a>.<br> - </p> - <hr> - - - <img src="screenshots/NameGenerator.png" width=200 height=200><br> - <a href="NameGenerator.html">NameGenerator</a><br> - <p> - A computer program that generates names! It uses<br> - the frequencies of trigrams.<br> - </p> - <hr> - - <p>Domino simulator <a href="DominoSimulator.html">web version</a> or <a href="https://qualum.itch.io/domino-simulator">offline version</a></p> - <iframe frameborder="0" src="https://itch.io/embed/77009?linkback=true" width="552" height="167"></iframe><br> - <p> - Place dominos, then knock them over. - </p> - <hr> - - <img src="screenshots/AutoHarmonograph.png" width=200 height=200><br> - <a href="AutoHarmonograph.html">AutoHarmonograph</a> or <a href="Harmonograph.html">Non-randomized</a><br> - <p> - A randomized <a href="https://en.wikipedia.org/wiki/Harmonograph">Harmonograph</a>. You pick the - number of pendulums. - </p> - <hr> - - <img src="screenshots/2d3d.png" width=200 height=200><img src="screenshots/2d3dcustom.png" width=200 height=200><br> - <a href="2d23d.html">2D becomes 3D</a> (and <a href="2d23dcustom.html">2D becomes 3D custom</a> - where you pick the starting shape)<br> - <p> - Different 2D shapes are moved around in circles<br> - to form 3D objects. - </p> - <hr> - - <img src="screenshots/clock.png" width=200 height=200><br> - <a href="clock.html">Clock</a><br> - <p> - A clock that shows the time of day with circles<br> - going around in circles. The colours of the circles<br> - change depending on the time. The innermost circle<br> - is seconds, the second is minutes, the third is<br> - hours, and the fourth is the day of the year.</p> - <hr> - - <img src="screenshots/mazesolver.png" width=200 height=200><br> - <a href="mazesolver.html">Maze Solver</a><br> - <p> - Create a maze, choose a starting point and an<br> - ending point, and your computer will solve the<br> - maze. - </p> - <hr> - - <img src="screenshots/ElementaryCellularAutomata.png" width=400 height=400><br> - <a href="elementarycellularautomata.html">Elementary cellular automata</a><br> - <p> - Run <a href="https://en.wikipedia.org/wiki/Elementary_cellular_automaton">elementary cellular automata</a>. - </p> - <hr> - - <img src="screenshots/h.png" width=200 height=200><br> - <a href="h.html">H</a><br> - <p> - Pick simple rules, and watch a cool pattern<br> - start to appear. - </p> - <hr> - <img src="screenshots/tree.png" width=200 height=200><br> - <a href="tree.html">Tree</a> and <a href="treegenerator.html">Tree generator</a> - <p> - Move your mouse around to see a tree change shape.<br> - In Tree Generator, you choose all the tree parameters<br> - but in Tree, you move your mouse around to pick the<br> parameters.<br> - <hr> - - <img src="screenshots/ballbounce.png" width=200 height=200><br> - <a href="ballbounce.html">Ball bounce</a><br> - <p> - Try to bounce a ball with your mouse. The game<br> - gets harder and harder because you can't see the<br> - ball behind its tracks.<br> - </p> - <hr> - - <img src="screenshots/magnets.png" width=200 height=200><br> - <a href="magnets.html">Magnets</a><br> - <p> - Try to avoid magnets which are attracted to your<br> - mouse. - </p> - <hr> - - <img src="screenshots/modularpascal.png" width=256 height=256><br> - <a href="modularpascal.html">Modular Pascal's Triangle</a><br> - <p> - A picture of Pascal's triangle mod x. Set x and<br> - Click update to see the triangle. </p> - <hr> - - <img src="screenshots/modularcircles.png" width=250 height=250><br> - <a href="modularcircles.html">Modular Circles</a><br> - <p> - There are a circle of points, each one corresponding<br> - to a number. Lines are drawn between points according<br> - to rules. Create interesting shapes like cardioids<br> - </p> - <hr> - - <img src="screenshots/shaperoller.png" width=250 height=250><br> - <a href="shaperoller.html">Shape Roller</a><br> - <p> - This program rolls (invisible) shapes around other <br> - (invisible) shapes and traces a point on the shape as<br> - it moves along. Create interesting shapes like cardioids.<br> - </p> - <hr> - - <img src="screenshots/mandelbrot.png" width=250 height=250><br> - <a href="mandelbrot.html">The Mandelbrot Set</a><br> - <p> - This program draws the Mandelbrot Set. You can<br> - zoom in and change the power.<br> - </p> - <hr> - - <img src="screenshots/ant.png" width=250 height=250><br> - <a href="ant.html">Langton's Ant</a><br> - <p> - This is the cellular automaton known as Langton's<br> - Ant. You can find out more about it <a href="https://en.wikipedia.org/wiki/Langton%27s_ant">here</a>. - </p> - <hr> - - <img src="screenshots/picalculator.png" width=250 height=250><br> - <a href="2pi.html">π Calculator</a><br> - <p> - Draw a circle, then find out how well your circle<br> - approximates π!<br> - </p> - <hr> - - <img src="screenshots/anagramgame.png" width=250 height=250><br> - <a href="anagramgame.html">The Anagram Game</a><br> - <p> - Find an anagram of a random 7-letter word. - </p> - <hr> - - <img src="screenshots/autoartapp.png" width=200><br> - <a href="https://play.google.com/store/apps/details?id=org.neocities.autoart.autoart">AutoArt</a><br> - The Android app for <a href="AutoImages.html">AutoImages</a>.<br> - <hr> - - <img src="screenshots/magnetsapp.png" width=200><br> - <a href="https://play.google.com/store/apps/details?id=org.neocities.autoart.magnets">Magnets</a><br> - <p> - The Android app for <a href="magnets.html">Magnets</a>.<br> - </p> - <hr> - - <img src="screenshots/ballbounceapp.png" width=200><br> - <a href="https://play.google.com/store/apps/details?id=org.neocities.autoart.ballbounce">Ball Bounce</a><br> - <p> - The Android app for <a href="ballbounce.html">Ball Bounce</a>.<br> - </p> - <hr> - - - - <p> - More coming soon! - </p> + + <div class="container-fluid"> + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/AutoImages.png" width=200 height=200><br> + <div class="project-title"><a href="AutoImages.html">AutoImages</a></div> + A computer program that creates art. It uses + random functions to generate images. An explanation + can be found <a href="explanation.html">here</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <iframe frameborder="0" src="https://itch.io/embed/43294?link_color=27a0c3" width="208" height="167"></iframe> + <div class="project-title"><a href="https://qualum.itch.io/autoartevolve">AutoArtEvolve</a></div> + AutoArtEvolve improves its + images based on the ones you prefer + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <video width="250" height="250" controls> + <source src="autovideo.mp4" type="video/mp4"> + </video><br> + <div class="project-title"><a href="AutoVideos.html">AutoVideos</a></div> + A computer program that creates videos. It uses + random functions to generate videos. An explanation + can be found <a href="explanation.html">here</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <audio controls> + <source src="autoaudio.wav" type="audio/wav"> + </audio><br> + <div class="project-title"><a href="AutoAudio.html">AutoAudio</a></div> + A computer program that creates audio. It uses + random functions to generate audio. An explanation + can be found <a href="explanation.html">here</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/NameGenerator.png" width=200 height=200><br> + <div class="project-title"><a href="NameGenerator.html">NameGenerator</a></div> + A computer program that generates names! It uses + the frequencies of trigrams. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <iframe frameborder="0" src="https://itch.io/embed/77009?link_color=18829f" width="208" height="167"></iframe><br> + <div class="full-title"> + <span class="project-title">Domino simulator</span> + <a href="DominoSimulator.html">web version</a> or <a href="https://qualum.itch.io/domino-simulator">offline version</a> + </div> + Place dominos, then knock them over. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/AutoHarmonograph.png" width=200 height=200><br> + <div class="full-title"> + <span class="project-title"><a href="AutoHarmonograph.html">AutoHarmonograph</a></span> or + <span class="project-title"><a href="Harmonograph.html">Non-randomized</a></span> + </div> + A randomized <a href="https://en.wikipedia.org/wiki/Harmonograph">Harmonograph</a>. You pick the + number of pendulums. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/2d3d.png" width=200 height=200><img src="screenshots/2d3dcustom.png" width=200 height=200><br> + <div class="full-title"> + <span class="project-title"><a href="2d23d.html">2D becomes 3D</a></span> + (and <span class="project-title"><a href="2d23dcustom.html">2D becomes 3D custom</a></span> + where you pick the starting shape) + </div> + Different 2D shapes are moved around in circles + to form 3D objects. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/clock.png" width=200 height=200><br> + <div class="project-title"><a href="clock.html">Clock</a></div> + A clock that shows the time of day with circles + going around in circles. The colours of the circles + change depending on the time. The innermost circle + is seconds, the second is minutes, the third is + hours, and the fourth is the day of the year. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/mazesolver.png" width=200 height=200><br> + <div class="project-title"><a href="mazesolver.html">Maze Solver</a></div> + Create a maze, choose a starting point and an + ending point, and your computer will solve the + maze. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/ElementaryCellularAutomata.png" width=400 height=400><br> + <div class="project-title"><a href="elementarycellularautomata.html">Elementary cellular automata</a></div> + Run <a href="https://en.wikipedia.org/wiki/Elementary_cellular_automaton">elementary cellular automata</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/h.png" width=200 height=200><br> + <div class="project-title"><a href="h.html">H</a></div> + Pick simple rules, and watch a cool pattern + start to appear. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/tree.png" width=200 height=200><br> + <div class="full-title"> + <span class="project-title"><a href="tree.html">Tree</a></span> and + <span class="project-title"><a href="treegenerator.html">Tree generator</a></span> + </div> + Move your mouse around to see a tree change shape. + In Tree Generator, you choose all the tree parameters + but in Tree, you move your mouse around to pick the parameters. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/ballbounce.png" width=200 height=200><br> + <div class="project-title"><a href="ballbounce.html">Ball bounce</a></div> + Try to bounce a ball with your mouse. The game + gets harder and harder because you can't see the + ball behind its tracks. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/magnets.png" width=200 height=200><br> + <div class="project-title"><a href="magnets.html">Magnets</a></div> + Try to avoid magnets which are attracted to your + mouse. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/modularpascal.png" width=256 height=256><br> + <div class="project-title"><a href="modularpascal.html">Modular Pascal's Triangle</a></div> + A picture of Pascal's triangle mod x. Set x and + Click update to see the triangle. + </div> + </div> + + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/modularcircles.png" width=250 height=250><br> + <div class="project-title"><a href="modularcircles.html">Modular Circles</a></div> + There are a circle of points, each one corresponding + to a number. Lines are drawn between points according + to rules. Create interesting shapes like cardioids + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/shaperoller.png" width=250 height=250><br> + <div class="project-title"><a href="shaperoller.html">Shape Roller</a></div> + This program rolls (invisible) shapes around other + (invisible) shapes and traces a point on the shape as + it moves along. Create interesting shapes like cardioids. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/mandelbrot.png" width=250 height=250><br> + <div class="project-title"><a href="mandelbrot.html">The Mandelbrot Set</a></div> + This program draws the Mandelbrot Set. You can + zoom in and change the power. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/ant.png" width=250 height=250><br> + <div class="project-title"><a href="ant.html">Langton's Ant</a></div> + This is the cellular automaton known as Langton's + Ant. You can find out more about it <a href="https://en.wikipedia.org/wiki/Langton%27s_ant">here</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/picalculator.png" width=250 height=250><br> + <div class="project-title"><a href="2pi.html">π Calculator</a></div> + Draw a circle, then find out how well your circle + approximates π! + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/anagramgame.png" width=250 height=250><br> + <div class="project-title"><a href="anagramgame.html">The Anagram Game</a></div> + Find an anagram of a random 7-letter word. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/autoartapp.png" width=200> + <div class="project-title"><a href="https://play.google.com/store/apps/details?id=org.neocities.autoart.autoart">AutoArt App</a></div> + The Android app for <a href="AutoImages.html">AutoImages</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/magnetsapp.png" width=200> + <div class="project-title"><a href="https://play.google.com/store/apps/details?id=org.neocities.autoart.magnets">Magnets App</a></div> + The Android app for <a href="magnets.html">Magnets</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + <img src="screenshots/ballbounceapp.png" width=200> + <div class="project-title"><a href="https://play.google.com/store/apps/details?id=org.neocities.autoart.ballbounce">Ball Bounce App</a></div> + The Android app for <a href="ballbounce.html">Ball Bounce</a>. + </div> + </div> + + <div class="row"> + <div class="col-lg-4 col-md-6 col-sm-8 col-xs-10 well well-sm project"> + More coming soon! + </div> + </div> + </div> </body> <footer> |