Flutter로 글로벌앱 출시를 위한 꿀팁 - Droidknights2020Bansook Nam
Droidknighs2020에서 유튜브로 발표한 슬라이드입니다.
https://www.youtube.com/watch?v=gTYou3Ru1QM
[Speaker소개]
안드로이드 개발 7년차, Flutter 개발 2년차 개발자입니다. 현재 스타트업 Lawfully에서 182개국 약 7만명의 유저가 사용중인 글로벌앱을 개발/관리 하고 있습니다. 프론트엔드 개발에 관심이 많아 그 외에 React 프로젝트도 참여하였고, 각 플랫폼과 언어의 장단점을 잘 녹여서 개발에 적용중입니다.
이번 발표는 Flutter에 관심이 있는 개발자, 혹은 Flutter앱을 처음 런칭하시는 분들이 참고하시면 좋은 내용으로 준비했습니다.
[이런 분이 들으시면 좋습니다]
Flutter 관심 있으신분. Flutter로 앱을 출시하고 싶으신분. Native Platform 앱과 Flutter 앱을 비교해보고 싶으신분.
Flutter로 글로벌앱 출시를 위한 꿀팁 - Droidknights2020Bansook Nam
Droidknighs2020에서 유튜브로 발표한 슬라이드입니다.
https://www.youtube.com/watch?v=gTYou3Ru1QM
[Speaker소개]
안드로이드 개발 7년차, Flutter 개발 2년차 개발자입니다. 현재 스타트업 Lawfully에서 182개국 약 7만명의 유저가 사용중인 글로벌앱을 개발/관리 하고 있습니다. 프론트엔드 개발에 관심이 많아 그 외에 React 프로젝트도 참여하였고, 각 플랫폼과 언어의 장단점을 잘 녹여서 개발에 적용중입니다.
이번 발표는 Flutter에 관심이 있는 개발자, 혹은 Flutter앱을 처음 런칭하시는 분들이 참고하시면 좋은 내용으로 준비했습니다.
[이런 분이 들으시면 좋습니다]
Flutter 관심 있으신분. Flutter로 앱을 출시하고 싶으신분. Native Platform 앱과 Flutter 앱을 비교해보고 싶으신분.
안녕하세요 주니어 게임 개발자 노대영입니다.
유니티 개발자를 위한 언리얼 페이지를 공부해서 정리했습니다.
자세한 내용은 아래 공식 홈페이지를 확인하세요!
http://api.unrealengine.com/KOR/GettingStarted/FromUnity/index.html
220806 UX/UI 해외 인기 아티클 6기 : 3주차 발표Minho Lee
2022-08-06 [프롬디자이너] UX/UI 해외 인기 아티클 스터디 6기 중 3주차 발표자료입니다.
1️⃣ 피그마에서 웹 디자인을 할때 반응형과 유동적인 그리드를 구축하는 방법
2️⃣ 나쁜 UX 디자인 - SaaS에서 피하지 못한 최악의 UX 디자인 13가지
3️⃣ UI 디자이너로 빠르게(쉽지는 않겠지만) 성장하는 방법
발표자료 원본 링크 : https://bit.ly/3P4aFpK
안녕하세요 주니어 게임 개발자 노대영입니다.
유니티 개발자를 위한 언리얼 페이지를 공부해서 정리했습니다.
자세한 내용은 아래 공식 홈페이지를 확인하세요!
http://api.unrealengine.com/KOR/GettingStarted/FromUnity/index.html
220806 UX/UI 해외 인기 아티클 6기 : 3주차 발표Minho Lee
2022-08-06 [프롬디자이너] UX/UI 해외 인기 아티클 스터디 6기 중 3주차 발표자료입니다.
1️⃣ 피그마에서 웹 디자인을 할때 반응형과 유동적인 그리드를 구축하는 방법
2️⃣ 나쁜 UX 디자인 - SaaS에서 피하지 못한 최악의 UX 디자인 13가지
3️⃣ UI 디자이너로 빠르게(쉽지는 않겠지만) 성장하는 방법
발표자료 원본 링크 : https://bit.ly/3P4aFpK
2. 기기에 대한 Resize를 상대적으로 하기!
이것도 좋다! 그렇지만 충분하지는 않지.
특히, 태블릿 기기가 늘어나고 있는 시점에는.
공간을 효율적으로 재배치하여 좋은 경험을 주고 싶다.
물론 별도 버전도 만들 수 있지만,
이는 유지 보수 비용 측면에서 비싸다.
다른 방법은 없는 것일까?
3. Android 3.0 (API level 11) 이상에서
Fragment
http://developer.android.com/reference/android/app/Fragment.html
Fragments allow you to separate distinct behavioral components of your UI into
separate parts, which you can then combine to create multi-pane layouts when
running on a tablet or place in separate activities when running on a handset.
API 11 이하 버전에 대해서는 Fragment를 사용 못 하는 것일까?
그렇지는 않습니다. Fragment를 지원하는 라이브러리가 있고, 이를 사용하면 됩니다.
4. You should design each fragment as a modular and reusable activity component.
우리가 원하는 것은 이렇게 하는 것을 별도 tablet 버전을 위해서 만들지 않고,
Handset 버전에 대해서 만들어서 일괄 관리를 하고 싶은 것이다.
5. 결론은
2012.11.24일 기준으로서는 이상향에 가까운 것 같다는 생각 입니다.
할 수는 있습니다.
그렇지만, 현재로서는 그렇게 처리를 해 주기 위한 번거로움이 크다.
이 번거로움이 타블랫 버전을 따로 만들어서 사용자에게 더욱 특화된 경험을 선사하
는 잇점을 이기지는 못 하는 것이 현재 상황입니다.
그래도, 이에 대한 판단은 다를 수 있기 때문에,
지금부터 Fragment를 활용해서 화면을 만드는 과정에 대해서 설명을 드립니다.
그리고 마지막에는 앞서 우리가 원한 handset과 tablet이
one source에서 처리 되게 하기 위한 과정을 소개를 드리도록 하겠습니다.
8. Fragment에서는 자신을 나타내는 View를 만
들어서 onCreateView에서 반환을 하도록 합
니다.
* onCreateView는 Fragment LifeCycle 참고
View를 만들기 위해서 별도로 정의된 xml 파일
을 바탕으로 inflate를 진행합니다.
이를 용이하게 하도록 인자로 LayoutInflater가
제공이 됩니다.
9. 앞선 단계를 통해서 자신 Fragment를 UI 적인 형태 View로 구성을 했습니다.
물론 View와 관련된 세부적인 설정들도 내부적으로 하겠지요.
내부적인 동작을 잘 정의를 해 나갔다고 하면,
우리가 이제 관심을 가져야 하는 것은 바로 Fragment와 이를 감싸고 있는 Activity
간의 소통입니다.
Fragment에서 선택이 이루어짐에 따라서 Activity가 변경이 되어야 하면 이를 어떻
게 알릴 것인가? 그리고 만약 Activity에서 뭔가 선택이 일어난다면 어떻게
Fragment에 알려주고 이에 따른 변화를 가져오게 할까?
이를 위해서 Fragment와 Activity는 서로 통하는 길을 가지고 있습니다.
이에 대해서 알아보겠습니다.
10. Fragment에서 Activity로 이야기 하기
http://developer.android.com/reference/android/app/Fragment.html#getActivity()
위 함수를 통해서 현재 Fragment와 연관되어 있는 Activity에 대한 접근이 가능
예) ((Button)getActivity().findViewById(R.id.sampleButton)).setText("바뀐 문구")
Activity나 다른 요소에서 Fragment 접근하기
Fragment에 대한 접근도 위 방법과 유사하다. FragmentManager 통해서 접근한다는 점
만 제외하고는. 이에 대한 예는 아래와 같습니다.
예) ExampleFragment fragment
= (ExampleFragment) getFragmentManager().findFragmentById(R.id.example_fragment);
11. Fragment에서 발생된 이벤트에 대한 제어권 상위 Activity에 주기
Fragment를 Activity에 연결을 할 때 발생되는 callback 함수인 onAttach(Activity)를 이용
Activity를 전달하고자 하는 Event에 대한 Listener로 지정이 가능하도록 준비 후,
본 Fragment에서 발생되는 Event Listener를 바로 Activity로 지정.
예를 들자면, 영화 목록을 나타내는 Fragment의 List에서 선택이 발생되면,
해당 선택 Event를 Activity가 받아서 선택된 영화 세부 정보를 보이는 화면을 노출하는 것과 같은
Activity내 화면 다른 요소들을 조정할 수 있습니다.
12. 뭔가가 있기는 하지만, 복잡하다 ㅠ,.ㅠ
한 Activity 에서 일반 View 요소들을 다루는 게 왠지 그리워 진다~
그래도 아직 남은게 하나 있다. HandSet과 Tablet에서 동적으로 레이아웃 구성.
13. HandSet과 Tablet에서 동적으로 레이아웃 구성.
맘 속에서, 뭔가 단순할 것이라는 생각은 현재로서는 버리셔야 합니다.
방법은 이러합니다.
현재 상황이 화면을 넓게 레이아웃을 사용하는 경우인가를
프로그램 통해서 확인.
확인 결과에 따라서, 각기 이벤트 흐름을 프로그램으로 제어
즉 쉽게 말해서, 현재 화면 상황을 직접 확인하고, 그에 따른 동작을 제어 한
다는 이야기 입니다. 프로그래머가 직접!
실감이 나지 않을 것이라 생각하여, 안드로이드에서 제공 중인 샘플 코드를
직접 확인합시다.
15. 다시 돌아와서,
지금까지 간단한 샘플을 통해서, Fragment를 활용하는 방법을 보았습니다.
이 외에도 알아야 할 것들은 많습니다.
그렇지만, 지금까지 보아온 것을 통해서 개인적으로는 비용을 생각해 봅니다.
타블렛 대응을 위해서 Fragment를 고려해서 프로그램 작성하는 것은
별도 Tablet 버전을 만들어서 제공하는 것보다 비용이 더 많이 들 것이라 생각합니다.
게다가 Tablet 만이 줄 수 있는 경험을 Handset 때문에 포기하는 기회비용도 중요하죠.
물론, 앞서 살펴본 구조가 안드로이드 OS가 발전하면서,
Fragment를 활용하는 구조가 더 쉬워질 수도 있을 것 입니다.
그러나, 개인적으로 현재(2012.11.23)는 그렇지 않다고 판단합니다.
물론, 이에 대한 최종 결정은 각자 개인에게 달려 있겠지요.