프로젝트기획서 1. 프로젝트개요 프로젝트명개발기간개발인원개발환경 Basketball Matching, Shop 2018년 2월 1일 ~ 2018년 2월 11일 총원 4명 Design 김응길 역할분담 Frontend 김응길, 유혁준 Backend 김응길, 이준규, 이용규, 유혁준 OS Windows 7, windows 10 DB Oracle 10g Development Tools Eclipse, SQL Developer Backend Java, Servlet/JSP, Spring, MyBatis, EL, JSTL 사용기술 ( 언어 ) Frontend HTML, CSS3, XML, JavaScript, Jquery, Bootstrap, Ajax, Angular.js 2. 프로젝트기획의도 앉아있는시간이많은현대인은중고등학생부터청장년층까지운동에대한필요가많고많은사람들이스포츠를즐길기회를원하고있다. 하지만인원이많이필요한스포츠에대해서기회를찾지만사람이없어서운동을하지못하는경우가자주있다. 그에반해이런필요를채우기위한스포츠커뮤티니사이트의공급은부족한실정이다. 우리는이런필요에발맞추어스포츠인들이농구경기를위해서직관적이고편리하게팀을꾸리고경기를매칭할수있는농구커뮤티니사이트를기획하였다. 3. 프로젝트개인별역할 구성원김응길유혁준조원명이용규이준규 분담역할 Backend 개발 (User, Gallery), 전체적인 Frontend 개발조장, Backend 개발 (match,shop), Frontend 개발 (Team) Backend 개발 (match,team,join) Backend 개발 (shop,cart,order)
4. 프로젝트개발일정 ( 스케줄표 ) 상세추진일정 ( 기술정보 ) 분석및설계 개발 시험운영 일정 조직구성 주제선정 사용자요구파악프로세스설계 기본설계 업무절차설계 프로세스설계 상세설계 DB 설계 화면설계 프로그램사양 프로그래밍 공통모듈작성 단위업무별코딩로그인 회원가입 마이페이지 메인페이지 TEAM MATCH SHOP CART ORDER GALLERY 설치및통합 설치 통합시험 2 월 1 2 3 4 5 6 7 8 9 10 11 12
5. 시스템설계기술서 * 프로젝트정의및범위농구매칭을할때개인과개인이직접경기를잡아야하고상대팀의실력을모르는상태에서경기밸런스문제의번거로움을개선하기위해각팀의정보와개인의실력을알수있는커뮤니티시스템이필요합니다. 로그인, 회원가입, 회원정보수정및열람팀만들기, 팀가입신청및수락하기, 경기매칭신청및수락하기, 팀리스트및멤버리스트 특히나개인이경기를했을시팀을구해야하는문재를해결하기위해간편하게원하는지역의팀의팀장에게개인이팀원신청을할수있게하여쉽게팀에가입경기를할수있게하고또한팀장은팀가입신청을받아팀에필요한포지션선수의신장을보고팀의경기력을향상시킬수있는기회를다양한방법을구상할수있습니다. 각팀의팀장은상대의경기전적그리고상대가경기했던경기의점수내용을보고자기와맞는수준의팀에매칭신청을할수있게하고매칭신청을받는팀장또한자신이매칭신청받은팀의실력을보고원하는팀과경기를할수있습니다. 농구경기에필요한다양한용품을구매할수있는서비스를통해농구공농구복농구화손목보호대등다양한물건들을포인트를통해구매할수있게만들었습니다. 요구분석 ( 기능 ) Main page user Match Team 분석내용 -main page: 메인페이지에서는승수가높팀을순서대로보여준다그리고 shop의최근올라온물건최근match 기록을볼수있다 team,match, shop,gallery 의링크가걸려있다상단의회원가입과로그인버튼으로로그인, 회원가입을할수있다 - 로그인 : 회원가입한정보와로그인한정보를비교하여로그인을실행한다. 비로그인사용자는인증이필요한모듈을사용할수없다. -Match : 매칭경기를신청할때상대팀정보에서경기신청을한다신청시에경기장소날짜를입력하고경기신청확인을누른다이때매칭을신청한팀은 awayteam 매칭신청을받은팀은 hometeam으로들어간다목록에는경기가종료된경기의정보와경기시작전경기정보를볼수있고매칭정보창에는매칭이성사된 2개의팀의의팀원경기장소경기날자를볼수있다 -Match detail: 매칭디테일페이지로가면각팀의팀원의포지션정보와승률을볼수있고경기점수를입력한후에점수가높은팀은승리와총경기수가올라가고점수가낮은팀은패와총경기수가올라간다 - team: 팀페이지에서팀의대표사진또는엠블럼과팀의주경기장팀명을적어팀을생성하면팀리스트에생성한팀을보여준다팀정보목록에는팀의주경기장과팀의엠블럼팀원의구과포지션등팀원의정보매칭신청버튼과개인의팀신청버튼이있다여기서매칭신청버튼은다른팀의팀장에게만뜨고팀신청버튼은팀이없는회원에게만보인다팀의팀장의아이디로로그인시매칭을신청한팀의정보와매칭승낙거절을볼수있고승낙을하면매칭정보창으로넘어간다팀가입신청한예비팀원의정보팀가입승낙거절을할수있다
- join: 개인이원하는팀에팀을신청하면팀장에게신청한예비팀원의아이디이름신장포지션구력정보를제공하고팀원으로받거나거절할수있다 SHOP 로그인한회원만상품목록페이지제공로그인안한회원은로그인페이지로자동이동 - 상품올리기 버튼클릭시상품올리기페이지로이동 - 상품올리기페이지에서정보입력후상품등록가능상품리스트에마우스하버시 VIEW, ZOOM 버튼활성화되고 ZOOM 버튼클릭시확대된사진정보확인가능 VIEW 버튼클릭시나타나는모달창에서상품의상세정보확인가능 VIEW 모달창에서상품이미지에마우스하버시이미지확대가능, 상품사이즈와수량선택후주문가능주문하면 cart 테이블에자동추가 - 상품리스트에있는 ADD TO CART 버튼을눌러도 cart 테이블에추가가능 - 사이드카테고리선택시해당상품목록만제공 - 페이징처리로한페이지당 6 개의상품만제공 cart order Gallery - 로그인한아이디를이용해서 cart table 에담겨있는상품정보를불러와서주문상품확인가능 - 불러온상품목록의총구매가격을확인가능 - 목록에서금액옆에 X 모양의글리피콘을통해서해당상품취소가능 - 카트에담은상품정보를확인하고 total-price 밑에 CHECK-OUT 버튼을통해 order table 에추가가능 - 로그인한회원의아이디를사용해 OrderList에구매자주소를가저올수있음 - 카트에서주문한상품목록을볼수있는페이지로회원아이디를이용해 DB에서주문한상품목록을불러옴 -gallerry: 회원이사진을올리고그목록을볼수있다사진을업로드시사진이름원하는카테고리를설정하여올린다사진리스트페이지에서는사진의크기와비율에맞추어사진목록들을보여준다또한각각에카테고리를모아서볼수있다 6. DB 설계 (DataBase 기술서 ) 전체구성도
USER - SHOP - CART - ORDER USER - TEAM - MATCHING - JOINLIST - GALLERY
7. 프로젝트주요기능 ( 인터페이스기술서 ) MAIN 팀, 매치, 샵에있는리스트들을메인에출력
회원가입 angular.js 를이용한정규표현식적용 아이디중복확인기능적용 다음주소 api 를사용하여주소검색가능 로그인 localstorage 를사용한아이디저장기능적용
회원정보 회원가입시입력한정보확인 돈 부분은우측에충전버튼을눌러원하는금액만큼충전가능 잔액충전 angular.js 를이용하여금액제한설정 최대금액이상충전시충전이불가능하다는경고창표시
TEAM 리스트 생성된팀의승수가많은순으로팀목록리스트에보여준다 팀생성시지역팀이름엠뷸럼혹은팀사진을넣어준다 TEAM 디테일 팀디테일페이지중앙에팀사진혹은팀로고를보여주고우측에팀원의포지션구력등팀목록을보여준다 팀가입이안된회원은팀가입버튼이생성되고팀의팀장의아이디로로그인시 팀가입신청을확인할수있다그리고다른팀의매칭신청을수락거절할수있다 다른팀의팀장아이디로로그인하면현제보여주는팀에게매칭신청을할수있다
MATCH 리스트 매칭이완료되거나매칭신청을한목록을볼수있다매칭신청을완료하지않았으면매칭디테일페이지를볼수없다 MATCH 디테일 - 경기종료 매칭디테일페이지에는각팀의앰블럼아래에팀원의이름과포지션을볼수있고그팀의승수와경기의현재경기의패배혹은승리현황을볼수잇다 매칭페이지중앙에는매치정보를볼수있는데매칭장소매칭날짜를볼수있다 그아래에는홈팀의팀장이점수를입력하고그점수를통해홈팀어웨이팀의승리패배를결정한다 매칭신청시매칭신청한팀은어웨이팀이고매칭신청을받은팀은홈팀으로들어간다
SHOP 리스트 shop 리스트는회원한명이올릴물건의재고물건의이름사진사이즈를올릴수있고물건들은각각의카테고리별로보여준다 SHOP 디테일 회원이물건을구매하고자할때사진에마우스를올리면물건사진을확대해볼수있고물건을장바구니에올린다
장바구니 회원의장바구니를들어가면구매를원하는물품과물품의수량총가격을볼수있다 구매하기버튼을누르면물품의재고수량이줄어들고가격만큼회원의보유마일리지가줄어든다