📖 한국경영교육연구소 AI ACADEMY · 용어·통역 사전
플로팅 버튼 (floating button)
💬 쉬운 뜻
화면을 아무리 스크롤해도 늘 같은 자리에 '떠 있는' 동그란 버튼이에요. 식당 테이블마다 붙어 있는 호출벨처럼, 페이지 어디에 있든 오른쪽 아래에서 기다리다가 누르면 바로 반응해요.
🧭 이 상황에서
본문 옆에 채팅·문의 같은 부가 기능을 같이 두니 본문이 좁아져 읽기 힘들 때 — 본문은 화면 전체를 쓰게 하고, 부가 기능은 떠있는 버튼 하나로 모아 필요할 때만 열게 한다
⌨️ 이럴 땐 이렇게 입력
- 오른쪽 아래에 항상 떠 있는 동그란 채팅 버튼을 만들어줘. 스크롤해도 같은 자리에 있게 해줘
- 플로팅 버튼에 새 알림이 있으면 빨간 점 배지를 띄워줘
🔮 AI가 이렇게 답하면 = 이런 뜻
AI가 "position: fixed로 고정했어요"라고 하면 = 버튼을 페이지가 아니라 '창(화면)' 기준으로 못 박아서, 스크롤해도 안 따라 움직이고 제자리에 떠 있게 했다는 뜻이에요.
➡️ 다음엔 이렇게
버튼이 본문의 입력칸이나 버튼을 가리면 "본문 아래쪽에 여백을 줘서 플로팅 버튼이 내용을 안 가리게 해줘"라고 말하면 돼요.
💬 김지백 강사의 현장 팁
라이브 수업 페이지에서 채팅·투표를 본문 옆에 붙였더니 수업 화면이 좁아 답답했는데, 떠있는 버튼 하나로 모았더니 수업 내용이 전체 폭으로 시원하게 보였어요.
한국경영교육연구소 · AI ACADEMY — 외부강사 김지백 · 시연 교실 홈