CINXE.COM
Extra Great - AI Gaming - Make A Scene - Home
<!DOCTYPE html> <html lang="en"> <head> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-JYCW9T18WZ"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-JYCW9T18WZ'); </script> <!-- Meta tag --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Favicon & Title --> <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon.png" /> <title>Extra Great - AI Gaming - Make A Scene - Home</title> <!-- JQUERY / BOOTSTRAP --> <script src="/lib/jquery-3.6.1.min.js"></script> <script src="/web/js/bootstrap.min.js"></script> <!-- CSS only --> <link rel="stylesheet" type="text/css" href="/web/css/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="/web/css/style.css" /> <link rel="stylesheet" type="text/css" href="/web/css/responsive.css" /> <!-- FOR PANELS --> <link rel="stylesheet" href="/css/play/play_panels.css"> <link rel="preconnect" href="https://fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet"> <style> /* these dont load soon enough if placed anywhere else */ .hidden{ display: none !important; } .logo_size{ width: 200px !important; height: 54px !important; } .gem-icon{ width: 100px !important; } .centered-row{ display: flex; justify-content: center; align-items: center; } .logo_in_circle { -ms-flex-negative: 0; flex-shrink: 0; width: 50px; height: 50px; margin: 5px 16px 0 0; border-radius: 50%; background: #E6E8EC; overflow: hidden; } .logo_in_circle img { width: 100%; height: 100%; } .home_button{ float: right; } .signup_button{ margin-right: 10px !important; } </style> <script> window.ExtraGreat_FirebaseConfig = {"apiKey":"AIzaSyDKjJJljdvLnx_RBduuSHvnD-7KFvbjijs","authDomain":"extraapp-5c945.firebaseapp.com","databaseURL":"https://extraapp-5c945-default-rtdb.firebaseio.com","projectId":"extraapp-5c945","storageBucket":"extraapp-5c945.appspot.com","messagingSenderId":"1065261389288","appId":"1:1065261389288:web:59d97371767318e746405d","measurementId":"G-NVEG1CNEKF"}; </script> </head> <body> <!-- Modal --> <div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div id="modal-body" class="modal-body"> ... </div> </div> </div> </div> <div class="main-wrpper"> <!-- Header --> <header> <div class="container"> <nav class="navbar navbar-light"> <a id="nav-bar-logo" class="navbar-brand" href="/"><img class="logo_size" src="/web/added/eg.logo.v3.svg.png" alt="Logo" /></a> <span class="btn-trial btnget full-size-nav"> <a id="nav_login_button" href="#" class="btn-trial btnget home_button modal_open hidden">Login</a> <a id="nav_logout_button" href="#" class="btn-trial btnget home_button logout hidden">Logout</a> <a id="nav_signup_button" href="#" class="btn-trial btnget home_button signup_button modal_open hidden">Signup</a> <a id="nav_player_details_button" href="#" class="btn-trial btnget home_button signup_button hidden">Your Account</a> </span> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#NavbarToggle" aria-controls="NavbarToggle" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse navbar_wrap" id="NavbarToggle"> <div class="nav-row"> <ul class="navbar-nav"> <li><a id="nav_login_button_mobile" href="#" class="modal_open nav-link modal_open hidden">Login</a></li> <li><a id="nav_logout_button_mobile" href="#" class="modal_open nav-link hidden">Logout</a></li> <li><a id="nav_signup_button_mobile" href="#" class="modal_open nav-link modal_open hidden">Signup</a></li> <li><a id="nav_player_details_button_mobile" href="#" class="modal_open nav-link hidden">Your Account</a></li> <li><a href="/gallery" class="nav-link" href="#">Gallery</a></li> <li><a href="https://extragreat.blog" class="nav-link" href="#">Blog</a></li> <li><a href="/about" class="nav-link" href="#">About</a></li> <li><a href="/" class="nav-link" href="#">Home</a></li> </ul> </div> </div> </nav> </div> </header> <!-- End Header --> <link rel="stylesheet" type="text/css" href="/web/css/make_game.css" /> <!-- Banner --> <section class="banner-wrapper"> <div class="container"> <!-- STEP START--> <div id="step_start" class="row"> <div class="col-md-6 col-sm-12"> <div class="banner-data"> <h6>Ready, set, go!</h6> <h1>Make a Scene</h1> <p id="get_started_copy1"> Craft your 3D scene, then invite friends to experience it. </p> <div class="btn-group"> <a id="btn_grp_send_back" href="/gallery" class="btn-main btn-main-secondary hidden">Gallery</a> <a id="btn_start_create_game" href="javascript:void(0)" class="btn-main">Make</a> </div> </div> </div> <div class="col-md-6 col-sm-12"> <div class="train-img"> <img src="/assets/home/home_scene.jpg" alt="Get started graphic"> </div> </div> </div> <!-- END STEP START--> <!-- STEP NAME--> <div id="step_name" class="row char_build hidden"> <div class="col-md-6 col-sm-12"> <div class="banner-data"> <a id="anchor_step_name"> </a> <h6>FIRST THINGS FIRST</h6> <h1>Scene Name</h1> <p>Let's pick a catchy name for your scene. Some ideas at right.</p> <input type="text" id="input_game_name" placeholder="Eg: Sunken Ship Graveyard" value="" class="create_prompt_concept form-control general-form home_input"></input> <div id="btn_grp_name" class="btn-group"> <a id="btn_grp_name_back" href="javascript:void(0)" class="btn-main btn-main-secondary back-button">Back</a> <a id="btn_grp_name_next" href="javascript:void(0)" class="btn-main">Next</a> </div> </div> </div> <div class="col-md-6 col-sm-12"> <div class="banner-img npc_container"> <div id="rightside_get_started_ideas" class="ideaswrpbx"> <div class="book-class-block"> <h6> </h6> <ul> <li data-id="Yeti Camp" class="game-idea" data-gameid="test"> <div class="book-ic"> <img class='feature-icons' src="/assets/home/home_icons_snow.png" alt=""> </div> <div class="class-dt"> <h3>Yeti Camp</h3> <p>A snowcamp high in the Himalayas where Yeti gather to talk about humans.</p> </div> </li> <li class="game-idea"> <div class="book-ic"> <img class='feature-icons' src="/assets/home/home_icons_burger.png" alt=""> </div> <div class="class-dt"> <h3>Burger Date</h3> <p>Two friends meet up at the burger joint... What happens next?</p> </div> </li> <li class="game-idea"> <div class="book-ic"> <img class='feature-icons' src="/assets/home/home_icons_souls.png" alt=""> </div> <div class="class-dt"> <h3>Ravine of Souls</h3> <p>The scariest place on earth. You do not want to go here.</p> </div> </li> </ul> </div> </div> </div> </div> </div> <!-- END STEP NAME--> <!-- STEP BOARD--> <div id="step_board" class="row char_build hidden"> <div class="col-md-6 col-sm-12"> <div class="banner-data"> <a id="anchor_step_board"> </a> <h6>ENVIRONMENT</h6> <h1>Foundation</h1> <p>Okay! Let's pick a foundation for your scene. You can start from scratch or pick a starter-scene.</p> </p> <!--Selection--> <p class="dotted">Selected: <span id="selected_game_board">None</span></p> <!--search pick buttons--> <div id="btn_grp_character" class="btn-group"> <a id="btn_grp_gameboard_back" href="javascript:void(0)" class="hidden btn-main btn-main-secondary back-button">Back</a> <a id="btn_grp_gameboard_pick" href="javascript:void(0)" class="btn-main hidden">Pick <span id="" class="btn_spinner generic_loading spinner-grow spinner-grow-sm hidden" role="status" aria-hidden="true"></span></a> </div> </div> </div> <div class="col-md-6 col-sm-12"> <div class="banner-img npc_container"> <!--see CHAR_SHOTS.psd--> <div id="gameboard_options_container" class="model-viewer-big"> <div id="simple_board" class="board_options"> <img style="width:80px; " src="/web/home/cube.png">from scratch</div> <div id="starter_board" class="board_options"><img style="width:100px" src="/web/home/starter.png">from starter</div> </div> <div id="gameboard_display_container" class="model-viewer-big hidden"> <div id="name_intro_banner" class="name_intro feature_font center_text hidden"> </div> <!--search options--> <div id="board_search_options" class="btn-group hidden"> <input type="text" id="input_board_search_prompt" placeholder="Eg: Graveyard" value="" class="create_prompt_concept form-control general-form home_input char_find_form"></input> <a id="find_board" href="javascript:void(0)" class="btn-main btn-main-secondary"><span id="" class="btn_spinner generic_loading spinner-grow spinner-grow-sm hidden" role="status" aria-hidden="true"></span>Find</a> </div> <div class="gameboard_filters" style="clear:both"> <div data-filter-type='sci fi' class="filter_tag tag_losenge">sci fi</div> <div data-filter-type='desert' class="filter_tag tag_losenge">desert</div> <div data-filter-type='winter' class="filter_tag tag_losenge">winter</div> <div data-filter-type='castle' class="filter_tag tag_losenge">castle</div> <div data-filter-type='landmarks' class="filter_tag tag_losenge">landmarks</div> <div data-filter-type='water' class="filter_tag tag_losenge">water</div> <div data-filter-type='farm' class="filter_tag tag_losenge">farm</div> <div data-filter-type='military' class="filter_tag tag_losenge">military</div> <div data-filter-type='haunted' class="filter_tag tag_losenge">haunted</div> <div data-filter-type='temples' class="filter_tag tag_losenge">temples</div> <div data-filter-type='jungle' class="filter_tag tag_losenge">jungle</div> <div data-filter-type='japan' class="filter_tag tag_losenge">japan</div> <div data-filter-type='fantasy' class="filter_tag tag_losenge">fantasy</div> <div data-filter-type='old west' class="filter_tag tag_losenge">old west</div> <div data-filter-type='suburbs' class="filter_tag tag_losenge">suburbs</div> <div data-filter-type='market' class="filter_tag tag_losenge">market</div> <div data-filter-type='river' class="filter_tag tag_losenge">river</div> <div data-filter-type='church' class="filter_tag tag_losenge">church</div> <div data-filter-type='village' class="filter_tag tag_losenge">village</div> <div data-filter-type='rocky' class="filter_tag tag_losenge">rocky</div> <div data-filter-type='underwater' class="filter_tag tag_losenge">underwater</div> <div data-filter-type='bedrooms' class="filter_tag tag_losenge">bedrooms</div> <div data-filter-type='kitchens' class="filter_tag tag_losenge">kitchens</div> <div data-filter-type='living rooms' class="filter_tag tag_losenge">living rooms</div> <div data-filter-type='bathrooms' class="filter_tag tag_losenge">bathrooms</div> <div data-filter-type='empty' class="filter_tag tag_losenge">empty</div> <div id="board_search" data-filter-type='search' class="filter_tag tag_losenge">search</div> </div> <div id="gameboard_viewer" class="" style="clear:both"> <div id="gameboard_display_preview" class="hidden"></div> <div id="gameboard_grid" class="grid-container-icons-char"> <!--insert game board results here--> <div id="board_loader"> <span id="board_loader_icon" class="btn_spinner generic_loading spinner-grow spinner-grow-sm" role="status" aria-hidden="true"></span> </div> </div> </div> </div> </div> </div> </div> <!-- END STEP GAME BOARD--> <!-- STEP LOGIN--> <div id="step_login" class="row char_build hidden"> <div class="col-md-6 col-sm-12"> <div class="banner-data"> <a id="anchor_step_sent"> </a> <h6>LET'S</h6> <h1>Login</h1> <p id="sent_need_to_login">Before continuing, let's get you signed up or logged in so that we can save your work.</p> <div id="btn_grp_login" class="btn-group"> <a id="modal_login" href="#" class="btn-main btn-main-secondary modal_open singuplogin_buttons">Login</a> <a id="modal_signup" href="#" class="btn-main modal_open singuplogin_buttons">Signup</a> </div> </div> </div> </div> <!-- STEP LAUNCH--> <div id="step_launch" class="row char_build hidden"> <div class="col-md-6 col-sm-12"> <div class="banner-data"> <a id="anchor_step_games"> </a> <h6>GO GO GO</h6> <h1>Launch</h1> <p> Click "Launch" to drop into 3D where you can build out your scene and then invite friends to experience it. </p> <div id="btn_grp_games" class="btn-group"> <a id="btn_grp_games_back" href="javascript:void(0)" class="btn-main btn-main-secondary back-button">Back</a> <a id="btn_grp_games_launch" href="javascript:void(0)" class="btn-main"><span id="" class="btn_spinner generic_loading spinner-grow spinner-grow-sm hidden" role="status" aria-hidden="true"></span>Launch</a> </div> </div> </div> <div class="col-md-6 col-sm-12"> <div class="banner-img npc_container"> <div class="train-img"> <img src="/web/added/01.png" alt="Launching graphic"> </div> </div> </div> </div> <!-- END STEP LAUNCH--> </section> <!-- End Banner --> <!-- Footer --> <footer> <div class="container"> <div class="footer-top"> <div class="footer-box"> <div class="row"> <div class="col-lg-6 col-md-12 col-sm-12"> <div class="foot-logo"> <img src="/web/added/eg.logo.v3.svg.png" alt="" class="desktop-img footer_logo_small"> <img src="/web/added/eg.logo.v3.svg.png" alt="" class="mobile-img footer_logo_small"> </div> </div> <div class="col-lg-6 col-md-12 col-sm-12"> <div class="quick-links"> <ul> <li><a href="https://extragreat.blog">Blog</a></li> <li><a href="/about">About</a></li> <li><a href="/">Home</a></li> </ul> </div> </div> </div> </div> <div class="footer-box"> <div class="foot-cnt"> <h4>contact</h4> <p>Made in San Francisco <br> info@extragreat.ai<br> USA</p> </div> </div> <div class="footer-box"> <div class="news-letterbx"> <h4>newsletter</h4> <p>Subscribe our newsletter to get<br> updates and special<br> stuff.</p> <div class="news-from"> <form id="mailinglist_form_footer" action="#"> <input id="mailing_list_email_footer" type="text" placeholder="Enter your email" class="form-control"> <button id="join_mailing_list_footer" type="submit"><img style="margin-left: 5px; width: 20px" src="/web/added/send.white.png"></button> </form> </div> </div> </div> </div> </div> </footer> <div class="copyright"> <div class="container"> <div class="row"> <div class="col-lg-7 col-md-12 col-sm-12"> <p>Copyright 漏 2023. Extra Great Gaming. All rights reserved</p> </div> <div class="col-lg-5 col-md-12 col-sm-12"> <div class="foot-social"> <a href="https://discord.gg/TrhjVVXvJj" target="_blank"><img src="/web/images/discord.svg" alt=""></a> <a href="https://twitter.com/extragreatai" target="_blank"><img src="/web/images/social-ic2.svg" alt=""></a> </div> </div> </div> </div> </div> <!-- End Footer --> </div> <!-- This is the entry point for the index pages, inclding home, join, login, signup --> <script type="module" src="/js/bundled/entry_home.js"></script> <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script> <script type="module" src="https://ajax.googleapis.com/ajax/libs/model-viewer/3.0.1/model-viewer.min.js"></script> </body> </html>