하드웨어 제약이 있는 장치용 고품질 그래픽 사용자 인터페이스(GUI)를 설계하는 것은 어려울 수 있습니다. 그러나 이 기사에서는 설계 효율성을 극대화하여 더 쉽게 만드는 몇 가지 방법을 보여줍니다. 더 효율적인 GUI는 움직이는 부분과 애니메이션을 처리할 때 더 적은 메모리, CPU 및 GPU 전력을 사용하고 디자이너가 하드웨어 제약에 대해 걱정하는 대신 디자인을 창의적으로 할 수 있는 여지를 더 많이 허용합니다.

공통 요소가 있는 디자인

아래 예는 몇 가지 공통 요소가 있는 간단한 메뉴 화면을 보여줍니다.

  • 각 ICON_X는 GUI를 다른 색상의 화면으로 변경하는 버튼입니다.
  • HOME 버튼은 GUI를 홈 화면으로 되돌립니다.
  • HOURS:MINUTES:SECONDS 요소는 모든 화면의 오른쪽 상단에 남아 있습니다.
  • ICON_X 버튼과 HOME 버튼은 어떤 ICON_X 버튼이 선택되었는지에 관계없이 동일한 위치에 유지됩니다.

개발자 블로그 시리즈_1

GUI 개발자가 이 GUI의 각 화면에 대해 "TimeAndIconBanner" 요소(상단 표시줄에는 HOURS:MINUTES:SECONDS가 표시되고 하단 표시줄에는 아이콘 버튼이 표시됨)를 복사하여 붙여넣어 메뉴 레이아웃을 디자인하면 결과 GUI 모델의 여러 중복 개체입니다. 아래 이미지에서 "IconScreens"를 구성하는 Deck Object의 각 Card에는 동일한 TimeAndIconBanner 요소가 포함되어 있습니다.

TimeAndIconBanner 요소는 IconScreens 아래 각 개별 화면의 일부이며, TimeAndIconBanner의 여러 인스턴스는 화면이 변경될 때마다 해당 요소를 다시 그려야 하므로 불필요한 RAM과 CPU 사용량이 발생합니다.

이 디자인과 유사한 디자인을 최적화하기 위해 디자이너는 공통 요소(이 경우 TimeAndIconBanner)를 분리하고 아래와 같이 한 수준 위의 단일 인스턴스로 이동해야 합니다.

이제 하나의 TimeAndIconBanner 요소만 IconScreens와 같은 수준에 있습니다. 이 계층 구조는 디자인 구성 요소의 가장 효율적인 배열을 보여주므로 Altia Design 내에서 이러한 그룹의 z-순서에 해당하는 변경이 발생합니다. 즉, 가장 높은 수준의 TimeAndIconBanner 그룹이 디스플레이의 하위 IconScreens 그룹 위에 표시됩니다.

움직이는 부품이 있는 디자인

애니메이션 속도계를 고려하십시오. GUI가 바늘 대신 전체 화면을 다시 그리도록 설계된 경우 이 GUI에 더 많은 메모리가 필요합니다. 정적인 배경 이미지를 유지하고 상단의 바늘에만 애니메이션을 적용하면 가장 효율적이고 메모리를 절약할 수 있는 디자인이 생성됩니다. 몇 가지 추가 성능을 짜낼 수 있는 또 다른 장소는 fps를 줄이는 것입니다. 일부 애니메이션은 만족스러운 부드러움을 얻기 위해 하드웨어의 최대 프레임 속도가 필요하지 않을 수 있으며 Altia Design을 사용하면 실험하고 디자인에서 작동하는 더 낮은 fps를 쉽게 찾을 수 있습니다.

간단한 속도계

Altia가 GUI를 최적화하여 최소한의 메모리와 전력을 사용하여 최고의 성능을 제공하는 방법에 대해 자세히 알아보려면 다음 페이지에 초대합니다. 데모 예약 오늘 우리 전문가 GUI 팀의 일원과 함께.