플렉스튜디오를 제대로 활용하고 계신가요? 아마 몇 가지 놀라운 기능들을 놓치고 있을지도 몰라요. 여러분을 위해 개발팀 멤버들이 로우코드 앱 개발 플랫폼 ‘플렉스튜디오’의 숨은 기능을 직접 골라서 소개할게요. 잘 알려지지 않았지만, 유용한 기능들을 통해 플렉스튜디오를 더욱 효과적으로 활용해 보세요!
플렉스튜디오가 처음이라면? 영상으로 한 번에 이해하기 ▼
☑️ Flextudio’s Comment
성공한 브랜드들을 보면, 각 브랜드를 떠올리게 하는 대표 색상이 있죠. 마찬가지로 앱에서도 브랜드 색상을 테마 색으로 설정해 꾸준히 활용하면 사용자에게 브랜드 아이덴티티를 자연스럽고 강력하게 각인시키는 최고의 방법입니다.
앱의 색상은 브랜드 아이덴티티를 강화하고 차별성을 높이는 중요한 요소예요. 플렉스튜디오엔 각각의 컴포넌트에 원하는 색상을 자동으로 변경 & 적용할 수 있는 테마 색 설정 기능이 있어요. 먼저 3가지 사용 방법을 소개할게요.
1) 시나리오에서 설정된 테마 색은 워크스페이스의 앱 영역 → 앱정보 설정의 ‘테마색 변경’버튼을 통해 앱에 반영할 수 있어요. 앱 전체에 사용된 색상을 한 번에 전부 바꿀 수 있죠.
2) 시나리오 스튜디오에서 디자인하며 변경되는 색상을 확인하고 싶다면, 우측 상단의 동그라미 아이콘을 클릭해 보세요. 원하는 테마를 선택하면 색상이 변경되는 모습을 볼 수 있어요.
3) 각 요소의 색상을 설정할 때도 테마에 맞는 색상 팔레트에서 선택할 수 있어요.
매번 색상 값이나, 비슷한 색상을 찾을 필요 없이 원하는 색으로 나만의 테마를 만들고 편하게 변경하세요! 나만의 테마를 만드는 방법은 아래 사용자 가이드에 자세하게 담겨 있어요.
☑️Flextudio’s Comment
스튜디오에서 스크립트를 쓰면 더 많은 걸 구현할 수 있어요! 자바스크립트 구문으로 상세한 조건도 설정할 수 있고, 스크립트로만 구현되는 기능들도 있어요! 함수 자동 생성을 쓰면 스크립트를 다 외우고 있지 않아도 클릭 몇 번으로 자주 쓰는 스크립트를 자동 생성해 주니깐 편리해요 강추합니다 ~ . ~
함수 자동 생성을 이용해 푸시 알림, GPS와 같은 복잡한 기능을 간편하게 구현할 수 있어요. 바로 만들어 볼까요? 예를 들어 토스트 메시지를 함수 자동 생성 기능으로도 쉽게 개발할 수 있어요.
1) 시나리오 스튜디오에서 [Dev mode] – Event 영역을 선택해요. Event list라는 글씨 옆에 ‘+’ 버튼을 누르면 새로운 이벤트를 만들 수 있어요.
2) 함수 자동 생성 버튼 – 메시지박스/토스트 – 토스트 순서로 클릭해요.
3) 기능/함수 자동생성 팝업이 등장했어요. 개발하고 싶은 토스트 메시지에 맞게 내용을 작성하면 이벤트가 생성돼요.
4) 앱에서 일어날 수 있는 상황을 가정해서 버튼 컨드롤(Control)을 누르면 토스트 메시지 이벤트가 실행되도록 연결할게요. 컨트롤이 포함된 레이아웃(Layout)을 선택해요. 이벤트 사용을 체크한 후, EventType과 이벤트명의 값을 채우면 완성이에요. 함수 자동 생성 기능을 통해 더 복잡하거나, 개발이 번거로운 기능도 빠르게 만들 수 있으니 꼭 사용해 보세요!
함수 자동 생성으로 만들 수 있는 기능 더 알아보기 👉
☑️ Flextudio’s Comment
컨트롤뿐 아니라 스텝이나, 이벤트까지도 복사 붙여넣기가 되서 같은 작업을 많이 줄여줍니다. 특히 다른 시나리오에도 복붙이 되어서 유용합니다.
복사 붙여넣기 기능은 언제 어디서나 작업을 빠르고 편리하게 만들죠. 익숙한 이 기능, 플렉스튜디오에서 앱을 개발할 때도 편리하게 사용할 수 있어요. 단순히 모양만 복사하는 게 아니라 데이터의 조건이나 이벤트 등이 모두 복사돼요. 다른 화면(스탭)과 시나리오에도 새로 만들 필요 없이 그대로 사용할 수 있어요. 소소하지만, 작업 시간을 단축하기 위해 자주 활용할 수 있는 기능이라고 생각해요.
그렇다면 모양(디자인)만 복사하고 싶을 땐 어떻게 해야 할까요? 스타일만 복사할 수 있는 단축키가 따로 있어요. 혹은 시나리오 스튜디오에서 [Design Mode] 하단의 스타일 복사 붙여넣기 버튼을 사용할 수 있으니 참고하세요!
작업 시간을 단축하는 플렉스튜디오 단축키 더 알아보기 👉
☑️ Flextudio’s Comment
매번 스튜디오에서 이벤트 수정하고 디버거 실행해서 테스트하는게 아니라 디버거에서 실시간으로 스크립트 작성해보면서 테스트할 수 있어서 좋음
앱 개발에서 디버거를 이용하면 에러를 확인하고, 명령어를 실행하고, 변수를 분석해 보는 등의 일을 할 수 있어요. 하지만 매번 개발과 디버거를 오가며 테스트하는 과정을 거친다면 너무 번거롭죠. 플렉스튜디오의 콘솔 기능을 활용하면 그런 불편을 해소할 수 있어요. 함수 자동 생성 기능에서 예시로 설명했던 토스트 메시지 만들기를 통해 콘솔 사용 방법을 보여드릴게요.
1) 우선 빈 화면(스탭,step)의 시나리오를 만들었어요. 시나리오 스튜디오 우측 상단의 녹색 디버거 버튼을 클릭하면 디버거로 이동해요.
2) 콘솔은 디버거 하단의 ‘디버깅 도구 탭’에서 확인할 수 있어요. 콘솔 입력창에 토스트 메시지를 만드는 짧은 스크립트를 작성하고 엔터 키(Enter key)를 눌러 보세요.
3) 아래 이미지처럼 앱 화면에 바로 반영되는 모습을 확인할 수 있어요. 콘솔로 다양한 상황과 기능에 맞춰 스크립트를 테스트해 보세요!
이처럼 플렉스튜디오에는 잘 알려지지 않은 강력한 기능들이 숨어 있어요. 이제 직접 플렉스튜디오를 열어 이 기능들을 시험해 보고, 더욱 똑똑하게 개발해 보세요. 여러분의 잠재력을 최대한으로 활용할 수 있을 거예요.