사용 가이드로 건너뛰기
Interfaces That Feel작성자 owl-listener

Interfaces That Feel 스킬.

인터페이스 문구와 모션을 사용자의 감정 상태에 연결합니다.

  • 인터랙션 디자인
  • 감정 상태
소스 검토 · interfaces-that-feelSKILL.md
작업 인터페이스 문구와 모션을 사용자의 감정 상태에 연결합니다. 결과물 선택한 인터페이스 순간에서 사용자가 느낄 법한 상태 설명. 시작 전 확인 문구와 타이밍을 포함한 실제 로딩, 오류 또는 완료 상태를 준비하세요. 가능하면 대상 사용자 조사도 포함해 추정한 감정과 관찰된 사용자 행동을 구분할 수 있게 합니다.
편집 요약 · 소스 검토일 2026-11-02 · 생성된 예제가 아닙니다

01 기능 소개

인터페이스 문구와 모션을 사용자의 감정 상태에 연결합니다

감정에 맞는 타이밍, 오류 복구와 피드백을 검토하고 사용자 상태를 구체적인 문구와 모션 결정으로 바꾸세요.

소스 기반 워크플로실행 벤치마크 아님

작업 방식

Interfaces That Feel은 제품을 사용하는 사람의 상태를 통해 특정 순간을 검토합니다. 결과를 기다리는 순간, 오류에서 복구하는 순간, 작업을 완료하는 순간에는 서로 다른 신호가 필요합니다. 스킬은 이러한 순간을 문구, 타이밍, 이징과 상호작용 동작의 구체적인 선택에 연결합니다.

원문은 느끼는 상태를 명명하고 물리적 비유를 찾은 뒤 행동 특성을 추출해 인터페이스에 적용하는 전환 과정을 사용합니다. 모션이 존재할 이유가 있는지, 동작 줄이기 설정에서도 경험이 작동하는지도 확인합니다. 기능은 올바르지만 전달이 부족한 인터페이스를 한정해 개선하기에 적합합니다.

예상 산출물

  • 선택한 인터페이스 순간에서 사용자가 느낄 법한 상태 설명.
  • 그 순간에 연결된 구체적인 문구와 타이밍 권장안.
  • 감정 신호와 동작 줄이기 설정에서의 동작의 전후 비교 검토.
예시 브리프 보기

브리프에서 검토까지

  1. 01
    순간 식별

    로딩, 빈 상태, 오류, 성공 또는 온보딩 상태를 선택합니다. 사용자가 경험할 법한 상황을 설명하고 이 평가를 직접 관찰한 사용자 근거와 구분합니다.

  2. 02
    감정을 동작으로 전환

    저항이나 안정되는 움직임 같은 유용한 물리적 비유를 찾습니다. 관련 특성을 추출해 이징, 지속 시간, 간격 또는 문구 결정에 연결합니다.

  3. 03
    인터페이스 신호 수정

    오류 복구를 명확하고 사용자를 탓하지 않게 만들고, 성공 알림은 상황에 비례하게 유지하며, 로딩 문구에 목적에 맞는 어조를 부여합니다. 시간만 채우는 모션은 제거합니다.

  4. 04
    결과 검토

    동작 줄이기 설정을 포함해 전후 경험을 비교합니다. 색상과 이미지를 제거해도 감정 신호가 남는지 묻습니다.

02 활용 상황

언제 사용하면 좋을까요

문구와 타이밍을 포함한 실제 로딩, 오류 또는 완료 상태를 준비하세요. 가능하면 대상 사용자 조사도 포함해 추정한 감정과 관찰된 사용자 행동을 구분할 수 있게 합니다.

적합한 경우

  • 차가운 피드백 상태기술적으로 올바른 화면이 대기나 복구 중 사용자에게 충분히 응답하지 못하는 경우입니다.
  • 문구와 모션 다듬기오류, 성공 또는 온보딩 순간에 근거 있는 처리가 필요한 팀에 적합합니다.

확인할 한계

  • 해석에는 맥락 필요스킬의 감정 해석은 디자인 평가이지 모든 사용자의 감정을 입증하는 자료가 아닙니다.
  • 절제된 모션원문은 모션을 추가하기 전에 줄이고 동작 줄이기 설정을 테스트하도록 권장합니다.
  • 결과 입증이 아닌 지침사용자 근거 없이 타이밍 권장안만으로 만족도 향상을 입증할 수 없습니다.

준비할 입력

  • 선택한 상태검토할 로딩, 오류, 성공 또는 기타 순간을 제공합니다.
  • 사용자 맥락작업, 중요도 및 대상에 관한 알려진 조사 결과를 설명합니다.
  • 기존 구현현재 문구, 타이밍과 모션 동작을 제공합니다.

03 핵심 결정

중요한 판단 기준

  1. 근거 있는 타이밍

    지속 시간과 이징을 의도한 행동 신호에 연결합니다.

  2. 유용한 복구 문구

    오류 메시지에서 책임을 인정하고 구체적인 다음 행동을 보여 줄 수 있습니다.

  3. 절제된 모션

    애니메이션을 유지하기 전에 어떤 기여를 하는지 검토합니다.

04 예시 브리프

목적을 좁힌 요청으로 시작하세요

아래 예시 브리프는 테스트되지 않았습니다. 사용하기 전에 스킬의 설정을 확인하세요.

소스와 설정 확인

검토할 로딩, 오류, 성공 또는 기타 순간을 제공합니다.

업스트림 소스 파일
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/interaction-design/skills/interfaces-that-feel/SKILL.md

아래 참고 링크에서 원본 사용 지침을 확인할 수 있습니다. 사용 전에 리포지터리의 설정 요건을 확인하세요. 설치 명령어가 아닙니다.

결과물 하나부터 시작

스킬을 실행하기 전에 이 브리프의 범위, 소스 자료, 제약 조건을 상황에 맞게 조정하세요.

예시 브리프
interfaces-that-feel로 보고서 생성 흐름의 대기, 실패와 완료 상태를 검토해 주세요. 기존 문구를 읽고 실제 타이밍을 확인하세요. 먼저 사용자가 느낄 법한 감정적 맥락을 설명하고 조사로 뒷받침되지 않는 가정을 표시하세요. 간결한 문구와 소수의 모션 변경을 제안하고 각각 무엇을 전달하는지 설명하세요. 작업 속도와 명확성을 유지하세요. 동작 줄이기를 켠 경험과 비교하고 애니메이션 없이도 이해할 수 있어야 하는 신호를 식별하세요. 권장안은 이 세 상태에 한정하세요.

결과 확인

실제 출력을 다음의 관찰 가능한 기준과 비교해 확인하세요.

  • 각 문구 또는 모션 제안에 선택한 상태에서의 목적이 명시됩니다.
  • 추정 감정과 실제 조사 결과를 구분합니다.
  • 동작 줄이기에서도 필요한 피드백과 작업 명확성을 유지합니다.

OpenDesign은 코딩 에이전트를 위한 로컬 디자인 작업 공간을 제공합니다. 이 목록은 스킬이 번들로 포함되어 있거나 외부 도구, 자격 증명, 소프트웨어 의존성이 포함되어 있다는 뜻이 아닙니다.

05 출처 및 라이선스

소스와 라이선스

이 페이지는 아래에 링크된 고정 소스 리비전을 설명합니다. 업스트림의 동작과 요구 사항은 바뀔 수 있습니다.

소스 소유자
owl-listener
스킬 파일
SKILL.md
라이선스
MIT
검토한 스냅샷
2026-11-02 · 9a6930cf84a8
편집 소스 요약
인터페이스 문구와 모션을 사용자의 감정 상태에 연결합니다.

링크된 소스를 바탕으로 OpenDesign이 작성한 원본 요약입니다. 저장소 스타 수는 특정 시점의 인기 지표일 뿐 스킬 사용량이나 품질 점수가 아닙니다.

06 시작 전 질문

시작 전 궁금한 점

단순히 애니메이션을 추가하는 스킬인가요?

아니요. 원문은 먼저 모션을 줄이고 남기는 모든 애니메이션에 이유를 부여하라고 요구합니다.

어떤 인터페이스 층위를 바꿀 수 있나요?

원문은 문구 어조, 타이밍, 이징, 색온도, 간격과 애니메이션 지속 시간을 다룹니다.

동작 줄이기 검토도 포함하나요?

네. 동작 줄이기 설정으로 테스트하는 것이 권장 실무에 포함됩니다.

OpenDesign

작업 요청과 디자인 결과물을 한곳에 모으세요.

브리프, 소스 자료, 디자인 작업을 로컬 작업 공간에 함께 보관하세요. 워크플로에 추가하기 전에 스킬 자체의 설정을 확인하세요.

업스트림 소스 파일
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/interaction-design/skills/interfaces-that-feel/SKILL.md