무지개가게 어플c o d ing & d e s ign

2011.03.11

By팝쇼핑

①②③④⑤⑥

① ②

③ ④ ⑤

icon 시안

총 5 개 아이콘 시안 제작

>5 가지 시안 중 선택 요청 .

또는 다른 모양의 아이콘을 원하시 는 경우

관련 이미지를 첨부하여 알려주시 면

최대한 참고하여 추가 제작하도록하겠습니다 .

* 관련 이미지 예시 ; 다른 어플의 아이콘 또는 정사각형 사이즈로 제작이 가능한 관련 이미

지

intro 화면 시안

무지개가게 어플 아이콘을 클릭하 여 프로그램 최초 실행시 잠시 보

여지는 intro 화면 시안입니다 .

기존의 무지개가게 책자 표지를 참고하여 밝고 젊은 느낌으로 재해

석하였습니다 .

* 참고로 본 어플의 디자인은 한국예술종합학 교 디자인과 4 학년 박초희양이 수고해 주셨습니다 .

이전 intro 화면

home 화면 시안

무지개가게 어플이 실행된 첫화면입니다 .

어플을 실행할 때 마다 무지개 가게3 곳이 무순서로 노출됩니다 . > 가독성과 디자인을 고려하여 컨텐츠를 편집

할 예정입니다 .

하단에는 무지개가게 찾기 , 소개 , 기부하기 3 가지 주메뉴가 버튼 형

식으로 위치합니다 . > 버튼 디자인을 좀 더 어울리도록 수정할 예정입니다 .

그리고 가장 아래부분에는 어플의 기능에 따라 탭바가 위치합니다 .

(컨텐츠 /검색 / GPS/즐겨찾기 /credit)

무지개가게 상세 화면 시안-홈 > 무지개가게-홈 > 무지개가게 찾기 >구 > 무지개가게 리스트

무지개가게 찾기와 홈화면 랜덤리 스트에서 클릭시 노출되는 무지개

가게 상세 컨텐츠 화면입니다 .

사진 1~3장 ( 최대 3장 )

위치확인 (google map 연동 )통화하기 ( 아이폰내 전화기능 연동)

관심가게 등록 ( 탭바 `관심가게 `등록 )

업체 상세 정보 (Exel 입력 데이터 )> 가독성을 고려하여 편집 예정입니다 .> 한 줄 설명은 약 30 자정도로 입력해주시기바랍니다 .

메뉴 (서비스 ) 보러가기 (Exel 입 력 데이터 )

>`업체상세정보 ` 내 키워드와 중복되는 데이 터가 존재하여 버튼과 메뉴를 삭제한 후 시안

을 보내드리겠습니다 .

사진 클릭시 확대화면

세부 메뉴 (서비스 ) 목록 화면

업체상세정보 (업종 , 분류 , 주 소 등 ) 외 추가로 Exel 에 입력

되는 데이터로 데이터 수집의 에로점과 가격 데이터의 변동

가능성 그리고 `키워드 `항 목과의 중복으로

메뉴 삭제를 검토하고 있습니다 .

[메뉴 (서비스 )보러가기 ] 삭 제 된 화면으로 개발하여 시안 을 보내드리겠습니다 .. 검토요청드립니다 .

무지개가게 찾기를 실행하면 화면처럼

표시됩니다 .

첫 화면에는 전체 지역이 표시됩니다 .

각 지역을 누르면 해당 구들만 표시됩니

다 .

` 무지개가게 찾기 ` 버튼 클릭 후 화면 이동

윙스푼 어플의 화면 이동을 참고로 제작하였습니다 .

무지개가게 찾기 ( 두번째 화면 ) 에서 초기 설정값은 모든 구가 표시되며 , 강북지역 , 강남지역 , 기타지 역 클릭시 해당 지역 구 리스트가 노출됩니다 .

세번째 화면에서 무지개 가게의 대표사진 1장 , 가게명 외 추가 정보가 표시될 예정입니다 . ( 업종 또는주소 )

` 무지개가게 소개 ` 버튼 클릭 후 화면 이동

마이크로크레딧에 대한 소개와 사회연대은행에 대한 컨텐츠 소개 페이지 입니다 .

마이크로크레딧과 사회연대은행 컨텐츠는 사회연대은행 홍보팀에서 제작해 주시기로 하셨습니다 . (가 급적 빠른 시일내 제작하여 전달해주시기 부탁 드립니다 . 이미지 사이즈는 가로 640pixel 세로 712pixel

입니다 .( 스크롤 없는 화면 기준 , 세로 사이즈는 712pixel 을 초과하더라도 스크롤 기능을 통해 구현이가능합니다 .)

주변가게 (GPS연동 ) 화면 예시

본 기능은 apple developer 등록 후 실기기 (GPS 가 내장된 iphone)

에서 개발과 테스트가 가능한 부분 으로

사회연대은행에서 개발자 등록confirm mail 수신 후 해당 개발자id 와 pw 를 알려주시면 개발이 진

행될 예정입니다 .

`관심가게 ` 탭바 클릭 후 화면 이동

무지개가게 상세 페이지 에서 ` 관심가게 등록 ` 후 탭바 에서 관심가게 목록을 관리 (편집 ) 하는 화면입니다 .

`정보 ` 탭바 화면 구성 예시

탭바 `정보 ` 클릭시 어플관련 정보 (copyright, Ver, 주소 , 연락처 , 만든이 정보 ) 가 노출됩니다 .

윙스푼 app`기타 ` 화면 하철이 app`회사정보 `화면