Drawing Program For Kid s Education 어린이교육용그림판
1. Refine Notes 2. GUI Interface 3 Real Use Case + Sequence Diagram 4. System Architecture 5. Design Class Diagram
01 Refine Notes(1/6) 1.Use Case 수정 점수파일저장하기, 점수파일불러오기, 등수표시, 사용자정보, 점수환산하기, 밑그림불러오기 도형선택하기, 도형색채우기, 도형그리기 색 1 선택하기, 색 2 선택하기 2.Use Case 삭제 => UseCase 를 19 개에서 13 개로수정 3
01 Refine Notes(2/6) 3. Business Concept Model 수정 4. Business Concept Model 삭제 5. Business Concept Model 추가 4
01 Refine Notes(3/6) 수정되기전 UseCase Diagram 5
01 Refine Notes(4/6) 수정된후 UseCase Diagram 6
01 Refine Notes(5/6) 수정되기전 Business Concept Model 7
01 Refine Notes(6/6) 수정된후 Business Concept Model 8
02 GUI Interface(1/4) 메뉴 패널 9
02 GUI Interface(2/4) 10
02 GUI Interface(3/4) 밑그림목록 11
02 GUI Interface(4/4) 밑그림 성적 12
Real Use Case Use Case Actor Purpose Overview Type Cross Reference 도형그리기 User 사용자가도형을그린다 도형을그리면화면에나타낸다 Primary and Essential System Functions : R1.1.1, R1.2.1, R1.2.3 Use Case : 도구굵기선택하기, 색고르기 Pre-Requisites 도구의굵기, 색 1, 색 2 가설정되어있어야한다. Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에있는도형그리기도구에서원, 사각형, 직선중하나를선택한다. 2. (S) : 시스템이 shapenum 값을설정한다. 3. (A) : 사용자가 Menu 에있는색채우기옵션을설정한다. 4. (S) : 시스템이 fillstate 값을설정한다. 5. (A) : 사용자가 Panel 의 Image 에원하는지점에서부터드래그하여도형을그린다. 6. (S) : 시스템이사용자가그린도형을 Panel 의 Image 에출력한다. Alternative Courses of Events Exceptional Courses of Events 13
Sequence Diagram 14
Real Use Case Use Case Actor Purpose Overview Type Cross Reference 연필그리기 User 사용자가연필도구로그림을그린다 연필도구로그림을그리면화면에나타낸다 Primary and Essential System Functions : R1.1.2, R1.2.1, R1.2.3 Use Case : 연필그리기, 도구굵기선택하기, 색고르기 Pre-Requisites 도구의굵기, 색 1 이설정되어있어야한다. Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에있는연필도구를선택한다. 2. (A) : 사용자가 Panel 의 Image 에원하는지점에서부터드래그하여선을그린다. 3. (S) : 시스템이사용자가선을 Panel 의 Image 에출력한다 Alternative Courses of Events Exceptional Courses of Events 15
Sequence Diagram 16
Real Use Case Use Case Actor Purpose Overview Type Cross Reference 텍스트삽입하기 User 사용자가텍스트도구로텍스트를삽입한다 텍스트도구로텍스트를삽입하면그림에나타낸다 Primary and Essential System Functions : R1.1.4, R1.2.3 Use Case : 텍스트삽입하기, 색고르기 Pre-Requisites 색 1 이설정되어있어야한다. Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에있는텍스트도구를선택한다 2. (A) : 사용자가 Panel 의 Image 에원하는지점에클릭하여텍스트를삽입한다 3. (A) : 사용자가원하는텍스트크기를설정한다. 4. (A) : 사용자가텍스트를입력한다. 3. (S) : 시스템이사용자가삽입한텍스트를 Panel 의 Image 에출력한다. Alternative Courses of Events Exceptional Courses of Events 17
Sequence Diagram 18
Real Use Case Use Case Actor 색골라내기 User Purpose 사용자가색골라내기도구로해당색을골라낸다. Overview Type Cross Reference 사용자가원하는색부분을선택하면, 시스템이선택한부분의색을사용자에게제공한다. 골라낸색을 color1 혹은 color2를저장한다. Primary and Essential System Functions : R.1.1.6, R1.2.3 Use Case : 색고르기 Pre-Requisites Typical Courses of Events 색 1 혹은색 2 가설정되어있어야한다 (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에있는스포이드도구를선택한다. 2. (A) : 사용자가 Panel 에출력된 Image 중, 골라내고자하는색이있는부분을클릭한다. 3. (S) : 시스템이골라낸색상으로 color1( 혹은 color2) 을설정한다. 4. (S) : 시스템이 Menu 에있는색 1( 혹은색 2) 의버튼을변경된색으로수정하여나타낸다. Alternative Courses of Events Exceptional Courses of Events 19
Sequence Diagram 20
Real Use Case Use Case Actor 도구굵기선택하기 User Purpose 사용자가도구의굵기를선택한다. Overview Type Cross Reference 사용자가도구의굵기를선택하면, 시스템이도구의굵기를사용자가선택한수치로설정한다. 선택한굵기로 Thickness를설정한다. Primary and Essential System Functions : R1.1.1, R1.1.2, R1.1.5 Use Case : 도형그리기, 연필그리기, 지우개로지우기 Pre-Requisites Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 의굵기버튼을클릭한다. 2. (S) : 시스템이 4 가지종류의굵기버튼을나타낸다. 3. (A) : 사용자가굵기종류를선택한다. 4. (S) : 시스템이선택한종류의굵기로 Thickness 값을설정한다. Alternative Courses of Events Exceptional Courses of Events 21
Sequence Diagram 22
Real Use Case Use Case Actor Purpose Overview Type Cross Reference Pre-Requisites Typical Courses of Events 색종류선택하기 User 사용자가색종류를선택한다 사용자가색종류를선택하면, 시스템이선택된색종류를현재의색종류로설정한다. Primary and Essential System Functions : R1.2.2 Use Case : 색종류선택하기 (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에있는색 1 버튼혹은색 2 버튼을선택한다. 2. (S) : 시스템이선택한종류로 colorstate 값을설정한다. Alternative Courses of Events Exceptional Courses of Events 23
Sequence Diagram 24
Real Use Case Use Case Actor 색고르기 User Purpose 사용자가색상을고른다. Overview Type Cross Reference 사용자가색을선택하면, 시스템이사용자가선택한색을현재의 ' 색 ' 으로설정한다. Primary and Essential System Functions : R1.2.3 Use Case : 색고르기 Pre-Requisites Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에있는대표색버튼을선택하거나, 색편집버튼을눌러임의의색을선택한다. 2. (S) : 시스템이선택한색으로 color 값을설정한다. 3. (S) : 시스템이 Menu 에있는현재선택된색종류의색을변경된색으로수정하여화면에나타낸다. Alternative Courses of Events Exceptional Courses of Events 25
Sequence Diagram 26
Real Use Case Use Case Actor Purpose Overview Type 저장하기 User 사용자가그림을저장한다 저장하기요청을받아서, 그림을저장한다 Primary and Essential Cross Reference System Functions : R2.1 Use Case : 저장하기 Pre-Requisites Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에서저장하기버튼을클릭한다. 2. (S) : 시스템이저장하기창을화면에출력한다. 3. (A) : 사용자가저장하기창에그림파일경로와이름을설정한다. 4. (S) : 시스템이 filepath 가적합한지검사한다. 5. (S) : 시스템이 filename 이중복되는지검사한다. 6. (S) : 시스템이해당경로와이름으로파일을저장한다. Alternative Courses of Events Exceptional Courses of Events 1. 이름이올바르게설정되지않으면 wrong filename 에러를출력한다. 2. 경로가올바르게설정되지않으면 wrong filepath 에러를출력한다. 27
Sequence Diagram 28
Real Use Case Use Case Actor 불러오기 User Purpose 사용자가그림을불러온다. Overview Type 불러오기요청을받아서, 그림을불러온다 Primary and Essential Cross Reference System Functions : R2.2 Use Case : 불러오기 Pre-Requisites Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 에서불러오기버튼을클릭한다. 2. (S) : 시스템이불러오기창을화면에출력한다. 3. (A) : 사용자가불러오기창에서그림경로를선택한다. 4. (A) : 사용자가불러오기창에서그림이름을선택한다. 5. (S) : 시스템이 filename 을가진파일이존재하는지검사한다. 6. (S) : 시스템이해당파일이그림파일인지검사한다. 7.(S) : 시스템이해당그림을불러와서 Panel 에출력한다. Alternative Courses of Events Exceptional Courses of Events 불러올파일이그림형식이아니거나존재하지않는경우에러를출력 29
Sequence Diagram 30
Real Use Case Use Case Actor 게임시작하기 User Purpose 게임을시작한다. Overview 사용자가게임을시작한다. 사용자가사용자정보를입력한다. 사용자가밑그림을선택한다. Type Primary and Essential Cross Reference System Functions : R3.1, R3.2 Use Case : 게임시작하기, 채점하기 Pre-Requisites Typical Courses of Events Alternative Courses of Events Exceptional Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu에서색칠공부게임버튼을클릭한다. 2. (S) : 시스템이게임시작전경고창을출력한다 3. (A) : 사용자가 색칠공부게임경고창 의 계속 버튼을클릭한다 4. (S) : 시스템이현재 panel의 Image를삭제한다 5. (S) : 시스템이 사용자정보입력창 을화면에출력한다. 6. (A) : 사용자가 사용자정보입력창 에사용자이름을입력하고 확인 버튼을클릭한다. 7. (S) : 시스템이사용자이름을 UserName::userinfo에저장한다. 8. (S) : 시스템이 밑그림선택창 을화면에출력한다. 9. (A) : 사용자가 밑그림선택창 에서밑그림을선택하고 확인 버튼을클릭한다. 10.(S) : 시스템이밑그림을불러와서 panel에출력한다. 취소 버튼을클릭시게임을시작하지않는다선택한밑그림이없는경우에러를출력 31
Sequence Diagram 32
Real Use Case Use Case Actor Purpose 채점하기 User 사용자가그린그림의채점결과를나타낸다 Overview 사용자가그린그림과밑그림을비교하여점수를환산한다. 해당점수로순위를계산한다. 계산한순위와점수를화면에출력한다. Type Primary and Essential Cross Reference System Functions : R3.1, R3.2 Use Case : 게임시작하기, 채점하기 Pre-Requisites 게임이시작된상태여야한다. Typical Courses of Events (A) : Actor, (S) : System 1. (A) : 사용자가 Menu 의채점하기버튼을클릭한다. 2. (S) : 시스템이밑그림과사용자가그린그림에서각픽셀의 R,G,B 값을비교하여일치하는픽셀 / 전체픽셀 *100 을하여점수를 Score 에저장한다. 3. (S) : 시스템이기존의성적파일을불러온다. 4. (S) : 시스템이기존의성적파일과 Score 를비교하여등수를계산하여성적파일을갱신한다. 5. (S) : 시스템이성적파일의내용을 채점결과창 에출력한다. Alternative Courses of Events Exceptional Courses of Events 33
Sequence Diagram 34
04 System Architecture DPKE PaintTool FileIO Interface Vertex -text: Text -color1: Color -color2: Color -thickness: Thickness -colorstate: int +shape: Shape +setcolorstate(num: int): void +getshape(): Shape +gettext(): Text +getcolor1(): Color +getcolor2(): Color +getthickness(): Thickness +getcolorstate(): int +setcolor1(c: Color): void +setcolor2(c: Color): void -score: int -rank: int -username: String UserInfo +setscore(_score: int): void +getscore(): int +setrank(_rank: int): void +getrank(): int +getusername(): String +setusername(_username: String): void -filename: String -filepath: String +setfilename(filename: String): void +getfilename(): String +setfilepath(filepath: String): void +getfilepath(): String +checksavefile(filename: String, filepath: String) +checkloadfile(filename: String, filepath: String) ImageFileIO +SaveImage(img: BufferedImage): void +LoadImage(img: BufferedImage): void TextFileIO +SaveText(userinfo: ArrayList<UserInfo>): void +LoadText(userinfo: ArrayList<UserInfo>): void PaintGame -userinfo: ArrayList<UserInfo> -sketch: Sketch -imagefileio: ImageFileIO -textfileio: TextFileIO -painttool: PaintTool -paintgame: PaintGame -image: Image -imagefileio: ImageFileIO -vertex: ArrayList<Vertex> +SelectShape(_shapenum: int): void +SelectFillColor(_fillstate: boolean): void +DrawShape(): void +DrawWithPencil(): void +Fill_Color(): void +WriteText(): void +Eraser(): void +UseSpuit(): void +SelectThickness(): void +SelectColorState(num: int): void +SelectColor(c: Color): void +Save(): void +Load(): void +ShowPaint(): void +ShowSketch(): void +ShowSaveWin(): void +ShowLoadWin() +ShowUserInfoWin() +ShowSketchWin() +ShowScoreWin() +ShowPopup(str: String): void +throw(num: int) +throw(str: String) +throw(filename: String, filepath: String) -x: int -y: int +setx(_x: int): void +sety(_y: int): void +getx(): int +gety(): int -thicknum: int Thickness +setthicknum(_thinknum: int): void +getthicknum(): int Image -bimg: BufferedImage -shapenum: int -fillstate: boolean Shape +setshapenum(_shapenum: int): void +getshapenum(): int +setfillstate(_fillstate: boolean): void +getfillstate(): boolean +EnterUserInfo(): void +SelectSketch(): void +RequestResult(): void +CalculateScore(): int +SortScore(): void +ShowScore(): void +getuserinfo(): ArrayList<UserInfo> +getimagefileio(): ImageFileIO +icon: ImageIcon Sketch +setsketch(icon: ImageIcon): void +getsketch(): ImageIcon 35
05 Design Class Diagram 36