sobre_ivprog.html 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6. <title>iVProgH - LInE (free educational software and contents)</title>
  7. <link href="css/bootstrap.min.css" rel="stylesheet">
  8. <link href="css/style.css" rel="stylesheet">
  9. </head>
  10. <body>
  11. <nav class="navbar navbar-expand-md navbar-dark fixed-top" style="background-color: #03396c;">
  12. <b><a class="navbar-brand" href="./">iVProgH</a></b>
  13. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
  14. <span class="navbar-toggler-icon"></span>
  15. </button>
  16. <div class="collapse navbar-collapse" id="navbarsExampleDefault">
  17. <ul class="navbar-nav mr-auto">
  18. <li class="nav-item">
  19. <a class="nav-link" href="./"
  20. title="Navigate to iVProgH homepage.">Home</a>
  21. </li>
  22. <li class="nav-item active">
  23. <a class="nav-link" href="./sobre_ivprog.html"
  24. title="Know what iVProgH is and what iVProgH is for.">About</a>
  25. </li>
  26. <li class="nav-item">
  27. <a class="nav-link" href="./ex_en/index.html"
  28. title="See some examples and test iVProgH online.">Examples</a>
  29. </li>
  30. <li class="nav-item">
  31. <a class="nav-link" href="./download.html"
  32. title="Download a copy of iVProgH for your computer.">Download</a>
  33. </li>
  34. <li class="nav-item">
  35. <a class="nav-link" href="./manual_en/index.html"
  36. title="Access online iVProgH manual and learn about all the features.">Help</a>
  37. </li>
  38. <li class="nav-item">
  39. <a class="nav-link" href="./bugs/report.html"
  40. title="Send a message to the iVProgH team.">Contact</a>
  41. </li>
  42. <li class="nav-item">
  43. <a class="nav-link" href="//www.usp.br/line/"
  44. title="Meet the Laboratory of Informatics in Education of the Institute of Mathematics and Statistics of USP.">LInE</a>
  45. </li>
  46. <li class="nav-item">
  47. <a class="nav-link" href="./docs/"
  48. title="Get access to all iVProgH documentation.">Developers</a>
  49. </li>
  50. <li class="nav-item">
  51. <a class="nav-link" href="./publicacoes.html"
  52. title="Read the team publications about iVProgH.">Publications</a>
  53. </li>
  54. </ul>
  55. <div class="form-inline my-2 my-lg-0">
  56. <a href="../index.html"><img src="img/img_flag_brazil.png"/></a>
  57. <a href="./index.html"><img src="img/img_flag_usa.png"/></a>
  58. </div>
  59. </div>
  60. </nav>
  61. <main role="main">
  62. <div class="container ivprog-container" style="width:90%">
  63. <!-- Page Content -->
  64. <div class="container" style="margin-top:50px;" >
  65. <!-- Portfolio Item Heading -->
  66. <h1 class="my-4">iVProg - Visual Programming
  67. <small>LInE-IME-USP</small>
  68. </h1>
  69. <!-- Portfolio Item Row -->
  70. <div class="row">
  71. <div class="col-md-8">
  72. <figure>
  73. <img class="img-fluid" width="500px" height="250px" src="img/img_ivprogh_soma_pares_2.png"
  74. alt="Image of iVProg-nova interface" />
  75. <figcaption align="center">Fig. 1. iVProg HTML version</figcaption>
  76. <img class="img-fluid" width="500px" height="250px" src="img/img_ivprogh_itarefa.png"
  77. alt="ITarefa interface with iVProgH exercise in Moodle" />
  78. <figcaption align="center">Fig. 2. iVProg integrated into Moodle/iTarefa</figcaption>
  79. </figure>
  80. </div>
  81. <div class="col-md-4">
  82. <h3 class="my-3">About iVProg</h3>
  83. <p>The <i>iVProgH</i> is a free educational system, implemented in HTML5 (HTML + CSS + JavaScript), and is intended for teaching and learning algorithms and programming. The <i>iVProgH</i> was designed from a visual model for programming, and can be used since the second cycle of Elementary School.</p>
  84. <p>The <i>iVProgH</i> allows the use of exercises with automatic evaluation. In addition, using the <a href="../../ia/index.html" title="to examine iTarefa - also developed by LInE">iTarefa</a>, you can easily incorporate it into a <i>Moodle</i> installation (as shown in Figure 2).</p>
  85. <p>The integrated use of <i>iVProgH</i> in the <i>Moodle</i> environment has several advantages, both for teachers and for students. For students, there is the facility to be able to "program" without the need to install any additional system and you can still instantly get a result on your algorithm / solution. For teachers, there is the facility of a report such as all the activities possible to examine each solution sent) and allow the exercise note to be integrated into the <i>Moodle</i>.
  86. </p>
  87. <p>
  88. <a href="ex_pt/index.html" title="examining example of exercises with automatic evaluation in iVProgH" />Try exercise with automatic evaluation</a>
  89. </p>
  90. <p>
  91. <a href="manual_pt/index.html" title="examine the iVProgH summary manual" />Review the <i>iVProgH</i> manual</a>
  92. </p>
  93. </div>
  94. <button type="button" class="btn btn-primary" style="margin-left:50%;margin-bottom: 30px" onclick="javascript:window.history.go(-1)"> Back</button>
  95. </div>
  96. <!-- /.container -->
  97. </div>
  98. </main>
  99. <footer class="container text-center">
  100. <a href="http://www.ime.usp.br/line"><i>iVProgH</i></a> |
  101. <a href="http://www.ime.usp.br/line">LInE</a> |
  102. <a href="http://www.matematica.br">iM&aacute;tica</a>
  103. </footer>
  104. <script src="./js/jquery.min.js"></script>
  105. <script src="./js/bootstrap.bundle.min.js"></script>
  106. </body>
  107. </html>