고양국제고/셰어텍

[셰어텍] 3. 메인페이지 노가다와 뼈대 갖추기

카루-R 2021. 9. 26. 17:27
반응형

환영합니다, Rolling Ress의 카루입니다.

9월 24일, 모두들 수고 많으셨습니다!

 

와...멋져요. 지난 글에서 말씀드린 것들이 대부분 해결이 된 모습입니다. 아쉬운 점이 있다면 시간이 너무 짧다는 거. 뭘 했다고 두 시간이 훅 가는지...활동지 없이 그냥 앱 개발만 해도 빠듯한데 말이죠. 다음 시간부터는 활동지는 그냥 제출용으로 대충 쓰고, 앱 개발에만 주력을 해야 하지 않을까 싶습니다. 특히 이제 창진프가 얼마 남지 않았...잖아요? 아마 10월 말부터는 인문학 울림도 있을테고.

아무튼, 오늘 회의를 통해 여러 사항들이 정해졌습니다. '-'로 시작하는 건 셰어텍 전체의 일이고, '+'는 그냥 저 혼자 대강 정한 거예요.

- 앱 이름: Co-net (꼬넷)

- 회사 모토: To-share / To-gather / To-connect

- 메인페이지 디자인 (사실상 Microsoft의 디자인 철학을 따라야 하기에 조금 제한이 있지만..)

- 사내 부서 조직

+ Item class 구현

+ ShareTech.MainPage XAML 디자인

+ 마이크로소프트 스토어에서 Co-net 앱 예약

이 정도가 되겠습니다. 이제 제가 집에서 뭘 했는지 말씀드려야겠죠. 메인 페이지를 만들고 있었습니다.

대강 이렇게 생겼습니다. "아니 그래픽은 어디가고 이게 뭐야!" 하실 수도 있는데, 생각해보세요. 컴퓨터의 세상에서는 0과 1밖에 없습니다. 01010010101101010101 노가다를 하지 않고 저렇게 영어로만 타이핑 하는 것도 정말 감사해야 하는 세상이에요. 뭐, 쉽다고는 못하겠습니다만.

아참, 저 코드 양은 정말정말 적은 거예요. GTT는 전체 코드가 10,000줄을 넘어갔습니다.

그래픽 작업이 아예 안 되는 건 아니에요. 그러나 런타임 (동적) 기능을 수행하는 건 이 화면에 반영이 되지 않기 때문에, 그냥 제 머릿속에서 굴리면서 "아 이건 이런 식으로 동작하겠구나" 하고 만드는 방법밖에 없어요. 아님 그냥 컴파일을 매번 하든가.

그렇게 해서 나온 메인페이지의 초안입니다. 저 중에서 하나를 선택하면 다른 페이지로 넘어가야 하는데, 저걸 Page로 할지 Frame으로 할지 아직 결정은 못했습니다. (용어가 남발합니다만, 나중에 제가 보고 참고하기 위한 목적도 있습니다. 회의때 말씀해주시면 더 쉽게 설명드릴게요)

아직 사진이 없어서 저렇게만 선택이 됩니다. 저 뒤에 백그라운드로 사진을 넣어야겠죠. 일단 이게 사진이 됐든, 아이콘이 됐든 뒤에 넣을 게 필요합니다.

참, 그리고 폰트가 예쁘지 않죠... 저건 바꿀 수 있습니다. 프로그램 자체에 폰트를 내장시키면 되는데, 혹시 예쁜 무료 폰트가 있으면 적당히 구해주세요.

자, 그리고 이건 우리 디자이너께서 만들어주신 로고 파일입니다. 카톡으로 잠깐 보여드렸는데, 이런 식으로 일괄 적용이 됩니다. 앱 아이콘, Hover View, 스플래시 스크린 등에서 뜰 겁니다.

마이크로소프트 개발자 센터입니다. 저는 이미 일정액을 내고 50년치(...) 개발자 라이센스를 얻었고, 스토어에 예약한 앱은 총 네 개입니다. GGHS Conet은 빼버릴까봐요. 꼬넷 개발이 끝나면 바로 올릴 생각입니다. 그럼 여기서 다운로드 수를 비롯한 정보들을 확인할 수 있어요.

자.. 메인페이지가 끝나는 대로 이 서브페이지들을 완성해야 합니다. 여기서 보이는 ~Page.xaml 파일과 ~Page.xaml.cs 파일이 각각 페이지 디자인, 페이지 구현 파일입니다. 메인페이지가 끝나면 이제 각각의 페이지를 만들어야겠죠.

아, 페이지 넘어가는 건 이미 구현이 끝났어요. 메인 페이지에서 해당 카테고리를 선택하면 그 카테고리 페이지가 띄워집니다. 물론, 아직까진 빈칸이기 때문에 디자인이 시급하지만요.


현재 시각....9월 25일 오전 0시 22분...

자야겠어요. 아무튼, 다음 시간에 할 것들은 이렇습니다. 간단하게 생각해오는 것도 좋겠네요.

1. 메인페이지에 넣을 사진/아이콘 제작 또는 구해오기

2. 앱 디자인에 사용할 무료 폰트 구해오기 (선택)

3. 카테고리별 페이지 디자인

4. 추가 기능 개발

반응형