1<!DOCTYPE html> 2<html> 3<head> 4 <title>About â Kinodal</title> 5 <meta name="viewport" content="width=device-width, initial-scale=1"> 6 <style> 7 * { box-sizing: border-box; margin: 0; padding: 0; } 8 body { 9 background: #1A1A24; 10 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; 11 color: #D2D2DC; 12 min-height: 100vh; 13 } 14 .wrap { 15 max-width: 600px; 16 margin: 0 auto; 17 padding: 48px 24px 64px; 18 } 19 .logo { 20 display: inline-flex; 21 align-items: center; 22 gap: 10px; 23 margin-bottom: 28px; 24 text-decoration: none; 25 } 26 .logo-icon { width: 36px; height: 36px; background: url('/assets/kinodal-logo.png') center/cover no-repeat; border-radius: 10px; } 27 .logo-text { 28 font-size: 20px; 29 font-weight: 700; 30 color: #D2D2DC; 31 letter-spacing: -0.5px; 32 } 33 h1 { 34 font-size: 30px; 35 font-weight: 800; 36 letter-spacing: -0.5px; 37 margin-bottom: 24px; 38 color: #D2D2DC; 39 } 40 p { 41 font-size: 16px; 42 line-height: 1.75; 43 color: #C4C4D4; 44 margin-bottom: 22px; 45 } 46 .cta-row { 47 margin-top: 36px; 48 padding-top: 32px; 49 border-top: 1px solid #2A2A3A; 50 text-align: center; 51 } 52 .cta { 53 display: inline-block; 54 background: #7B61FF; 55 color: white; 56 padding: 14px 32px; 57 border-radius: 12px; 58 font-size: 15px; 59 font-weight: 700; 60 text-decoration: none; 61 letter-spacing: 0.3px; 62 border: none; 63 cursor: pointer; 64 font-family: inherit; 65 } 66 .cta-row p { margin-top: 16px; margin-bottom: 0; font-size: 13px; color: #8888A0; } 67 .cta-row a.link { color: #7B61FF; text-decoration: none; font-weight: 600; } 68 </style> 69</head> 70<body> 71 72 <style> 73 .site-nav { background: #13131A; border-bottom: 1px solid #2A2A3A; position: sticky; top: 0; z-index: 100; } 74 .site-nav-inner { max-width: 1100px; margin: 0 auto; padding: 0 20px; height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 20px; } 75 .site-nav-logo { display: flex; align-items: center; gap: 8px; text-decoration: none; color: #D2D2DC; font-weight: 700; font-size: 16px; flex-shrink: 0; } 76 .site-nav-logo-icon { width: 30px; height: 30px; background: url('/assets/kinodal-logo.png') center/cover no-repeat; border-radius: 8px; } 77 .site-nav-links { display: flex; align-items: center; gap: 2px; flex: 1; } 78 .site-nav-link { color: #C4C4D4; text-decoration: none; font-size: 14px; font-weight: 600; padding: 10px 14px; border-radius: 8px; background: none; border: none; cursor: pointer; font-family: inherit; } 79 .site-nav-link:hover { color: #D2D2DC; background: #1C1C26; } 80 .site-nav-link.active { color: #7B61FF; } 81 .site-nav-dropdown { position: relative; } 82 .site-nav-dropdown-menu { display: none; position: absolute; top: calc(100% + 4px); left: 0; background: #1C1C26; border: 1px solid #2A2A3A; border-radius: 10px; padding: 6px; min-width: 170px; box-shadow: 0 8px 24px rgba(0,0,0,0.4); } 83 .site-nav-dropdown-menu.open { display: block; } 84 .site-nav-dropdown-menu a { display: block; padding: 9px 12px; color: #C4C4D4; text-decoration: none; font-size: 13.5px; font-weight: 600; border-radius: 6px; } 85 .site-nav-dropdown-menu a:hover { background: #24242F; color: #D2D2DC; } 86 .site-nav-dropdown-menu-right { left: auto; right: 0; } 87 .site-nav-caret { font-size: 10px; margin-left: 2px; } 88 .site-nav-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; } 89 .site-nav-signin { color: #C4C4D4; background: none; border: none; font-size: 14px; font-weight: 600; cursor: pointer; font-family: inherit; padding: 10px 10px; border-radius: 8px; } 90 .site-nav-signin:hover { color: #D2D2DC; background: #1C1C26; } 91 .site-nav-cta { background: #7B61FF; color: #fff; text-decoration: none; font-size: 14px; font-weight: 700; padding: 10px 20px; border-radius: 9px; white-space: nowrap; border: none; cursor: pointer; font-family: inherit; } 92 .site-nav-cta:hover { background: #6B4FEF; } 93 .site-nav-hamburger { display: none; background: none; border: none; color: #D2D2DC; font-size: 22px; cursor: pointer; padding: 6px; line-height: 1; } 94 .site-nav-mobile { display: none; flex-direction: column; padding: 8px 20px 20px; border-top: 1px solid #2A2A3A; } 95 .site-nav-mobile.open { display: flex; } 96 .site-nav-mobile a { color: #C4C4D4; text-decoration: none; font-size: 15px; font-weight: 600; padding: 12px 4px; border-bottom: 1px solid #1E1E2A; } 97 .site-nav-mobile-label { color: #8888A0; font-size: 11px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; padding: 12px 4px 4px; } 98 .site-nav-mobile-group a { padding-left: 16px; border-bottom: none; } 99 .site-nav-mobile-divider { border-top: 1px solid #2A2A3A; margin: 8px 0; } 100 .site-nav-mobile .site-nav-cta { display: block; text-align: center; margin-top: 10px; } 101 @media (max-width: 860px) { 102 .site-nav-links, .site-nav-actions { display: none; } 103 .site-nav-hamburger { display: block; } 104 } 105 </style> 106 <header class="site-nav"> 107 <div class="site-nav-inner"> 108 <a href="/" class="site-nav-logo"><div class="site-nav-logo-icon"></div><span>
108Kinodal</span></a> 109 <nav class="site-nav-links"> 110 <a href="/" class="site-nav-link">Home</a> 111 <a href="/about" class="site-nav-link active">About</a> 112 <div class="site-nav-dropdown"> 113 <button class="site-nav-link site-nav-dropdown-btn" onclick="wlToggleNavDropdown('howItWorks')">How it works <span class="site-nav-caret">â¾</span></button> 114 <div class="site-nav-dropdown-menu" id="nav-dd-howItWorks"> 115 <a href="/dashboard/how-it-works/filmmaker">For Filmmakers</a> 116 <a href="/dashboard/how-it-works">For Viewers</a> 117 </div> 118 </div> 119 <a href="/dashboard/upgrade" class="site-nav-link">Upgrade</a> 120 <a href="/contact" class="site-nav-link">Contact</a> 121 </nav> 122 <div class="site-nav-actions" id="siteNavActions"> 123 <div class="site-nav-dropdown"> 124 <button class="site-nav-signin site-nav-dropdown-btn" onclick="wlToggleNavDropdown('signIn')">Sign In <span class="site-nav-caret">â¾</span></button> 125 <div class="site-nav-dropdown-menu site-nav-dropdown-menu-right" id="nav-dd-signIn"> 126 <a href="/dashboard/login">Filmmaker sign in</a> 127 <a href="/dashboard/viewer/join">Viewer sign in</a> 128 </div> 129 </div> 130 <div class="site-nav-dropdown"> 131 <button class="site-nav-cta site-nav-dropdown-btn" onclick="wlToggleNavDropdown('getStarted')">Get Started <span class="site-nav-caret">â¾</span></button> 132 <div class="site-nav-dropdown-menu site-nav-dropdown-menu-right" id="nav-dd-getStarted"> 133 <a href="/dashboard/signup/filmmaker">I'm a Filmmaker</a> 134 <a href="/dashboard/viewer/join">I'm a Viewer</a> 135 </div> 136 </div> 137 </div> 138 <button class="site-nav-hamburger" onclick="wlToggleMobileNav()" aria-label="Menu">â°</button> 139 </div> 140 <div class="site-nav-mobile" id="siteNavMobile"> 141 <a href="/">Home</a> 142 <a href="/about">About</a> 143 <div class="site-nav-mobile-group"> 144 <div class="site-nav-mobile-label">How it works</div> 145 <a href="/dashboard/how-it-works/filmmaker">For Filmmakers</a> 146 <a href="/dashboard/how-it-works">For Viewers</a> 147 </div> 148 <a href="/dashboard/upgrade">Upgrade</a> 149 <a href="/contact">Contact</a> 150 <div class="site-nav-mobile-divider"></div> 151 <div id="siteNavMobileActions"> 152 <a href="/dashboard/login">Filmmaker sign in</a> 153 <a href="/dashboard/viewer/join">Viewer sign in</a> 154 <a href="/dashboard/signup/filmmaker" class="site-nav-cta">Get Started â I'm a Filmmaker</a> 155 <a href="/dashboard/viewer/join" class="site-nav-cta">Get Started â I'm a Viewer</a> 156 </div> 157 </div> 158 </header> 159
159<script> 160 // This nav is shared markup dropped into every page (marketing pages 161 // and app pages like /dashboard/upgrade alike) with no server-side 162 // knowledge of whether a session already exists â it's plain HTML, 163 // rendered before any localStorage lookup is even possible. Left as 164 // "Sign In / Get Started" unconditionally, a signed-in viewer or 165 // filmmaker landing here (e.g. via the "Upgrade" link) saw those 166 // prompts and reasonably assumed they'd been signed out, even though 167 // the page underneath was still correctly using their real session. 168 // Swap to a "Signed in as X" + direct link once the page loads and can 169 // actually check. 170 (function() { 171 function escapeHtml(s) { 172 return String(s).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>'); 173 } 174 var wlToken = localStorage.getItem('wl_token'); 175 var wlUser = wlToken ? JSON.parse(localStorage.getItem('wl_user') || 'null') : null; 176 var viewerToken = !wlToken ? localStorage.getItem('wl_viewer_token') : null; 177 var viewerUser = viewerToken ? JSON.parse(localStorage.getItem('wl_viewer_user') || 'null') : null; 178 var name, href, label; 179 if (wlToken && wlUser) { name = wlUser.name || wlUser.email; href = '/dashboard'; label = 'Go to Dashboard'; } 180 else if (viewerToken && viewerUser) { name = viewerUser.name || viewerUser.email; href = '/dashboard/viewer/sessions'; label = 'Your Screenings'; } 181 else { return; } 182 var safeName = escapeHtml(name || 'there'); 183 var safeLabel = escapeHtml(label); 184 var desktop = document.getElementById('siteNavActions'); 185 if (desktop) { 186 desktop.innerHTML = '<span style="color:#8888A0;font-size:13px;">Signed in as <strong style="color:#D2D2DC;">' + safeName + '</strong></span>' + 187 '<a href="' + href + '" class="site-nav-cta">' + safeLabel + '</a>'; 188 } 189 var mobile = document.getElementById('siteNavMobileActions'); 190 if (mobile) { 191 mobile.innerHTML = '<div style="padding:12px 4px;color:#8888A0;font-size:14px;">Signed in as <strong style="color:#D2D2DC;">' + safeName + '</strong></div>' + 192 '<a href="' + href + '" class="site-nav-cta">' + safeLabel + '</a>'; 193 } 194 })(); 195 196 function wlToggleNavDropdown(key) { 197 var el = document.getElementById('nav-dd-' + key); 198 var wasOpen = el.classList.contains('open'); 199 var open = document.querySelectorAll('.site-nav-dropdown-menu.open'); 200 for (var i = 0; i < open.length; i++) { open[i].classList.remove('open'); } 201 if (!wasOpen) el.classList.add('open'); 202 } 203 document.addEventListener('click', function(e) { 204 if (!e.target.closest('.site-nav-dropdown')) { 205 var open = document.querySelectorAll('.site-nav-dropdown-menu.open'); 206 for (var i = 0; i < open.length; i++) { open[i].classList.remove('open'); } 207 } 208 }); 209 function wlToggleMobileNav() { 210 document.getElementById('siteNavMobile').classList.toggle('open'); 211 } 212 </script>
212 213 214 <div class="wrap"> 215 <a href="/" class="logo"> 216 <div class="logo-icon"></div> 217 <div class="logo-text">Kinodal</div> 218 </a> 219 <h1>About Kinodal</h1> 220 <p>Welcome to Kinodal. Created by a post production specialist just for filmmakers. Kinodal was thoughtfully designed for directors, producers, video editors whose visionary projects have hit rough patches namely in the feedback stage. You know the feeling, finishing a first cut, proud to share with select viewers. Then the panoply of notes come in, notes that can reroute post onto a drastic detour. Confusion and doubt cloud decision. Sometimes all you want to know is when were the viewers on the same wavelength as you.</p> 221 <p>Kinodal tracks viewer engagement in the simplest way. With smartphone in hand, watching the video on a second screen (or the smartphone itself in some cases) the viewer effortlessly records their most basic reactions, engaged or not, with a simple swipe, keystroke, or press of the volume up down buttons (depending on hardware). Instinctive, quick, no typed notes, just immediate reactions (including voice notes). An aggregate of every reaction is available to the filmmaker on a backend dashboard that has the full engagement report. This is where the real magic happens.</p> 222 <p>The filmmaker can create customized reports for each of the post production crew members. The filmmaker can combine results from different screening types of the same film. (Live combined with convenience screenings.) For each report, s/he can filter out select viewers. Each reaction can be reviewed, kept or discarded. Voice notes are transcribed for fast read. The filmmaker can add notes, and even track their own reactions. Once the reports are prepped, they can be shared in various ways. AVID ALE and Premiere Proâs FCPXML files which contain reactions by intensity, voice notes transcribed, and filmmakers notes as color coded markers that can be laid over the source cut. The report can also be shared in the Kinodal dashboard window via a link. We at Kinodal understand the importance of getting your project back on track and out into the world.</p> 223 <div class="cta-row"> 224 <div class="site-nav-dropdown" style="display:inline-block;"> 225 <button class="cta site-nav-dropdown-btn" onclick="wlToggleNavDropdown('aboutGetStarted')">Get Started Free <span class="site-nav-caret">â¾</span></button> 226 <div class="site-nav-dropdown-menu" id="nav-dd-aboutGetStarted"> 227 <a href="/dashboard/signup/filmmaker">I'm a Filmmaker</a> 228 <a href="/dashboard/viewer/join">I'm a Viewer</a> 229 </div> 230 </div> 231 <p>Already have an account? <a href="/dashboard/login" class="link">Filmmaker sign in</a> · <a href="/dashboard/viewer/join" class="link">Viewer sign in</a></p> 232 </div> 233 </div> 234</body> 235</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.