diff options
Diffstat (limited to 'website/index.html')
| -rw-r--r-- | website/index.html | 324 |
1 files changed, 164 insertions, 160 deletions
diff --git a/website/index.html b/website/index.html index aa2b1bc..75e4a46 100644 --- a/website/index.html +++ b/website/index.html | |||
| @@ -1,160 +1,164 @@ | |||
| 1 | <!doctype html> | 1 | <!doctype html> |
| 2 | <html lang="en"> | 2 | <html lang="en"> |
| 3 | <head> | 3 | <head> |
| 4 | <meta charset="utf-8"> | 4 | <meta charset="utf-8"> |
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | 5 | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| 6 | <meta name="description" content="A thrilling adventure game at ESIEE Paris."> | 6 | <meta name="description" content="A thrilling adventure game at ESIEE Paris."> |
| 7 | 7 | ||
| 8 | <title>ESIEEquest</title> | 8 | <title>ESIEEquest</title> |
| 9 | 9 | ||
| 10 | <link rel="shortcut icon" href="/assets/img/favicon.png"> | 10 | <link rel="shortcut icon" href="/assets/img/favicon.png"> |
| 11 | 11 | ||
| 12 | <link rel="stylesheet" href="/assets/css/pure-min.css"> | 12 | <link rel="stylesheet" href="/assets/css/pure-min.css"> |
| 13 | <link rel="stylesheet" href="/assets/css/font-awesome.min.css"> | 13 | <link rel="stylesheet" href="/assets/css/font-awesome.min.css"> |
| 14 | <link rel="stylesheet" href="/assets/css/main-grid.css"> | 14 | <link rel="stylesheet" href="/assets/css/main-grid.css"> |
| 15 | <link rel="stylesheet" href="/assets/css/marketing.css"> | 15 | <link rel="stylesheet" href="/assets/css/marketing.css"> |
| 16 | <link rel="stylesheet" href="/assets/css/style.css"> | 16 | <link rel="stylesheet" href="/assets/css/style.css"> |
| 17 | </head> | 17 | </head> |
| 18 | <body> | 18 | <body> |
| 19 | <div class="header"> | 19 | <div class="header"> |
| 20 | <div class="home-menu pure-menu pure-menu-open pure-menu-horizontal pure-menu-fixed"> | 20 | <div class="home-menu pure-menu pure-menu-open pure-menu-horizontal pure-menu-fixed"> |
| 21 | <a class="pure-menu-heading" href="#">ESIEEquest</a> | 21 | <a class="pure-menu-heading" href="#">ESIEEquest</a> |
| 22 | <ul> | 22 | <ul> |
| 23 | <li> | 23 | <li> |
| 24 | <a href="#">Play</a> | 24 | <a href="#">Play</a> |
| 25 | </li> | 25 | </li> |
| 26 | <li> | 26 | <li> |
| 27 | <a href="#help">Help</a> | 27 | <a href="#help">Help</a> |
| 28 | </li> | 28 | </li> |
| 29 | <li> | 29 | <li> |
| 30 | <a href="#about">About</a> | 30 | <a href="#about">About</a> |
| 31 | </li> | 31 | </li> |
| 32 | </ul> | 32 | </ul> |
| 33 | </div> | 33 | </div> |
| 34 | </div> | 34 | </div> |
| 35 | 35 | ||
| 36 | <div class="splash-container"> | 36 | <div class="splash-container"> |
| 37 | <div class="splash"> | 37 | <div class="splash"> |
| 38 | <h1 class="splash-head">ESIEEquest</h1> | 38 | <h1 class="splash-head">ESIEEquest</h1> |
| 39 | <p class="splash-subhead"> | 39 | <p class="splash-subhead"> |
| 40 | The Universe has encountered an error. Press any key to continue. | 40 | The Universe has encountered an error. Press any key to continue. |
| 41 | </p> | 41 | </p> |
| 42 | <p> | 42 | <p> |
| 43 | <a href="#play" class="pure-button pure-button-primary">This is any key</a> | 43 | <a href="#play" class="pure-button pure-button-primary">This is any key</a> |
| 44 | </p> | 44 | </p> |
| 45 | </div> | 45 | </div> |
| 46 | </div> | 46 | </div> |
| 47 | 47 | ||
| 48 | <div class="content-wrapper"> | 48 | <div class="content-wrapper"> |
| 49 | <div class="content"> | 49 | <div class="content"> |
| 50 | <h2 class="content-head is-center">ESIEE + quest = ESIEEquest</h2> | 50 | <h2 class="content-head is-center">ESIEE + quest = ESIEEquest</h2> |
| 51 | <div class="pure-g"> | 51 | <div class="pure-g"> |
| 52 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> | 52 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> |
| 53 | 53 | ||
| 54 | <h3 class="content-subhead"><i class="fa fa-superscript"></i> Meet a friend </h3> | 54 | <h3 class="content-subhead"><i class="fa fa-superscript"></i> Meet a friend </h3> |
| 55 | <p> | 55 | <p> |
| 56 | He will guide you gladly... at one necessary but not sufficient condition. | 56 | He will guide you gladly... at one necessary but not sufficient condition. |
| 57 | </p> | 57 | </p> |
| 58 | </div> | 58 | </div> |
| 59 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> | 59 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> |
| 60 | <h3 class="content-subhead"><i class="fa fa-save"></i> Obtain the program </h3> | 60 | <h3 class="content-subhead"><i class="fa fa-save"></i> Obtain the program </h3> |
| 61 | <p> | 61 | <p> |
| 62 | The legend says that a sage made a special program, a long time ago. | 62 | The legend says that a sage made a special program, a long time ago. |
| 63 | </p> | 63 | </p> |
| 64 | </div> | 64 | </div> |
| 65 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> | 65 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> |
| 66 | <h3 class="content-subhead"><i class="fa fa-suitcase"></i> Find the device </h3> | 66 | <h3 class="content-subhead"><i class="fa fa-suitcase"></i> Find the device </h3> |
| 67 | <p> | 67 | <p> |
| 68 | It's impressive to see what they made using a "micro"controller and some adhesive tape. | 68 | It's impressive to see what they made using a "micro"controller and some adhesive tape. |
| 69 | </p> | 69 | </p> |
| 70 | </div> | 70 | </div> |
| 71 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> | 71 | <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-4"> |
| 72 | <h3 class="content-subhead"><i class="fa fa-terminal"></i> Reboot everything </h3> | 72 | <h3 class="content-subhead"><i class="fa fa-terminal"></i> Reboot everything </h3> |
| 73 | <p> | 73 | <p> |
| 74 | Connect everything, press the button, save the world, and we're done. | 74 | Connect everything, press the button, save the world, and we're done. |
| 75 | </p> | 75 | </p> |
| 76 | </div> | 76 | </div> |
| 77 | </div> | 77 | </div> |
| 78 | </div> | 78 | </div> |
| 79 | 79 | ||
| 80 | <div class="ribbon l-box-lrg pure-g"> | 80 | <div class="ribbon l-box-lrg pure-g"> |
| 81 | <a id="help" class="anchor"></a> | 81 | <a id="help" class="anchor"></a> |
| 82 | <div class="is-center pure-u-1 pure-u-med-1-2 pure-u-lrg-2-5 l-box" style="margin: auto;"> | 82 | <div class="is-center pure-u-1 pure-u-med-1-2 pure-u-lrg-2-5 l-box" style="margin: auto;"> |
| 83 | <h2 class="content-head content-head-ribbon">I'm lost!</h2> | 83 | <h2 class="content-head content-head-ribbon">I'm lost!</h2> |
| 84 | <p style="font-family: monospace;"> | 84 | <p style="font-family: monospace;"> |
| 85 | Don't <span style="color: #dd514c;">panic()</span>; | 85 | Don't <span style="color: #dd514c;">panic()</span>; |
| 86 | <br> | 86 | <br> |
| 87 | <span style="color: rgb(128, 88, 165);">Throw</span> an <span style="color: #0e90d2;">Exception</span> and <span style="color: #5eb95e">try</span> the | 87 | <span style="color: rgb(128, 88, 165);">Throw</span> an <span style="color: #0e90d2;">Exception</span> and <span style="color: #5eb95e">try</span> the |
| 88 | </p> | 88 | </p> |
| 89 | <p> | 89 | <p> |
| 90 | <a href="#map" class="pure-button">Game map</a> | 90 | <a href="#map" class="pure-button">Game map</a> |
| 91 | </p> | 91 | </p> |
| 92 | <br> | 92 | <br> |
| 93 | </div> | 93 | </div> |
| 94 | <div class="pure-u-1 pure-u-med-1-2 pure-u-lrg-3-5 l-box"> | 94 | <div class="pure-u-1 pure-u-med-1-2 pure-u-lrg-3-5 l-box"> |
| 95 | <h2 class="content-head content-head-ribbon">Need some help pushing buttons?</h2> | 95 | <h2 class="content-head content-head-ribbon">Need some help pushing buttons?</h2> |
| 96 | <h4 class="content-head content-head-ribbon">Moving around</h4> | 96 | <h4 class="content-head content-head-ribbon">Moving around</h4> |
| 97 | <p> | 97 | <p> |
| 98 | Use <kbd>⇦</kbd> and <kbd>⇨</kbd> arrows to change your direction, <kbd>⇧</kbd> to move forward, and <kbd>⇩</kbd> to pick up an object or to speak to a character. | 98 | Use <kbd>⇦</kbd> and <kbd>⇨</kbd> arrows to change your direction, <kbd>⇧</kbd> to move forward, and <kbd>⇩</kbd> to pick up an object or to speak to a character. |
| 99 | </p> | 99 | </p> |
| 100 | <h4 class="content-head content-head-ribbon">Using items</h4> | 100 | <h4 class="content-head content-head-ribbon">Using items</h4> |
| 101 | <p> | 101 | <p> |
| 102 | Use <kbd>1</kbd>, <kbd>2</kbd>, <kbd>3</kbd>, ... to drop or use items from your inventory. | 102 | Use <kbd>1</kbd>, <kbd>2</kbd>, <kbd>3</kbd>, ... to drop or use items from your inventory. |
| 103 | </p> | 103 | </p> |
| 104 | <br> | 104 | <br> |
| 105 | </div> | 105 | </div> |
| 106 | </div> | 106 | </div> |
| 107 | 107 | ||
| 108 | <div class="content"> | 108 | <div class="content"> |
| 109 | <a id="about" class="anchor"></a> | 109 | <a id="about" class="anchor"></a> |
| 110 | <h2 class="content-head is-center">About that game</h2> | 110 | <h2 class="content-head is-center">About that game</h2> |
| 111 | <div class="pure-g"> | 111 | <div class="pure-g"> |
| 112 | <div class="l-box-lrg pure-u-1 pure-u-med-3-5"> | 112 | <div class="l-box-lrg pure-u-1 pure-u-med-3-5"> |
| 113 | <h4>The project</h4> | 113 | <h4>The project</h4> |
| 114 | <p> | 114 | <p> |
| 115 | The development of this game was conducted in part of the project-based learning unit IGI-1002, at ESIEE Paris, in which students are asked to write a simple adventure game in Java. | 115 | The development of this game was conducted in part of the project-based learning unit IGI-1002, at ESIEE Paris, in which students are asked to write a simple adventure game in Java. |
| 116 | </p> | 116 | </p> |
| 117 | <br> | 117 | <br> |
| 118 | <h4>The team</h4> | 118 | <h4>The team</h4> |
| 119 | <p> | 119 | <p> |
| 120 | This game was fully developped by Pacien TRAN-GIRARD and Benoît LUBRANO DI SBARAGLIONE, two first year ESIEE students ('18). | 120 | This game was fully developped by Pacien TRAN-GIRARD and Benoît LUBRANO DI SBARAGLIONE, two first year ESIEE students ('18). |
| 121 | </p> | 121 | </p> |
| 122 | </div> | 122 | </div> |
| 123 | <div class="l-box-lrg pure-u-1 pure-u-med-2-5"> | 123 | <div class="l-box-lrg pure-u-1 pure-u-med-2-5"> |
| 124 | <div class="pure-menu pure-menu-open"> | 124 | <div class="pure-menu pure-menu-open"> |
| 125 | <a class="pure-menu-heading">Additional resources</a> | 125 | <a class="pure-menu-heading">Additional resources</a> |
| 126 | <ul> | 126 | <ul> |
| 127 | <li> | 127 | <li> |
| 128 | <a href="/report/a3p-3f-esieequest.pdf"><i class="fa fa-book"></i> Project report</a> | 128 | <a href="/report/a3p-3f-esieequest.pdf"><i class="fa fa-book"></i> Project report</a> |
| 129 | </li> | 129 | </li> |
| 130 | <li> | 130 | <li> |
| 131 | |||