Comments as a creative surface

댓글 창작 공간

Turn questions and reactions in comments into the next creative idea.

···
html
<div class="s-demo"><div class="cs"><div class="cs-post">POST: A QUICK DEMO</div><div class="cs-comment">“HOW DOES IT FOLD?”</div><div class="cs-comment">“SHOW THE BACK.”</div><div class="cs-next">NEXT VIDEO <b>HOW IT FOLDS →</b></div></div></div>
css
.s-demo{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(8px,3vmin,20px);font:700 clamp(10px,max(2.8vmin,1vw),16px)/1.25 sans-serif;color:var(--fg)}.s-demo *{box-sizing:border-box}@media(min-width:600px){.s-demo>div{transform:scale(1.4)}}.cs{width:min(91vw,560px);display:grid;gap:clamp(5px,1.7vmin,12px)}.cs-post{padding:clamp(8px,2.5vmin,19px);background:var(--fg);color:var(--bg);font-weight:900;text-align:center}.cs-comment{margin-left:clamp(10px,4vmin,28px);padding:clamp(6px,1.7vmin,12px);border:1px solid var(--line);background:var(--surface);font-size:clamp(10px,max(2.2vmin,1vw),15px)}.cs-comment:nth-child(3){margin-left:clamp(20px,8vmin,55px)}.cs-next{padding:clamp(6px,2vmin,14px);background:var(--accent-2);color:#211b19;font-size:clamp(10px,max(2vmin,1vw),14px);font-weight:900;animation:csnext 5s infinite}.cs-next b{display:block;font-size:1.2em}@keyframes csnext{0%,30%{opacity:.35;transform:translateY(7px)}55%,90%{opacity:1;transform:none}100%{opacity:.35}}

TikTok’s 2026 trend forecast describes comments, reactions, and memes as part of the creative canvas. Comments are participation, not just an engagement count.

In the demo, a question moves from the comment stack into the next video title. Preserve the audience’s wording when developing a response.

One vivid comment is not the whole audience. Check recurring and conflicting responses too.

When to use

Use it to find the next series topic in active comment threads.

Open as page ↗