작업 화면 미리보기에 이미지 제거 버튼 추가

삭제 버튼만 추가하는 것이라면 이렇게 할 수 있습니다:

편집 버튼을 왼쪽으로 이동하면(보너스: 작성 입력 필드까지 마우스 이동 거리가 줄어듦), 삭제 버튼을 오른쪽에 배치할 수 있습니다… 이렇게 하면 무해한 동작과 위험한 동작 사이에 일정한 간격이 생깁니다.

다른 좋은 아이디어들:

  • 편집 아이콘을 50%, 75% 버튼처럼 파란색으로 변경
  • 텍스트는 검은색으로 유지하되, 클릭 시 입력 필드로도 이동하게 함
  • 제목 편집기가 열려 있을 때, 미리보기 텍스트의 베이스라인과 일치하도록 위치를 조정할 수 있을까요 (예: z-레이어를 위에 놓기)? 이렇게 하면 클릭 시 화면이 덜 흔들립니다:

이는 더 큰 범위의 문제이지만, 회전과 자르기 기능을 위해 완전히 다른 종류의 메뉴가 필요할 수도 있습니다.

http://notion.so 에 좋은 예시가 있습니다:

여기서는 버튼에 여러 옵션이 있고, 크기는 핸들을 클릭하여 드래그하는 방식으로 조절합니다…

한 가지 좋은 세부 사항은, 버튼 오버레이보다 너무 작은 이미지를 추가했을 때, 사용자가 조작을 시도하면 버튼이 완전히 포함되도록 이미지 크기를 강제 조정한다는 점입니다. 이는 호버 시 주변 콘텐츠를 가리는 버튼이避免出现됩니다.

7개의 좋아요