PageSourceSearch

https://newart.city/join

html newart.city collected 2026-10-01 12:31:44 UTC 42,438 bytes, 1,175 lines download raw bytes

1<!DOCTYPE html>
2<html>
3<head>
4  <meta charset="utf-8">
5  <title>Join New Art City</title>
6
7  <link rel="stylesheet" href="/styles/main.nac.css">
8  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
9
10  <!-- opengraph metadata -->
11  <meta property="og:title" content="Join New Art City">
12  <meta property="og:description" content="Virtual Art Space">
13  <meta property="og:image" content="https://newart.city/img/top-show/nac-festival-grounds.jpg">
14  
15  <meta name="twitter:card" content="summary_large_image">
16  <meta property="og:site_name" content="New Art City">
17  <!-- end opengraph metadata -->
18
19  <!-- favicon metadata -->
20  <link rel="apple-touch-icon" sizes="180x180" href="/img/favicon/apple-touch-icon.png">
21  <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon/favicon-32x32.png">
22  <link rel="icon" type="image/png" sizes="16x16" href="/img/favicon/favicon-16x16.png">
23  <link rel="manifest" href="/img/favicon/site.webmanifest">
24  <link rel="mask-icon" href="/img/favicon/safari-pinned-tab.svg" color="#5bbad5">
25  <link rel="shortcut icon" href="/img/favicon/favicon.ico">
26  <meta name="msapplication-TileColor" content="#00aba9">
27  <meta name="msapplication-config" content="/img/favicon/browserconfig.xml">
28  <meta name="theme-color" content="#ffffff">
29  <!-- end favicon metadata -->
30
31  <link rel="stylesheet" href="https://use.typekit.net/nvo2aai.css">
32
33  
33<script src='https://code.jquery.com/jquery-3.6.3.min.js'></script>
33
34  
34<script src='/js/vendor/micromodal/micromodal.min.js'></script>
34
35  <!-- Cloudflare Turnstile, the bot check on the signup form -->
36  <!--
37  Loads the Cloudflare Turnstile widget script.
38
39  Include this partial on any page that renders a `cf-turnstile` div. The guard
40  makes a second include harmless, because two contact forms or a contact form
41  and the signup form can appear on one page.
42
43  The script is async, thus it finds and renders every widget on the page after
44  it loads. The order of the script and the widget does not matter.
45-->
46<script>
47  if (!document.querySelector('script[data-turnstile-api]')) {
48    var turnstileApiScript = document.createElement('script')
49    turnstileApiScript.src = 'https://challenges.cloudflare.com/turnstile/v0/api.js'
50    turnstileApiScript.async = true
51    turnstileApiScript.defer = true
52    turnstileApiScript.setAttribute('data-turnstile-api', '')
53    document.head.appendChild(turnstileApiScript)
54  }
55</script>
55
56
57
58  
59
60</head>
61<body class='page-join public-shared'>
62
63  <div class="public-header-2023">
64  <div class="header-content">
65
66    <a class="logo-container" aria-label="New Art City logo" href="/"> <!-- http-urls-on-this-line-allowed-in-world-export-test -->
67  <div class="double">
68    <span class='logo-text'>New<br>Art<br>City</span>
69    <div class="logo"></div>
70  </div>
71  <span class="subtitle">Virtual Art Space</span>
72</a>
73
74
75
76
77
78  
78<script src="https://ga.jspm.io/npm:[email protected]/dist/es-module-shims.js"></script>
78
79
80  
80<script type="importmap">
81    {
82      "imports": {
83        "three": "https://cdn.jsdelivr.net/npm/[email protected]/build/three.module.js",
84        "three/addons/": "https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/"
85      }
86    }
87  </script>
87
88
89
90
91<script type="text/javascript">
92
93  window.dynamicImport = async (path) => {
94    // This import doesn't require an import map, so we can use the normal import
95    if (path.startsWith('.') || path.startsWith('/')) {
96      return import(path)
97    }
98    
99    // importShim will automatically pass-through to the native dynamic import or polyfill as necessary
100    // https ://www.npmjs.com/package/es-module-shims
101    return importShim(path)
102
103  }
104</script>
104
105
106
107<script type="module">
108  // setup
109    var camera    = null
110    var cameraFar = 150
111    var scene     = null
112    var renderer  = null
113    var cube      = null
114    var small     = false
115    
116    // Find the element that will host the canvas.
117    var canvasCtn = document.querySelector('.logo')
118    
119    // render small logo when inside dash-nav
120    if( canvasCtn.closest('.dash-nav') !== null ){
121      small = true
122      document.querySelector('.logo-container').classList.add('logo-small')
123    }
124
125    await initLogo()
126    animateLogo()
127
128
129    async function initLogo() {
130
131      // Ensure three is imported
132      const THREE = await dynamicImport(`three`)
133
134      // init scene
135
136      var width  = 80
137      var height = 80
138      
139      if( small ) width = height = 55
140
141      // Add canvas to the document element.
142      renderer = new THREE.WebGLRenderer({ 
143        alpha: true, 
144        antialias: false,
145      })
146      renderer.setSize(width, height )
147      renderer.setClearColor(0xededed, 0)
148
149      renderer.autoClear = false
150
151      canvasCtn.appendChild(renderer.domElement)
152
153      camera = new THREE.PerspectiveCamera( 75, width/height, 1, cameraFar );
154      camera.position.y = 0;
155      camera.position.x = 0;
156      camera.position.z = 0;
157
158      scene = new THREE.Scene();  
159
160      var geometry = new THREE.BoxGeometry(4,4,4)      
161      var material = new THREE.MeshNormalMaterial({wireframe:true})
162
163      cube = new THREE.Mesh( geometry, material );
164      cube.position.z = 7
165
166      scene.add(camera)
167      scene.add(cube)
168
169      camera.lookAt(cube.position)
170
171    }
172
173    function animateLogo(){
174
175      requestAnimationFrame( animateLogo )
176
177      cube.rotation.y += 0.002
178      cube.rotation.x -= 0.002
179      cube.rotation.z -= 0.002
180
181      renderer.render( scene, camera )
182
183    }
184</script>
184
185    
186    <div class="menu-ctn">
187      <button class='menu-btn'>
188        <img src="/img/icons/menu.png">
189      </button>
190      <div class="menu-dropdown">
191        <a href="/">Home / Gallery</a>
192        <a href="/join">Join</a>
193        <a href="https://info.newart.city/about">About</a>
194        <a href="#" class='open-contact-modal'>Contact</a>
195        <a href="https://info.newart.city/">Features &amp; Documentation</a>
196        <a href="/blog">Blog</a>
197        <a href="/support">Support New Art City</a>
198        
199          <a href='/login'>Log In &rarr;</a>
200        
201        <div class="social-links">
202          <a href="https://www.instagram.com/newart.city/" target="_blank">
203            <img src="/img/icons/instagram.svg" class='icon' alt='Instagram icon'>
204          </a>
205          <a href="https://twitter.com/new_art_city" target="_blank">
206            <img src="/img/icons/twitter.svg" class='icon' alt='Twitter icon'>
207          </a>
208          <a href="https://www.youtube.com/channel/UCe11QowUMjLtO8h2db1tX5g" target="_blank">
209            <img src="/img/icons/youtube.svg" class='icon' alt='Youtube icon'>
210          </a>
211          <a href="https://www.are.na/new-art-city" target="_blank">
212            <img src="/img/icons/arena.svg" class='icon' alt='Arena icon'>
213          </a>
214        </div>
215      </div>        
216    </div>
217  </div>
218</div>
219
220<!-- Modal: Contact -->
221<div class="modal micromodal-slide" id="modal-contact" aria-hidden="true">
222  <div class="modal__overlay" tabindex="-1">
223    <div class="modal__container">
224      <div class="close-modal" data-micromodal-close>&times;</div>
225
226      <h2>Contact</h2>
227
228      <form class='contact-form'>
229
230        <label for='contact-message'>
231          <span class='form-label'>Message</span>
232          <span class="helper-text">What's on your mind?</span>
233          <textarea name='contact-message' id='contact-message'></textarea>
234        </label>
235
236        <label for='contact-email'>
237          <span class='form-label'>Email Address</span>
238          <span class="helper-text">So we can reply to you.</span>
239          <input type="email" name="contact-email" id='contact-email'>
240        </label>
241
242        <div id="contact-turnstile" class="cf-turnstile" data-sitekey="0x4AAAAAAErMkbqOubmlELot" data-theme="light" data-size="flexible" data-response-field-name="turnstileToken"></div>
243
244        <input type="hidden" name="message-type" value="New Art City contact message">
245        <input type="hidden" name="contact-form" value="public-header-2023">
246        <input type="submit" name="submit-contact" value="Send Message">
247
248      </form>
249
250
251    </div>
252  </div>
253</div>
254
255<!-- Modal: Confirmation -->
256<div class="modal micromodal-slide" id="modal-confirmation" aria-hidden="true">
257  <div class="modal__overlay" tabindex="-1">
258    <div class="modal__container">
259      <div class="close-modal" data-micromodal-close>&times;</div>
260      <h2 class='confirmation-headline'>Thanks!</h2>
261      <p class='confirmation-message'>We will get back to you as soon as possible.</p>
262    </div>
263  </div>
264</div>
265
266<script>
267
268  // jquery and micromodal must be included at the top of any page this appears on.
269
270  // menu button
271  $('.menu-btn').click((e) => {
272    $('.menu-ctn').toggleClass('active')
273  })
274
275  // close menu when anything else is clickec
276  $('body').click((e) => {
277    if( $(e.target).closest('.menu-ctn').length == 0 ){
278      $('.menu-ctn').removeClass('active')
279    }
280  })
281
282  // open contact modal
283  $('body').on('click', '.open-contact-modal, [href="#contact"]', function(e) {
284    e.preventDefault()
285    $('.close-modal').click() // close any already open modal
286    MicroModal.show('modal-contact')
287  })
288
289  // submit contact 
290  $('.contact-form').submit(async function(e) {
291    
292    e.preventDefault()
293    $('body').addClass('loading')
294
295    let contactResponse = await fetch('/api/messages/submit-contact', {
296      method: 'POST',
297      headers: { 'Content-type': 'application/json' },
298      body: JSON.stringify({
299        'contact-email': $('#contact-email').val(),
300        'contact-message': $('#contact-message').val(),
301        'turnstileToken': $('.contact-form [name=turnstileToken]').val(),
302        'contact-form': $('.contact-form [name=contact-form]').val()
303      })
304    })
305
306    $('body').removeClass('loading')
307
308    // handle error
309    if (!contactResponse.ok) {
310      // A token is single-use. Reset the widget so the visitor can try again.
311      if (window.turnstile) window.turnstile.reset('#contact-turnstile')
312      alert(await contactResponse.text())
313      return
314    }
315
316    // success
317    document.querySelector('.contact-form').reset()
318    if (window.turnstile) window.turnstile.reset('#contact-turnstile')
319    $('.close-modal').click()
320    document.querySelector('.confirmation-headline').innerHTML = "Thanks!"
321    document.querySelector('.confirmation-message').innerHTML = "We will get back to you as soon as possible."
322    MicroModal.show('modal-confirmation')
323  })
324  
325</script>
325
326
327<!--
328  Loads the Cloudflare Turnstile widget script.
329
330  Include this partial on any page that renders a `cf-turnstile` div. The guard
331  makes a second include harmless, because two contact forms or a contact form
332  and the signup form can appear on one page.
333
334  The script is async, thus it finds and renders every widget on the page after
335  it loads. The order of the script and the widget does not matter.
336-->
337<script>
338  if (!document.querySelector('script[data-turnstile-api]')) {
339    var turnstileApiScript = document.createElement('script')
340    turnstileApiScript.src = 'https://challenges.cloudflare.com/turnstile/v0/api.js'
341    turnstileApiScript.async = true
342    turnstileApiScript.defer = true
343    turnstileApiScript.setAttribute('data-turnstile-api', '')
344    document.head.appendChild(turnstileApiScript)
345  }
346</script>
346
347
348
349
350  <div class='ctn'>
351    <div class="hero">
352      <div class="hero-intro">
353        <h1>New Art City is a virtual exhibition toolkit for digital art.</h1>
354        <div class="intro-pitch">
355          <p>We are an online space for <b>artists</b>, <b>curators</b>, <b>educators</b> and <b>organizers</b> to install and publish digital art in custom 3D worlds for the web browser.</p>
356          <p>Built by a small independent team of artists and designers, New Art City's goal is to solve problems for digital artists and create an easy to use and broadly accessible space for digital art.</p>          
357        </div>
358        <div class="hero-ctas">
359          <button class='compact create-account-btn'>Create an Account</button>
360          <a href="#" class='open-video-modal'>Watch Video</a>
361        </div>
362      </div>
363      <div class="hero-slides right-side">
364        <div class="hero-slide active">
365          <img src="/img/promo-screenshots/alt-reality-parsons-school-of-design-the-new-school.jpeg">
366          <a class="slide-credit" href='https://newart.city/show/alt-reality' target="_blank">
367            <span class="show-title">
368              <span>(alt) reality</span>
369              <img src="/img/icons/outbound.png">
370            </span>
371            <span class="show-credit">Parsons School of Design, The New School</span>
372          </a>
373        </div>
374        <div class="hero-slide">
375          <img src="/img/promo-screenshots/brazil-the-future-henrique-fagundes.jpeg">
376          <a class="slide-credit" href='https://newart.city/show/brazilthefuture' target="_blank">
377            <span class="show-title">
378              <span>Brazil: the future</span>
379              <img src="/img/icons/outbound.png">
380            </span>
381            <span class="show-credit">Henrique Fagundes</span>
382          </a>
383        </div>
384        <div class="hero-slide">
385          <img src="/img/promo-screenshots/forest-of-things-manuel-tozzi.jpeg">
386          <a class="slide-credit" href='https://newart.city/show/forest-of-things' target="_blank">
387            <span class="show-title">
388              <span>Forest of Things</span>
389              <img src="/img/icons/outbound.png">
390            </span>
391            <span class="show-credit">Manuel Tozzi</span>
392          </a>
393        </div>
394      </div>
395    </div>    
396  </div>
397
398  <div class="product-selling-points">
399    <div class="ctn">
400      <div class="triple">
401
402        <div class="point">
403          <div class="point-top">
404            <div class="icon">
405              <img src="/img/icons/3d.png">
406            </div>
407            <h3>3D, multiplayer and customizable.</h3>
408          </div>
409          <span>Every space is designed and built by users, who include artists, curators, students and cultural organizers.</span>
410        </div>
411        <div class="point">
412          <div class="point-top">
413
414            <div class="icon">
415              <img src="/img/icons/media.png">
416            </div>
417            <h3>No coding experience required.</h3>
418          </div>
419          <span>Upload your media and arrange it with our drag and drop editor. </span>
420        </div>
421        <div class="point">
422          <div class="point-top">
423            <div class="icon">
424              <img src="/img/icons/people.png">
425            </div>
426            <h3>Built for collaboration.</h3>
427          </div>
428          <span>Install the work with friends in real time and keep everyone organized with advanced collaboration tools.</span>
429        </div>
430
431      </div>
432    </div>
433  </div>
434
435  <div class="ctn pricing-ctn">
436  <h3 class='pricing-headline'>Pricing</h3>
437  <div class="pricing-subtext">New Art City will never put advertising on your virtual space or sell your personal data. Instead, New Art City is supported by users and partner organizations. Help us grow a new future for creative websites.</div>
438
439  <div class="pricing-toggle">
440    <button class='pricing-toggle-btn' plan-group='individual' active='true'>Individual</button>
441    <button class='pricing-toggle-btn' plan-group='education' active='false'>Education</button>
442    <button class='pricing-toggle-btn' plan-group='commercial' active='false'>Commercial</button>
443  </div>
444
445  <div class="pricing-table plan-group-content" plan-group='individual' active='true'>
446
447    <div class="plan-card">
448      <h4 class="plan-title">Visitor</h4>
449      <div class="plan-cost">
450        <span>Free Trial</span>
451      </div>
452      <ul class="plan-perks">
453        
454          <li>One space inside a single world</li>
455        
456          <li>40mb total uploads</li>
457        
458          <li>5 collaborators</li>
459        
460      </ul>
461      <button class='select-plan-btn' plankey='free'>Create an Account</button>
462    </div>
463
464    <div class="plan-card">
465      <h4 class="plan-title">Supporter</h4>
466      <div class="plan-cost">
467        <span>$14<span class="cost-period">/Month</span></span>
468      </div>
469      <ul class="plan-perks">
470        
471          <li>Two personal worlds</li>
472        
473          <li>Unlimited virtual spaces inside those worlds</li>
474        
475          <li>100mb upload per space</li>
476        
477          <li>10 collaborators</li>
478        
479          <li>More object shapes</li>
480        
481          <li>Visitor Counter</li>
482        
483          <li>Livestreams</li>
484        
485          <li>Scheduled openings</li>
486        
487          <li>Password protected worlds</li>
488        
489          <li>Archive &amp; export your worlds</li>
490        
491      </ul>
492      <button class='select-plan-btn' plankey='basic'>Create an Account</button>
493    </div>
494  
495    <div class="plan-card">
496      <h4 class="plan-title">Sustaining Member</h4>
497      <div class="plan-cost">
498        <span>$28<span class="cost-period">/Month</span></span>
499      </div>
500      <ul class="plan-perks">
501        
502          <li>Five personal worlds</li>
503        
504          <li>Unlimited virtual spaces inside those worlds</li>
505        
506          <li>100mb upload per space</li>
507        
508          <li>50 collaborators</li>
509        
510          <li>More object shapes</li>
511        
512          <li>Visitor Counter</li>
513        
514          <li>Livestreams</li>
515        
516          <li>Scheduled openings</li>
517        
518          <li>Password protected worlds</li>
519        
520          <li>Archive &amp; export your worlds</li>
521        
522      </ul>
523      <button class='select-plan-btn' plankey='pro'>Create an Account</button>
524    </div>
525    
526  </div>
527
528  <div class='pricing-table plan-group-content' plan-group='education' active='false'>
529
530    <!-- <a class="plan-group-intro" href='#'>Learn more about our education features on our dedicated EDU page here.</a> -->
531
532    <div class="plan-card">
533      <h4 class="plan-title">Single Class</h4>
534      <div class="plan-cost">
535        <span>$500/Year</span>
536      </div>
537      <ul class="plan-perks">
538        <li>50 Seats</li>
539        <li>Unlimited virtual spaces per seat</li>
540        <li>Invite students via single link</li>
541        <li>Organization management tools</li>
542        <li>Archive & export your 3D worlds to a web directory ZIP file</li>
543      </ul>
544      <a href="mailto:[email protected]?subject=Education inquiry (Single Class Plan)" class='button'>Get in Touch</a>
545      <!-- <button class='select-plan-btn' plankey='edu-50-seat'>Create an Account</button> -->
546    </div>
547
548    <div class="plan-card">
549      <h4 class="plan-title">Department</h4>
550      <div class="plan-cost">
551        <span>$2,000/Year</span>
552      </div>
553      <ul class="plan-perks">
554        <li>250 Seats</li>
555        <li>Unlimited virtual spaces per seat</li>
556        <li>Invite students via single link</li>
557        <li>Organization management tools</li>
558        <li>Archive & export your 3D worlds to a web directory ZIP file</li>
559      </ul>
560      <a href="mailto:[email protected]?subject=Education inquiry (Department Plan)" class='button'>Get in Touch</a>
561      <!-- <button class='select-plan-btn' plankey='edu-250-seat'>Create an Account</button> -->
562    </div>
563
564    <div class="plan-card">
565      <h4 class="plan-title">School</h4>
566      <div class="plan-cost">
567        <span>$5,000/Year</span>
568      </div>
569      <ul class="plan-perks">
570        <li>1,000 Seats</li>
571        <li>Unlimited virtual spaces per seat</li>
572        <li>Invite students via single link</li>
573        <li>Organization management tools</li>
574        <li>Archive & export your 3D worlds to a web directory ZIP file</li>
575      </ul>
576      <a href="mailto:[email protected]?subject=Education inquiry (School Plan)" class='button'>Get in Touch</a>
577      <!-- <button class='select-plan-btn' plankey='edu-1000-seat'>Create an Account</button> -->
578    </div>
579
580  </div>
581  <div class='plan-group-content' plan-group='commercial' active='false'>
582    <div class="plan-card">
583      <h4 class="plan-title">Commercial Projects</h4>
584      <div class="plan-cost">
585        <span>Variable Pricing</span>
586      </div>
587      <p>New Art City can be used as a white-labeled virtual multiplayer space for your for-profit projects and client work. We also offer build-out and consulting services.</p>
588      <p>Let's discuss your work and how we can help.</p>
589      <a href="mailto:[email protected]?subject=Commercial inquiry" class='button'>Get in Touch</a>
590    </div>
591  </div>
592
593  <div class="pricing-subtext"><a href='/support'>Want to support our mission without creating an account?</a></div>
594
595</div>
596
597  <div class="ctn features-double-ctn">
598    <div class="join-double">
599      <div class="image-ctn promo-slides">
600      
601        <div class="promo-slide active">
602          <img src="/img/promo-screenshots/landscapes-khk-kassel.jpg">
603          <a href='https://newart.city/show/landscapes' target="_blank" class="slide-credit">
604            <span class="show-title">
605              <span>Landscapes</span>
606              <img src="/img/icons/outbound.png">
607            </span>
608            <span class="show-credit">KHK Kassel: Newmedia, Games & Animation</span>
609          </a>          
610        </div>
611
612        <div class="promo-slide">
613          <img src="/img/promo-screenshots/3-minutes-to-midnight-sophie-rogers-and-deformal.jpeg">
614          <a href='https://newart.city/show/sophie-rogers' target="_blank" class="slide-credit">
615            <span class="show-title">
616              <span>3 Minutes to Midnight</span>
617              <img src="/img/icons/outbound.png">
618            </span>
619            <span class="show-credit">Sophie Rogers &amp; De:Formal</span>
620          </a>          
621        </div>
622
623        <div class="promo-slide">
624          <img src="/img/promo-screenshots/reconsider-flesh-output-field.jpeg">
625          <a href='https://newart.city/show/reconsiderflesh' target="_blank" class="slide-credit">
626            <span class="show-title">
627              <span>Reconsider Flesh</span>
628              <img src="/img/icons/outbound.png">
629            </span>
630            <span class="show-credit">Output Field</span>
631          </a>          
632        </div>
633        
634
635      </div>
636      <div class="features-ctn">
637        <h2>Artist-Focused Gallery Features</h2>
638        <div class="features-table">
639          <div class="row full-width">
640            <img src="/img/icons/devices.png">
641            <span>Visitors can quickly access your work on desktop and mobile without signing up, logging in or downloading.</span>
642          </div>
643          <div class="row">
644            <img src="/img/icons/people.png">
645            <span>Upload art and install together with friends.</span>
646          </div>
647          <div class="row">
648            <img src="/img/icons/livestream.png">
649            <span>Livestream performances in 3D.</span>
650          </div>
651          <div class="row">
652            <img src="/img/icons/camera.png">
653            <span>Collect documentation with crowd-sourced screenshots.</span>
654          </div>
655          <div class="row">
656            <img src="/img/icons/group.png">
657            <span>Host up to 300 simultaneous visitors for large events.</span>
658          </div>
659          <div class="row">
660            <img src="/img/icons/heart-outline.png">
661            <span>Ask for donations before entering a space.</span>
662          </div>
663          <div class="row">
664            <img src="/img/icons/chat-dark.png">
665            <span>Collect notes or feedback in the guestbook.</span>
666          </div>
667        </div>
668      </div>
669    </div>
670  </div>
671
672  <div class="ctn">
673    <h3 class='section-headline'>Frequently Asked Questions</h3>
674    <div class="faq-ctn">
675      <div class="faq-item">
676        <span class='faq-question'>What happens to my artwork when I cancel my membership?</span>
677        <span class='faq-answer'>
678          <p>The only thing that changes when you cancel your membership is you lose edit access to your space. If your world has been published, it will remain accessible indefinitely from the normal URL. You will regain edit access if you sign back up.</p>
679        </span>
680      </div>
681
682      <div class="faq-item">
683        <span class='faq-question'>Are virtual exhibitions accessible to everyone?</span>
684        <span class='faq-answer'><p>Our no-code editor makes it easy for anybody to build a 3D website regardless of prior experience with 3D modeling or game design. Anybody can visit a New Art City exhibition after it is published using web browsers and mobile devices. Our catalog view is designed to be accessible for visitors who use screen readers.</p></span>
685      </div>
686
687      <div class="faq-item">
688        <span class='faq-question'>What is the difference between a space and a world in New Art City?</span>
689        <span class='faq-answer'><p>Worlds are containers for spaces. For exhibitions which require more than one 3D space, they are grouped within worlds. For example each artist in a group show could have a space in a world for the exhibition, or artworks could be grouped thematically in different spaces.</p></span>
690      </div>
691
692      <div class="faq-item">
693        <span class='faq-question'>Which exhibitions are posted to the homepage?</span>
694        <span class='faq-answer'><p>While all published exhibitions are available at their URLs, the shows on the New Art City homepage are subject to our curatorial discretion. Submit your space for review and promotion and we will promote work which meets our curation goals.</p></span>
695      </div>
696
697      <div class="faq-item">
698        <span class='faq-question'>Can I sell my art on New Art City?</span>
699        <span class='faq-answer'><p>We have no built-in tools for e-commerce or NFT sales, but each artwork object on New Art City has a hyperlink field which allows you to link to any external site where you are selling your work.</p></span>
700      </div>
701
702      <div class="faq-item">
703        <span class='faq-question'>What are the communication features?</span>
704        <span class='faq-answer'><p>When you sign up and create a handle, it becomes visible over your avatar and in the chat window of each space. Every space has a built in group chat, and a guestbook where visitors can leave comments and screenshots taken in the space.</p></span>
705      </div>
706
707      <div class="faq-item">
708        <span class='faq-question'>What does my membership contribution to new New Art City support?</span>
709        <span class='faq-answer'><p>Support from our users enables us to continue building the core functionality of the toolkit. We also reinvest contributions to develop our artist residency and accessibility program.</p></span>
710      </div>
711    </div>
712  </div>
713
714  <div class="footer">
715    <div class="ctn">
716      
717      <div class="social-links">
718        <a href="https://www.instagram.com/newart.city/" target="_blank">
719          <img src="/img/icons/instagram.svg" class='icon' alt='Instagram icon'>
720        </a>
721        <a href="https://twitter.com/new_art_city" target="_blank">
722          <img src="/img/icons/twitter.svg" class='icon' alt='Twitter icon'>
723        </a>
724        <a href="https://www.youtube.com/channel/UCe11QowUMjLtO8h2db1tX5g" target="_blank">
725          <img src="/img/icons/youtube.svg" class='icon' alt='Youtube icon'>
726        </a>
727        <a href="https://www.are.na/new-art-city" target="_blank">
728          <img src="/img/icons/arena.svg" class='icon' alt='Arena icon'>
729        </a>
730      </div>
731    </div>
732  </div>
733
734  <!-- Select Plan Modal -->
735  <!-- ( same HTML as pricing above ) -->
736  <div class="modal micromodal-slide" id="modal-select-plan" aria-hidden="true">
737    <div class="modal__overlay" tabindex="-1">
738      <div class="modal__container">
739        <div class="close-modal" data-micromodal-close >&times;</div>
740        <div class="ctn pricing-ctn">
741  <h3 class='pricing-headline'>Pricing</h3>
742  <div class="pricing-subtext">New Art City will never put advertising on your virtual space or sell your personal data. Instead, New Art City is supported by users and partner organizations. Help us grow a new future for creative websites.</div>
743
744  <div class="pricing-toggle">
745    <button class='pricing-toggle-btn' plan-group='individual' active='true'>Individual</button>
746    <button class='pricing-toggle-btn' plan-group='education' active='false'>Education</button>
747    <button class='pricing-toggle-btn' plan-group='commercial' active='false'>Commercial</button>
748  </div>
749
750  <div class="pricing-table plan-group-content" plan-group='individual' active='true'>
751
752    <div class="plan-card">
753      <h4 class="plan-title">Visitor</h4>
754      <div class="plan-cost">
755        <span>Free Trial</span>
756      </div>
757      <ul class="plan-perks">
758        
759          <li>One space inside a single world</li>
760        
761          <li>40mb total uploads</li>
762        
763          <li>5 collaborators</li>
764        
765      </ul>
766      <button class='select-plan-btn' plankey='free'>Create an Account</button>
767    </div>
768
769    <div class="plan-card">
770      <h4 class="plan-title">Supporter</h4>
771      <div class="plan-cost">
772        <span>$14<span class="cost-period">/Month</span></span>
773      </div>
774      <ul class="plan-perks">
775        
776          <li>Two personal worlds</li>
777        
778          <li>Unlimited virtual spaces inside those worlds</li>
779        
780          <li>100mb upload per space</li>
781        
782          <li>10 collaborators</li>
783        
784          <li>More object shapes</li>
785        
786          <li>Visitor Counter</li>
787        
788          <li>Livestreams</li>
789        
790          <li>Scheduled openings</li>
791        
792          <li>Password protected worlds</li>
793        
794          <li>Archive &amp; export your worlds</li>
795        
796      </ul>
797      <button class='select-plan-btn' plankey='basic'>Create an Account</button>
798    </div>
799  
800    <div class="plan-card">
801      <h4 class="plan-title">Sustaining Member</h4>
802      <div class="plan-cost">
803        <span>$28<span class="cost-period">/Month</span></span>
804      </div>
805      <ul class="plan-perks">
806        
807          <li>Five personal worlds</li>
808        
809          <li>Unlimited virtual spaces inside those worlds</li>
810        
811          <li>100mb upload per space</li>
812        
813          <li>50 collaborators</li>
814        
815          <li>More object shapes</li>
816        
817          <li>Visitor Counter</li>
818        
819          <li>Livestreams</li>
820        
821          <li>Scheduled openings</li>
822        
823          <li>Password protected worlds</li>
824        
825          <li>Archive &amp; export your worlds</li>
826        
827      </ul>
828      <button class='select-plan-btn' plankey='pro'>Create an Account</button>
829    </div>
830    
831  </div>
832
833  <div class='pricing-table plan-group-content' plan-group='education' active='false'>
834
835    <!-- <a class="plan-group-intro" href='#'>Learn more about our education features on our dedicated EDU page here.</a> -->
836
837    <div class="plan-card">
838      <h4 class="plan-title">Single Class</h4>
839      <div class="plan-cost">
840        <span>$500/Year</span>
841      </div>
842      <ul class="plan-perks">
843        <li>50 Seats</li>
844        <li>Unlimited virtual spaces per seat</li>
845        <li>Invite students via single link</li>
846        <li>Organization management tools</li>
847        <li>Archive & export your 3D worlds to a web directory ZIP file</li>
848      </ul>
849      <a href="mailto:[email protected]?subject=Education inquiry (Single Class Plan)" class='button'>Get in Touch</a>
850      <!-- <button class='select-plan-btn' plankey='edu-50-seat'>Create an Account</button> -->
851    </div>
852
853    <div class="plan-card">
854      <h4 class="plan-title">Department</h4>
855      <div class="plan-cost">
856        <span>$2,000/Year</span>
857      </div>
858      <ul class="plan-perks">
859        <li>250 Seats</li>
860        <li>Unlimited virtual spaces per seat</li>
861        <li>Invite students via single link</li>
862        <li>Organization management tools</li>
863        <li>Archive & export your 3D worlds to a web directory ZIP file</li>
864      </ul>
865      <a href="mailto:[email protected]?subject=Education inquiry (Department Plan)" class='button'>Get in Touch</a>
866      <!-- <button class='select-plan-btn' plankey='edu-250-seat'>Create an Account</button> -->
867    </div>
868
869    <div class="plan-card">
870      <h4 class="plan-title">School</h4>
871      <div class="plan-cost">
872        <span>$5,000/Year</span>
873      </div>
874      <ul class="plan-perks">
875        <li>1,000 Seats</li>
876        <li>Unlimited virtual spaces per seat</li>
877        <li>Invite students via single link</li>
878        <li>Organization management tools</li>
879        <li>Archive & export your 3D worlds to a web directory ZIP file</li>
880      </ul>
881      <a href="mailto:[email protected]?subject=Education inquiry (School Plan)" class='button'>Get in Touch</a>
882      <!-- <button class='select-plan-btn' plankey='edu-1000-seat'>Create an Account</button> -->
883    </div>
884
885  </div>
886  <div class='plan-group-content' plan-group='commercial' active='false'>
887    <div class="plan-card">
888      <h4 class="plan-title">Commercial Projects</h4>
889      <div class="plan-cost">
890        <span>Variable Pricing</span>
891      </div>
892      <p>New Art City can be used as a white-labeled virtual multiplayer space for your for-profit projects and client work. We also offer build-out and consulting services.</p>
893      <p>Let's discuss your work and how we can help.</p>
894      <a href="mailto:[email protected]?subject=Commercial inquiry" class='button'>Get in Touch</a>
895    </div>
896  </div>
897
898  <div class="pricing-subtext"><a href='/support'>Want to support our mission without creating an account?</a></div>
899
900</div>
901      </div>
902    </div>
903  </div>
904
905  <!-- Register Modal -->
906<div class="modal micromodal-slide" id="modal-register" aria-hidden="true">
907  <div class="modal__overlay" tabindex="-1">
908    <div class="modal__container">
909      <form class='join-step-1'>
910        
911        <h2 class='register-header'>Join New Art City</h2>
912        <div class="close-modal" data-micromodal-close >&times;</div>
913
914        <div class="register-layout">
915          <div class="register-left">
916            <label>
917              <div class="form-label-ctn">
918                <div class='form-label'>Your Name</div>
919                <div class="helper-text">This will be visible in your profile.</div>                  
920              </div>
921              <input
922                type="text"
923                name="name"
924                maxlength="30"
925                placeholder="Your Name">
926            </label>
927
928            <label for="username">
929              <div class="form-label-ctn">
930                <div class='form-label'>Username</div>
931                <div class="helper-text">This will appear in your profile URL.</div>
932              </div>
933              <input
934                id='username'
935                type="text"
936                name="username"
937                maxlength="16"
938                autocomplete="new-password"
939                placeholder="username">
940            </label>
941
942            <label for="email">
943              <div class='form-label'>Email Address</div>
944              <input
945                type="email"
946                id="email"
947                name="email"
948                autocomplete="new-password"
949                placeholder="Email">
950            </label>
951
952            <label for="password">
953              <div class='form-label'>Password</div>
954              <input
955                type="password"
956                id="password"
957                name="password"
958                placeholder="Password"
959                autocomplete="new-password"
960                minlength="6">
961            </label>
962
963          </div>
964          <div class="register-right">
965            
966            <h3>Basic Terms</h3>
967            
968            <div class="terms">
969              <ul>
970                <li>We will never sell your user data or your visitor data to any third parties.</li>
971                <li>You maintain your ownership of anything you upload.</li>
972                <li>We may promote your work and we may use your work to promote New Art City.</li>
973              </ul>
974
975              <div class="full-terms">
976                <a href="https://info.newart.city/terms-of-use" target='_blank'>Read the Full Terms of Use</a>
977              </div>
978
979              <label class="checkbox-row">
980                <input type="checkbox" class='terms-agreed'>
981                <div>I agree to the terms of use.</div>
982              </label>
983
984              <div class="cf-turnstile" data-sitekey="0x4AAAAAAErMkbqOubmlELot" data-theme="light" data-size="flexible"></div>
985
986            </div>
987
988            <br>
989
990            <input type="submit" value='Continue'>
991            
992          </div>
993        </div>          
994        <div class="form-error"></div>
995
996      </form>
997    </div>
998  </div>
999</div>
1000
1001  <!-- Modal: Video -->
1002  <div class="modal micromodal-slide" id="modal-video" aria-hidden="true">
1003    <div class="modal__overlay" tabindex="-1">
1004      <div class="modal__container">
1005        <div class="close-modal" data-micromodal-close >&times;</div>
1006        <iframe src="https://www.youtube-nocookie.com/embed/8PwwJctp1XY" frameborder="0" allowfullscreen class='nac-video'></iframe>
1007      </div>
1008    </div>
1009  </div>
1010
1011  
1011<script>
1012
1013    window.planKey = 'free'
1014
1015    // prevent a mousedown event on modal container then mouseup
1016    // on modal overlay from triggering modal close: 
1017    // 1. on overlay mouse down close modal
1018    $('body').on('mousedown', '.modal__overlay', function(e) {
1019      var modalId = $(this).parent().attr('id')
1020      MicroModal.close(modalId)
1021    })
1022    // 2. stop modal container from passing its click event to overlay
1023    $('body').on('mousedown', '.modal__container', function(e) {
1024      e.stopPropagation()
1025    })
1026
1027    // plan group switcher
1028    $('.pricing-toggle-btn').click(function(){
1029      $('[plan-group]').attr('active','false')
1030      let planGroup = $(this).attr('plan-group')
1031      $(`[plan-group=${planGroup}]`).attr('active','true')
1032    })
1033
1034    // Create account button (open select plan modal)
1035    $('.create-account-btn').click(function(e){
1036      e.preventDefault()
1037      $('.close-modal').click() // close any already open modal
1038      MicroModal.show('modal-select-plan')
1039    })
1040    
1041    // select plan buttons (open register modal)
1042    $('.select-plan-btn').click(function(e){
1043      e.preventDefault()
1044      window.planKey = $(this).attr('plankey')
1045      
1046      try{
1047        MicroModal.close('modal-select-plan')
1048      }catch(e){
1049        // do nothing
1050      }
1051
1052      MicroModal.show('modal-register')
1053    })
1054
1055    // autofill username
1056    $('form.join-step-1 input[name=name]').on('input',function(){
1057      let name = $(this).val()
1058      let username = name.replace(/[^a-zA-Z0-9]/g,'-').toLowerCase()
1059      $('form.join-step-1 input[name=username]').val(username)
1060    })
1061
1062    // auto slug username
1063    $('form.join-step-1 input[name=username]').on('change',function(){
1064      let username = $(this).val()
1065      let slug = username.replace(/[^a-zA-Z0-9]/g,'-').toLowerCase()
1066      $('form.join-step-1 input[name=username]').val(slug)
1067    })
1068
1069    // submit register 
1070    $('.join-step-1').submit(async function(e) {
1071
1072      e.preventDefault()
1073      $('.form-error').hide()
1074
1075      $('.terms-agreed').parent().removeClass('highlighted')
1076      if ($('.terms-agreed').prop('checked') == false) {
1077        $('.terms-agreed').parent().addClass('highlighted')
1078        return
1079      }
1080
1081      $('body').addClass('loading')
1082
1083      let newUserResponse = await fetch('/api/users/new-user', {
1084        method: 'POST',
1085        headers: { 'Content-type': 'application/json' },
1086        body: JSON.stringify({
1087          email: $('#email').val(),
1088          password: $('#password').val(),
1089          name: $('input[name=name]').val(),
1090          username: $('#username').val(),
1091          turnstileToken: $('form.join-step-1 [name=cf-turnstile-response]').val(),
1092        })
1093      })
1094
1095      // handle error
1096      if (!newUserResponse.ok) {
1097        $('body').removeClass('loading')
1098        $('.form-error').show().html(await newUserResponse.text())
1099        // A Turnstile token is single-use. Reset the widget so the user can retry.
1100        if (window.turnstile) window.turnstile.reset()
1101        return
1102      }
1103
1104      // skip a payment for free plan
1105      if (window.planKey == 'free') {
1106        // Signup Step 2 - Free Plan Chosen
1107        // window.fathom?.trackGoal('2Z3KUPHO', 0);
1108        window.location.href = '/dashboard/new-world?onboarding'
1109        return
1110      }
1111
1112      // Signup Step 2 - Paid Plan Chosen
1113      // window.fathom?.trackGoal('4IIFM6V9', 0);
1114
1115      // retrieve a checkout session
1116      // then redirect to checkout
1117      let checkoutResponse = await fetch('/api/payments/new-subscription-checkout-session', {
1118        method: 'POST',
1119        headers: { 'Content-type': 'application/json' },
1120        body: JSON.stringify({
1121          planKey,
1122          successUrl: '/dashboard/new-world?onboarding'
1123        })
1124      })
1125
1126      if (checkoutResponse.ok) {
1127        let { checkoutSessionUrl } = await checkoutResponse.json()
1128        window.location.href = checkoutSessionUrl
1129      } else {
1130        console.log(await checkoutResponse.text())
1131        alert("There was an error setting up your account. Our team has been notified to correct this issue.")
1132        $('body').removeClass('loading')
1133      }
1134    })
1135
1136    // watch video modal
1137    $('.open-video-modal').click((e) => {
1138      e.preventDefault()
1139      $('.close-modal').click() // close any already open modal
1140      MicroModal.show('modal-video',{
1141        onClose: () => {
1142          // reset youtube videos when modal closes
1143          let src = $('.nac-video').attr('src')
1144          $('.nac-video').attr('src',src)
1145        }
1146      })
1147    })
1148
1149    // hero slideshow
1150    let numSlides = $('.hero-slide').length
1151    let slideIndex = 1
1152    setInterval(() => {
1153      $('.hero-slide').removeClass('active')
1154      $('.hero-slide').eq(slideIndex).addClass('active')
1155      slideIndex++
1156      if( slideIndex >= numSlides ) slideIndex = 0
1157    },5000)
1158
1159    // promo slideshow
1160    let numSlides2 = $('.promo-slide').length
1161    let slideIndex2 = 1
1162    setInterval(() => {
1163      $('.promo-slide').removeClass('active')
1164      $('.promo-slide').eq(slideIndex2).addClass('active')
1165      slideIndex2++
1166      if( slideIndex2 >= numSlides2 ) slideIndex2 = 0
1167    },5000)
1168
1169  </script>
1169
1170  
1170<script src="https://cdn.usefathom.com/script.js" data-site="EKBJVRUJ" defer></script>
1170
1171
1172
1173  
1174</body>
1175</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.