archive
/
CiDa-Spellbound


			
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
							<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Spellbound | Products</title>
<!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="./css/materialize.css">

  <!-- Compiled and minified JavaScript -->
  <script src="./css/materialize.min.js"></script>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Roboto" rel="stylesheet">


</head>

<body>
<div class="container">
  <div class="row">
    <div class="col s12"><img width="100%" src="./img/eportheader.png"></div>
    <div class="col s12 m4 l2">
      <a class="waves-effect waves-light btn-large purple" href="./index.html">Home</a>
      <a class="waves-effect waves-light btn-large green" href="./evidence.html">Evidence</a>
      <a class="waves-effect waves-light btn-large blue active" href="./products.html">Products</a>
      <img width="100%" src="./img/star.gif" style="margin-top: 5px;">
      <audio controls style="width: 100%;margin-top: 5px;">
        <source src="./Products/Angevin.mp3" type="audio/mpeg">
      Your browser does not support the audio element.
      </audio>
    </div>
    <div class="col s12 m8 l10">
      <h1 class="center">Products</h1>
    </div>
    <div class="col s12 m8 l10">
      <div class="row" style="text-align: center;padding: 9px 32px;">
        <div class="col s12 m3 l3">
          <div class="btn-mtw" onclick="window.open('./Products/meetthewizard.html','_blank')">Meet the Wizard</div>
          The meet the wizard was targeted originally to demonstrate the quiz without the use of sound, once completed it did feel as if it was missing something and so a voice over was added to make the character come to life allowing for a more immersive experience for the user.
        </div>
        <div class="col s12 m3 l3">
          <div class="btn-nav" onclick="window.open('./Products/navigation.html','_blank')">Navigation Screen</div>
          The navigation screen followed the simplistic themes found in css/js scripts such as bootstrap. The original plan was to have the spellbound logo in the center however the logo isn't amazing and it would ruin the simplistic design I was going for.
        </div>
        <div class="col s12 m3 l3">
          <div class="btn-cu" onclick="window.open('./Products/contact.html','_blank')">Contact Us</div>
          The contact screen was fairly simple to throw together as the splashscreen was already in a position to be adapated for this use. It worked out by simply adding some extra text in a contrasting colour to make the information stand out.
        </div>
        <div class="col s12 m3 l3">
          <div class="btn-ss" onclick="window.open('./Products/index.html','_blank')">Splashscreen</div>
          The splashscreen has be through 2 phases. The first had a bland background and text that could have easily been missed but now a gradient is used to allow text and images to stand out more.
        </div>
      </div>
      <div class="row" style="text-align: center;padding: 9px 32px;">
        <div class="col s12 m3 l3 offset-m3 offset-l3">
          <div class="btn-qu" onclick="javascript:quiz();">Quiz</div>
          The quiz was where my functional side could really do its justice. I designed it to be easy to use for the younger children that the software is aimed at. I really enjoyed developing the quiz as it was simplistic yet methodical. The original idea for the quiz was to use a website instead of PowerPoint however due to the lack of software on the school machines I was unable to do it in this way.
        </div>
        <div class="col s12 m3 l3">
          <div class="btn-dv" onclick="window.open('./Products/trailer.html','_blank')">Demo Video</div>
          The demo video was an exciting project to work on. I know how to video edit so that watching a video is not a bore. I think that the video is informative and enjoyable to watch even if the quality has to be lesser than appropriate due to the file size limits.
        </div>
      </div>
    </div>
</div>
</body>
<script type="text/javascript">
function quiz() {
var answer = confirm ("Please save the file then run it.")
if (answer)
window.location="./Products/quiz.ppsx";
}
</script>
</html>