[UX Summit 요약] 오른쪽 클릭은 옳다


오른쪽 클릭은 옳다 (Right Click is Right)를 요약하였습니다. 좋은 UX를 제공하는 오른쪽 클릭을 여러분의 애플리케이션에 적용해 보세요.

오른쪽 클릭을 왜 해야하는 지와 어떻게 구현하는 지가 모두 명쾌하게 정리되어 있습니다. 

  • 데스크톱 애플리케이션 화면 구성 시 꼭 생각해야 할 점들 (2분)
  • 왜 오른쪽 클릭이이 왜 좋은 UX를 제공하는가? (5분)
  • FMX와 VCL에서 오른쪽 클릭 구현 코드 작성하기 (Sample 코드 포함)
    • VCL로 오른쪽 클릭 구현하기 Sample 코드 (8분)
    • FMX로 오른쪽 클릭 구현하기 Sample 코드 (2분)

발표자(Roger Swann)는 1981년 씨골 콘트롤즈 (https://www.cigol.com/) 창업 이래, 모토롤라 8비트 칩 기반 소프트웨어 제작을 시작으로 지금까지 장비와 윈도우 소프트웨어를 개발해오고 있는 엠바카데로 C++ MVP입니다.

데스크톱 애플리케이션 화면 구성 전에 반드시 생각할 사항

  • 이 소프트웨어의 목적이 무엇인가?
  • 누가 무엇을 하기 위해 이 소프트웨어를 사용하는가?

화면은 사용하기에 쉽고 직관적이어야 한다

대체로 소프트웨어의 목적은 사용자가 컴퓨터를 도구로 사용하여 원하는 작업을 쉽게 빠르고 정확히 처리하도록 하는 것이다.

  • 화면은 사용하기에 쉽고 직관적이어야 한다.
  • 일반 사용자는 프로그래머만큼 컴퓨터를 잘 알지 못한다.
  • 일반 사용자들이 당신이 만든 소프트웨어를 선택할 수 있고 빠르게 배워서 잘 활용할 수 있어야 한다.
  • 기업은 새로 들어온 직원도 쉽게 배워서 사용할 수 있는 소프트웨어를 선호한다.
  • 디자인은 ‘단순함을 유지’ 하는 것이 중요하다.

마이크로소프트 윈도우와 오른쪽 클릭의 역사

  • DOS 시절 메뉴
    • DOS 시절에는 프로그램 화면 위쪽에 표현된 메뉴를 보고 사용했다. 당시에는 매뉴얼을 읽을 필요가 없없다. 그저 메뉴를 하나씩 살펴 보면 이해할 수 있었다.
  • 윈도우 시절 메뉴
    • 윈도우 시절에는 DOS 방식을 유지하면서 팝업 메뉴 방식이 새로 나왔다. 초창기 거의 모든 윈도우 프로그램이 이 방식을 지켰다.
    • 팝업 메뉴 방식은 사용자가 특정 요소를 선택하고 오른쪽 클릭을 하면 그 요소로 할 수 있는 모든 메뉴가 나타나는 방식이다. 사용자는 원하는 요소에서 일단 오른쪽 클릭만 하고 나면 쉽게 사용할 수 있었다.

오른쪽 클릭이 옳은 이유

내가 소프트웨어 개발을 막 시작하던 시절에는,

사람들이 나에게 어떻게 컴퓨터 프로그램을 사용하는 지를 자주 질문하곤 했다. 그 당시 내 첫 대답은 항상 같았다. “사용하려는 요소를 선택하고 오른쪽 클릭을 하세요. 좋은 윈도우 프로그램이라면 당신이 원하는 것이 팝업으로 표시될 거예요”

세상이 바뀌고 웹이 대두되면서,

소프트웨어 개발도 많은 다른 방식이 사용되었고 개발 방법에 대한 훈련이 부족한 개발자들이 많아졌다. 다양한 배경을 가진 사람들이 프로그래밍을 하거나 웹 사이트를 설계하기 시작했는데 당시에는 정형화된 표준이 없다보니 목적이 같은 경우에서도 서로 다른 여러가지 방식이 사용되었다. 점차 오른쪽 클릭으로 알맞은 메뉴를 제공하지 않는 경우도 많아졌다.

그후 모바일 시대가 되면서, 다양한 모바일 플랫폼은 각자 오른쪽 마우스 클릭을 구현하는 방식이 제각각이어서 오른쪽 메뉴를 구현할 방법을 찾기도 더 어려워졌고 오른쪽 메뉴 구현도 더 줄어들었다.

요즘에 누군가 나에게 프로그램을 어떻게 사용하는지 물어보면,

나는 일단 그 사람과 마찬가지로 장비를 들고 처음부터 일일이 눌러본다. 이제는 질문을 한 일반 사용자와 내가 크게 다르지 않다. 단지 나는 그 사람과 달리 일단 화면에서 뭐든 눌러보면서 걱정하지 않고 그 사람이 하고 싶은 기능을 찾아 간다는것만이 유일한 차이점이다.

실제로 질서가 무너진 혼동 속에 있다.

데스크톱 애플리케이션은 윈도우의 원래 접근법을 지켜야 한다고 나는 주장한다. 원하는 항목을 선택하고 오른쪽 클릭을 하면 사용자가 원하는 것을 할 수 있는 메뉴가 팝업으로 표시되는 방식은, 사용자가 매우 빠르게 소프트웨어를 배워서 업무를 효과적이고 신속하게 처리하도록 해준다..

오른쪽 마우스 클릭을 구현할 때에는

  • 창의적으로 디자인을 고려하자 (하지만, 애플리케이션의 본질적 기능을 늘 염두하자)
  • ‘사용 일관성’을 유지하도록 디자인하자.

시연과 Sample 코드를 보기 전 참고 사항

  • 시연은 32-bit CLang 컴파일러에서 작동시키지만, 이 코드는 64-bit CLang이나 기존 볼랜드 32-bit 컴파일러에서도 모두 작동한다.
  • 시연 코드는 C++이지만, 델파이 개발자는 몇줄 안되는 이 C++ 코드를 델파이로 쉽게 바꿀 수 있다.

오른쪽 클릭으로 팝업 메뉴를 표시하는 시연(과 코드)

이미지 위에서 오른쪽 클릭을 하면, 팝업으로 증가와 감소 메뉴가 표시되어서 텍스트박스의 숫자를 증가/감소하는 간단한 코드 시연 비디오를 따라서 하면 쉽게 완성할 수 있음)


AI api C++ c++빌더 cpp database Delphi DelphiCon Firedac fmx IDE ideas interbase ios migration modernization news RAD스튜디오 tips UI UIUX vcl windows 개발 개발사례 개발팁 겟잇 기술레터 기술백서 데이터 데이터베이스 델파이 마이그레이션 모바일 보안 안드로이드 윈도우 윈도우10 인공지능 인터베이스 출시 파이어몽키 프로젝트 현대화