SlideShare a Scribd company logo
1 of 76
Download to read offline
เว็บไซต์น้ ายาทาเล็บ

                           (Nail Shop)




                               โดย

      1.      นางสาวกนกพรรณ ตราช่าง           รหัส 51039908

      2.      นางสาวอาไพรัตน์ นิลพังงา        รหัส 51036181




 โครงงานนี้เป็ นส่ วนหนึ่งของการศึกษาตามหลักสู ตรวิทยาศาตร์ บณทิต
                                                             ั

ภาควิชาเทคโนโลยีสารสนเทศและการสื่ อสาร คณะเทคโนโลยีสารสนเทศ

                       มหาวิทยาลัยศรี ปทุม

                            พ.ศ.2555
ก



                                             มหาวิทยาลัยศรี ปทุม

                                         คณะเทคโนโลยีสารสนเทศ

                                                   โครงงานของ

                         ชื่อ........................................... รหัส................

                         ชื่อ........................................... รหัส................

                                                         เรื่ อง

                     ...............................................................................

                   ได้ รับตรวจสอบและอนุมตให้ เป็ นส่วนหนึงของการศึกษาตาม
                                        ัิ               ่

           หลักสูตรวิทยาศาสตร์ บณฑิต สาขาเทคโนโลยีสารสนเทศและการสื่อสาร
                                ั

                                    เมื่อวันที่ ...................................

ประธานกรรมการ                                                                           ........................................

                                                                                        (                                    )
กรรมการ                                                                                 .........................................

                                                                                        (                                     )
อาจารย์ที่ปรึกษา                                                                         ........................................

                                                                                        (                                     )
กรรมการและเลขานุการ                                                                      .........................................

                                                                                            (                                    )
ข



บทคัดย่ อ                     เว็บไซต์น ้ายาทาเล็บ (Nail Shop)

โดย                           1. นางสาวกนกพรรณ ตราช่าง           รหัส 51039908

                              2. นางสาวอาไพรัตน์ นิลพังงา        รหัส 51036181

อาจารย์ ท่ ปรึกษา
           ี                  ดร.วสุวรรธน์ พงศ์ขจร

___________________________________________________________________________

            ปั จจุบนการใช้ ชีวิตประจาวันเป็ นไปอย่างเร่งรี บ การเลือกซื ้อสินค้ าออนไลน์จึงเป็ นที่นยมกันอย่าง
                   ั                                                                                ิ
แพร่หลายมากยิงขึ ้น ซึงเป็ นอีกหนึงทางเลือกที่สามารถเลือกซื ้อสินค้ าได้ สะดวกและประหยัดเวลาได้ อีกด้ วย แต่
             ่        ่           ่
อาจมีปัญหาที่ตามมา คือ สินค้ าที่เลือกซื ้อไม่เหมือนในเว็บไซต์ รวมถึงน ้ายาทาเล็บเช่นกัน ที่สในขวดเมื่อลองทา
                                                                                             ี
แล้ วไม่เหมือนที่คาดหวังไว้

            ดังนันเว็บไซต์น ้ายาทาเล็บ จึงมีเทคโนโลยีที่ให้ ผ้ ที่เลือกซื ้อน ้ายาทาเล็บสามารถทดลองสินค้ าก่อน
                 ้                                             ู
เลือกซื ้อได้ และสามารถเลือกผสมสีที่ต้องการได้ จากสีที่ทางเว็บไซต์กาหนดให้ นอกจากนันยังสามารเลือกสีผิว
                                                                                   ้
ของนิ ้วมือทีใกล้ เคียงกับผิวตัวเองมากที่สด ซึงจะทาให้ การเลือกซื ้อน ้ายาทาเล็บผ่านทางเว็บไซต์เป็ นทางเลือกที่
             ่                            ุ ่
เสมือนไปซื ้อหน้ าร้ าน และยังสะดวก รวดเร็วอีกด้ วย
ข




                                           กิตติกรรมประกาศ

            ทางคณะจัดทาเว็บไซต์น ้ายาทาเล็บ (Nail Shop) ขอขอบคุณ ดร.วสุวรรธน์ พงศ์ขจร อาจารย์ที่
ปรึกษาโครงงาน ที่ให้ คาแนะนาต่างๆ และให้ ข้อมูลในการจัดทาโครงงาน และขอขอบคุณอาจารย์ทกท่านที่ให้
                                                                                    ุ
ความร่วมมือ ให้ รายละเอียดต่างๆเกี่ยวกับโปรแกรมทีใช้ จดทาโครงงาน และขอขอบคุณ ผู้ที่มีสวนเกี่ยวข้ อง กับ
                                                 ่ ั                                  ่
เว็บไซต์น ้ายาทาเล็บ (Nail Shop) ทุกท่านที่ทาให้ โครงงานสาเร็จลุลวงไปด้ วยดี
                                                                 ่
ค



                                                        คานา

           ปั จจุบนโลกออนไลน์ได้ ก้าวหน้ าไปอย่างไม่หยุดยังและได้ กลายมาเป็ นส่วนหนึง ในการดาเนิน
                  ั                                       ้                         ่
ชีวิตประจาวันของมนุษย์ มีการใช้ งานอย่างแพร่หลายในหลายด้ าน ไม่วาจะเป็ นการรับข้ อมูลข่าวสาร การ
                                                                ่
เชื่อมต่อข้ อมูลการทางาน การพบปะสังคมออนไลน์ รวมไปถึงการเลือกซื ้อสินค้ าบนเว็บไซต์ และเป็ นที่นิยมกัน
อย่างแพร่หลาย เนื่องจากความสะดวกสบาย และการพัฒนาด้ านความปลอดภัยในการทาธุรกรรมบน
อินเตอร์ เน็ตที่สงขึ ้น จึงเป็ นสาเหตุให้ ร้านค้ าใหม่ๆบนอินเตอร์ เน็ตเกิดขึ ้นอย่างแพร่หลาย
                 ู

           เมื่อความต้ องการในโลกอินเตอร์ เน็ตสูงขึ ้น จึงเกิดการพัฒนาเว็บไซต์ขายสินค้ าน ้ายาทาเล็บ เพื่อให้
การขายสินค้ าควบคูไปกับเทคโนโลยีบนอินเตอร์ เน็ต เข้ าถึงกลุมลูกค้ ามากขึ ้น ไม่ต้องนังรถไปซื ้อที่
                  ่                                        ่                         ่
ห้ างสรรพสินค้ า หรื อร้ านตัวแทนจาหน่าย ก็สามารถซื ้อสินค้ าได้ เพียงแค่เข้ าระบบอินเตอร์ เน็ต ก็สามารถเลือก
ซื ้อสินค้ าที่ต้องการได้

           ข้ อมูลในโครงงานฉบับนี ้ เป็ นการรายงานถึงผลการศึกษาค้ นคว้ า การพัฒนาระบบเว็บไซต์น ้ายาทาเล็บ
ที่ผ้ ศกษาได้ นามารวบรวมไว้ ทงจากสือความรู้ และการสรุปการศึกษาด้ วยตนเอง หากมีข้อมูลใดผิดพลาดทาง
      ู ึ                    ั้    ่
ผู้จดทาขออภัย ณ ที่นี ้
    ั
ฉ



                                                สารบัญ

                                                         หน้ า

ใบอนุมติ
      ั                                                  ก

บทคัดย่อ                                                 ข

กิตติกรรมประกาศ                                          ค

คานา                                                     ง

สารบัญ                                                   จ

สารบัญรูป                                                ช

สารบัญตาราง                                              ญ

บทที่ 1 บทนา

           1.1      ภูมิหลังความเป็ นมา                  1

           1.2      วัตถุประสงค์                         1

           1.3      ขอบเขตการศึกษา                       2

           1.4       นิยามศัพท์เฉพาะ                     2

           1.5       ผลที่คาดว่าจะได้ รับ                3

           1.6      แผนการดาเนินงาน                      3

           1.7      เครื่ องมือที่คาดว่าจะใช้            5

บทที่ 2 เทคโนโลยีที่ใช้ ในการศึกษาโครงงาน

           2.1 แนวคิดและทฤษฎี                            6

           2.2 เทคโนโลยีที่ใช้                           6
ฉ



                                            สารบัญ (ต่ อ)

                                                                  หน้ า

บทที่ 3 การออกแบบระบบ

        3.1 การออกแบบกระบวนการเก็บและใช้ ข้อมูล                   17

        3.2 แผนภาพการทางาน (Flow Chart) ของเว็บไซต์น ้ายาทาเล็บ   18

        3.3 แผนภาพแสดงความสัมพันธ์ ระหว่างเอนทิตี ้และแอททิบวต์
                                                            ิ     25

        3.4 แผนภาพบริ บท(Context Diagram)                         29

        3.5 แผนภาพกระแสข้ อมูล(Dataflow Diagram)                  30

บทที่ 4 การพัฒนาโปรแกรม

       4.1 ผลของการศึกษา                                          32

       4.2 การแสดงผลของการพัฒนาโปรแกรมที่สาเร็ จแล้ ว             34

บทที่ 5 สรุปโครงงาน ปั ญหา และข้ อเสนอแนะ

       5.1 สรุ ปโครงงาน                                           41

       5.2 ข้ อจากัดของการศึกษา                                   41

       5.3 ข้ อเสนอแนะ                                            42

       5.4 เปรี ยบเทียบกับคูแข่ง
                            ่                                     42

บรรณานุกรม                                                        43

ภาคผนวก                                                           44

ภาคผนวก ก วิธีการติดตังโปรแกรม
                      ้                                           45

ประวัติผ้ จดทาโครงงาน
          ูั                                                      64
ฉ



                                               สารบัญรูป

รูปที่                                                                  หน้ า

รูปที่ 2.1 ภาพแสดงคาสังในการแสดงสินค้ า
                      ่                                                 7

รูปที่ 2.2 ภาพแสดงคาสังกาหนดรูปแบบบนหน้ าเว็บไซต์
                      ่                                                 8

รูปที่ 2.3 ภาพแสดงคาสังการตรวจสอบรหัสผ่านในการเข้ าสูระบบ
                      ่                              ่                  9

รูปที่ 2.4 ภาพแสดงการสร้ างหน้ าลองสินค้ าบนแฟลช                        10

รูปที่ 2.5 ภาพแสดงการจัดการฐานข้ อมูล                                   11

รูปที่ 2.6 ภาพแสดงการใช้ ภาษา SQL สาหรับการเพิ่ม-แก้ ไขข้ อมูลสินค้ า   12

รูปที่ 2.7 ภาพแสดงการใช้ ภาษา SQL สาหรับในการตรวจสอบ Username           13

รูปที่ 2.8 ภาพแสดงการใช้ ภาษา SQL สาหรับลบสินค้ าในฐานข้ อมูล           14

รูปที่ 2.9 ภาพแสดงการการเชื่อมต่อฐานข้ อมูล                             15

รูปที่ 2.10 ภาพแสดงการเพิ่ม-ลบสินค้ าในฐานข้ อมูล                       16

รูปที่ 3.1 แผนภาพการแสดงการทางานของ ผู้ใช้ ทวไป สมาชิก และ ผู้ดแลระบบ
                                            ั่                 ู        17

รูปที่ 3.2 แผนภาพ (Flow Chart) ของระบบเว็บไซต์น ้ายาทาเล็บ              18

รูปที่ 3.3 แผนภาพ (Flow Chart) ของการสมัครสมาชิก                        19

รูปที่ 3.4 แผนภาพ (Flow Chart) ของการตรวจสอบสถานการณ์เข้ าสูระบบ
                                                            ่           20

รูปที่ 3.5 แผนภาพ (Flow Chart) ส่วนการทางานของสมาชิก                    21

รูปที่ 3.6 แผนภาพ (Flow Chart) ส่วนการทางานของผู้ดแลระบบ
                                                  ู                     22

รูปที่ 3.7 แผนภาพ (Flow Chart) ของการทดลองสินค้ า                       23
ช



                                             สารบัญรูป(ต่ อ)

รูปที่                                                                                   หน้ า

รูปที่ 3.8 แผนภาพ (Flow Chart) ของการสังซื ้อสินค้ า
                                       ่                                                 24

รูปที่ 3.9 แผนภาพแสดงความสัมพันธ์ระหว่างเอนทิตี ้ (Entity )และแอททริ บิวต์ (Attribute)   25

รูปที่ 3.10 ภาพแสดงแผนภาพบริ บท (Context Diagram)                                        29

รูปที่ 3.11 ภาพแสดงการสมัครสมาชิก                                                        30

รูปที่ 3.12 ภาพแสดงการเข้ าสูระบบ
                             ่                                                           30

รูปที่ 3.13 ภาพแสดงการแก้ ไขข้ อมูลสมาชิก                                                30

รูปที่ 3.14 ภาพแสดงการทดลองสินค้ า                                                       31

รูปที่ 3.15 ภาพแสดงการสังซื ้อสินค้ า
                        ่                                                                31

รูปที่ 3.16 ภาพแสดงการวิเคราะห์การสังซื ้อ
                                    ่                                                    31

รูปที่ 4.1 แสดงหน้ าแรกของเว็บไซต์                                                       34

รูปที่ 4.2 การสมัครสมาชิก                                                                35

รูปที่ 4.3 แสดงหน้ าเข้ าสูระบบ
                           ่                                                             35

รูปที่ 4.4 แสดงหน้ าทดลองสินค้ า                                                         36

รูปที่ 4.5 แสดงการอัพเดทสินค้ า                                                          37

รูปที่ 4.6 แสดงการสังซื ้อสินค้ า
                    ่                                                                    37

รูปที่ 4.7 แสดงการแก้ ไขข้ อมูลสมาชิก                                                    38
ซ



                                             สารบัญรูป(ต่ อ)

รูปที่                                                         หน้ า

รูปที่ 4.8 แสดงวิธีการชาระเงิน                                 38

รูปที่ 4.9 แสดงข้ อมูลการติดต่อกับเว็บไซต์                     39

รูปที่ 4.10 แสดงประวัตการสังซื ้อ
                      ิ ่                                      39

รูปที่ 4.11 แสดงการแก้ ไขโปรโมชัน
                                ่                              40

รูปที่ 5.1 ภาพแสดงหน้ าโฮมเพจเว็บ ยาทาเล็บ.com                 42

รูปที่ ก 1.3.1 การติดตังโปรแกรม flash player
                       ้                                       45

รูปที่ ก 1.3.2 การติดตังโปรแกรม flash player
                       ้                                       46

รูปที่ ก 1.3.3 การติดตังโปรแกรม flash player
                       ้                                       46

รูปที่ ก 1.3.4 การติดตังโปรแกรม flash player
                       ้                                       47

รูปที่ ก 1.3.5 การติดตังโปรแกรม flash player
                       ้                                       47

รูปที่ ก 1.4.1 ภาพแสดงหน้ าโฮมเพจของ MAMP.info                 48

รูปที่ ก 1.4.2 ภาพแสดงการติดตังแอพพลิเคชัน
                              ้          ่                     49

รูปที่ ก 1.4.3 ภาพแสดงโฟลเดอร์ MAMP                            50

รูปที่ ก 1.4.4 ภาพแสดงกล่องถามสิทธิ์ในการติดตังโปรแกรม MAMP
                                              ้                50

รูปที่ ก 1.4.5 ภาพแสดงหน้ าต่าง MAMP                           51

รูปที่ ก 1.4.6 ภาพแสดงหน้ าการตังค่าของ MAMP
                                ้                              52
ฌ



                                                    สารบัญรูป(ต่ อ)

รูปที่                                                                         หน้ า

รูปที่ ก 1.4.7 ภาพแสดงหน้ าการตังค่าของ MAMP
                                ้                                              53

รูปที่ ก 1.4.8 ภาพแสดงหน้ าการตังค่าของ MAMP
                                ้                                              53

รูปที่ ก 1.5.1 ภาพแสดงหน้ าโฮมเพจของเว็บไซต์น ้ายาทาเล็บ                       54

รูปที่ ก 1.5.2 ภาพแสดงสินค้ าต่างๆ                                             55

รูปที่ ก 1.5.3 ภาพหน้ าตะกร้ าสินค้ า                                          55

รูปที่ ก 1.5.4 ภาพหน้ ากรอกข้ อมูลสมัครสมาชิก                                  56

รูปที่ ก 1.5.5 ภาพแสดงการตรวจสอบ username ว่าสามารถใช้ ได้ หรื อไม่            57

รูปที่ ก 1.5.6 ภาพตัวอย่างการกรอกข้ อมูลเพื่อสมัครสมาชิก                       57

รูปที่ ก 1.5.7 ภาพแสดงการล็อกอินเข้ าสูระบบ
                                       ่                                       58

รูปที่ ก 1.5.8 ภาพหน้ าตะกร้ าสินค้ า เมื่อผู้ใช้ มการซื ้อสินค้ า
                                                   ี                           59

รูปที่ ก 1.5.9 ภาพแสดงหน้ าลองสินค้ า                                          60

รูปที่ ก 1.5.10 ภาพแสดงการสังซื ้อสินค้ าในหน้ าทดลองสินค้ า
                            ่                                                  61

รูปที่ ก 1.5.11 ภาพแสดงการ tweet ลงในเว็บไซต์ twitter.com เพื่อแชร์ เว็บไซต์   62

รูปที่ ก 1.5.12 ภาพแสดงการแชร์ เว็บไซต์บน Google+                              62

รูปที่ ก 1.5.13 ภาพแสดงการแสดงความคิดเห็นโดยการเข้ าสูระบบเว็บ facebook.com
                                                      ่                        63
ญ



                                              สารบัญตาราง

ตารางที่                                                               หน้ า

ตารางที 1.1 ตารางแผนการดาเนินงาน                                       4

ตารางที่ 3.1 แสดงแฟ้ มข้ อมูลสมาชิก                                    26

ตารางที่ 3.2 แสดงแฟ้ มรายละเอียดการสังซื ้อ
                                     ่                                 26

ตารางที่ 3.3 แสดงแฟ้ มรายละเอียดการสังซื ้อ
                                     ่                                 27

ตารางที่ 3.4 แสดงแฟ้ มข้ อมูลสินค้ า                                   27

ตารางที่ 3.5 แสดงแฟ้ มข้ อมูลโปรโมชัน
                                    ่                                  28

ตารางที่ 4.1 แสดงกระบวนการทางานของ 1.0 กระบวนการสมัครสมาชิก            32

ตารางที่ 4.2 แสดงกระบวนการทางานของ 2.0 กระบวนการเข้ าสูระบบ
                                                       ่               32

ตารางที่ 4.3 แสดงกระบวนการทางานของ 3.0 กระบวนการแก้ ไขข้ อมูลส่วนตัว   32

ตารางที่ 4.4 แสดงกระบวนการทางานของ 4.0 กระบวนการทดลองสินค้ า           33

ตารางที่ 4.5 แสดงกระบวนการทางานของ 5.0 กระบวนการสังซื ้อสินค้ า
                                                  ่                    33

ตารางที่ 4.6 แสดงกระบวนการทางานของ 6.0 กระบวนการวิเคราะห์สนค้ าขายดี
                                                          ิ            33
บทที่ 1
                                             บทนา


1.1 ภูมิหลังความเป็ นมา
          ในปั จจุบนถือว่าผูหญิงมักมาคู่กบความสวยความงาม รวมไปถึงน้ ายาทาเล็บที่ทาให้เล็บ
                   ั        ้            ั
ของผูหญิงดูสะดุดตายิงขึ้น โดยส่ วนใหญ่ผหญิงในปั จจุบนมักทางานจึงไม่ค่อยมีเวลาในการออกไป
      ้                ่                    ู้           ั
เลือกซื้ อตามร้านสะดวกซื้ อหรื อตามห้างร้านค้าโดยทัวไป เราจึงนาอินเตอร์ เน็ตและเทคโนโลยีเข้า
                                                    ่
มาช่วยในด้านธุ รกิจการขายน้ ายาทาเล็บผ่านบนเว็บไซด์เพื่อดึงดูดลูกค้าและทาให้เกิดความ
                              ั ้
สะดวกสบายและรวดเร็ วให้กบผูที่สนใจสิ นค้าน้ ายาทาเล็บและมีความประสงค์ท่ีจะซื้ อน้ ายาทาเล็บ
สามารถสังซื้ อได้ทนทีโดยไม่ตองเสี ยเวลาไปซื้ อตามร้านในห้างสรรพสิ นค้าทัวไป
            ่        ั          ้                                          ่
          จึงมีการนาเทคโนโลยีอินเตอร์ เน็ตเข้ามาช่วยในการจัดทาสื่ อโฆษณานาเสนอสิ นค้าน้ ายาทา
เล็บเพื่อให้สินค้ามีความน่าสนใจและเป็ นจุดเด่นของทางร้านในการบริ การลูกค้า ลูกค้าสามารถ
เลือกสี ตามความต้องการของตนเองได้โดยใช้เทคโนโลยี Flash เข้ามาช่วยทาให้เว็บไซด์เกิดความ
น่าสนใจแบะดึงดูดลูกค้าให้เข้ามาสั่งซื้ อสิ นค้าของทางเว็บไซด์มากขึ้น



1.2 วัตถุประสงค์
        1.2.1 เพื่อนามาช่วยในเรื่ องของความสะดวกรวดเร็ ว เน้นเรื่ องการบริ การลูกค้า
        1.2.2 เพื่อเพิมความสามารถเพื่อให้ลูกค้าได้เลือกซื้ อสิ นค้าได้สะดวกมากยิงขึ้น
                      ่                                                         ่
        1.2.3 สามารถตอบสนองความต้องการของลูกค้าได้อย่างตรงจุด


1.3 ขอบเขตการศึกษา
        1.3.1 ส่ วนของผูใช้ทวไป
                        ้ ่ั
                         1.3.1.1 สามารถมองเห็นสิ นค้ารวมทั้งรายละเอียดของสิ นค้าได้
                                          ่
                         1.3.1.2 สามารถดูขาวสารของเว็บไซต์ได้
                        1.3.1.3 สามารถสมัครสมาชิกได้
2




        1.3.2 ส่ วนของสมาชิก
                        1.3.2.1 สามารถมองเห็นสิ นค้ารวมทั้งรายละเอียดของสิ นค้าได้
                        1.3.2.2 สามารถดูข่าวสารของเว็บไซต์ได้
                        1.3.2.3 สามารถลองสี น้ ายาทาเล็บบนเว็บไซต์ของทางร้านได้
                        1.3.2.4 สามารถสั่งซื้ อสิ นค้าบนเว็บไซต์ของทางร้านได้
                        1.3.2.5 สามารถผสมสี ที่ตองการเองได้
                                                ้
                        1.3.2.6 สามารถเลือกสี นิ้วที่ใกล้เคียงกับตัวเองนี้ได้กกกเองได้แ
                         11mflkkovmskjbf;lkmbmflml;d
        1.3.3 ส่ วนของผูดูแลระบบ
                        ้
                        1.3.3.1 สามารถมองเห็นสิ นค้ารวมทั้งรายละเอียดของสิ นค้าได้
                        1.3.3.2 สามารถดูข่าวสารของเว็บไซต์ได้
                        1.3.3.3 สามารถเพิ่ม แก้ไข ลบข้อมูลของสิ นค้าได้
                        1.3.3.4 สามารถลบสมาชิกในเว็บไซต์ได้

1.4 นิยามศัพท์เฉพาะ
        1.4.1 My SQL คือ ระบบจัดการฐานข้อมูลเชิงสัมพันธ์ โดยใช้ภาษา SQL
      1.4.2 PHP คือ ภาษาคอมพิวเตอร์ในลักษณะ Server-SideScript โดยลิขสิ ทธิ์ อยูในลักษณะ
                                                                               ่
โอเพนซอร์ส ภาษาPHP ใช้สาหรับจัดทาเว็บไซด์ และแสดงผลออกมาในรู ปแบบ HTML โดยมี
รากฐานโครงสร้างคาสั่งมาจากภาษา ภาษาซี ภาษาจาวา และภาษาเพิร์ล
            1.4.3 Ajax คือ กลุ่มของเทคนิคในการพัฒนาแอปพลิเคชัน เพื่อให้ความสามารถโต้ตอบกับ
                                                              ่
ผูใช้ดีข้ ึน โดยการรับส่ งข้อมูลฉากหลัง ทาให้ท้ งหน้าไม่ตองโหลดใหม่ทุกครั้งที่มีการเปลี่ยนแปลง
    ้                                           ั        ้
ซึ่ งช่วยทาให้เพิ่มการตอบสนอง ความรวดเร็ ว และการใช้งานโดยรวม
      1.4.4 JavaScript คือ ภาษาโปรแกรมประเภทหนึ่ง ที่เรี ยกกันว่า “สคริ ปต์” ซึ่งมีวธีการ
                                                                                    ิ
ทางานในลักษณะ “แปลความและดาเนินงานไปทีละคาสั่ง” ซึ่ งภาษานี้เดิมมีชื่อว่า LiveScript
3




       1.4.5 Flash คือ โปรแกรมที่มีความสามารถในด้านการสร้างภาพเคลื่อนไหว ที่ได้รับความ
นิยมมากที่สุดในปั จจุบน ซึ่ งได้พฒนาปรับปรุ งเครื่ องมือต่างๆให้มีความสามารถใช้งานได้สะดวก
                      ั          ั
สามารถใช้ผลิตสื่ อการสอนเชิงตอบโต้ได้

1.5 ประโยชน์ ทคาดว่าจะได้ รับ
              ี่
        1.5.1 ทาให้ได้รับความรู้ในการพัฒนาทางด้านการใช้ภาษา HTML
        1.5.2 นาความรู ้ที่ได้ไปใช้เป็ นพื้นฐานในการปฏิบติงานหรื อการประกอบอาชีพได้
                                                        ั
        1.5.3 เพื่อศึกษาออกแบบฐานข้อมูลการจัดเก็บสิ นค้าบนเว็บไซด์

1.6 แผนการดาเนินงาน
        1.6.1 ศึกษาแนวคิด ทฤษฏีและเอกสารที่เกี่ยวข้อง
        1.6.2 ศึกษาเทคโนโลยีที่จะใช้
        1.6.3 การระบุปัญหา
        1.6.4 การรวบรวมข้อมูลและการจัดการข้อมูล
        1.6.5 การวิเคราะห์ขอมูลหรื อการออกแบบระบบและโปรแกรม
                           ้
        1.6.6 การสร้างตัวแบบหรื อการพัฒนาโปรแกรม
        1.6.7 ทดสอบติดตั้งระบบหรื อการทดสอบตัวแบบ
        1.6.8 จัดทาเอกสาร
4




                                         ตารางแผนการดาเนินงาน



         ตารางแผนการดาเนินงาน                                               ระยะเวลาดาเนินการ
ลาดับ              กิจกรรม




                                                                            เม.ย.- 55

                                                                                        พ.ค.- 55
                                            ม.ค.- 55



                                                                มี.ค.- 55




                                                                                                                          ส.ค.- 55
                                                                                                   มิ.ย.- 55

                                                                                                               ก.ค.- 55



                                                                                                                                     ก.ย.- 55
                                                       ก.พ.55
 1      ศึกษาแนวคิด ทฤษฏีและเอกสารที่
        เกียวข้ อง
           ่
 2      ศึกษาเทคโนโลยีทจะใช้
                          ี่
 3      การระบุปัญหา
 4      การรวบรวมข้ อมูลและการจัดการ
        ข้ อมูล
 5      การวิเคราะห์ ข้อมูลหรือการออกแบบ
        ระบบและโปรแกรม
 6      การสร้ างตัวแบบหรือการพัฒนา
        โปรแกรม
 7      ทดสอบการติดตั้งระบบหรือการ
        ทดสอบตัวแบบ
 8      จัดทาเอกสาร
                                     ตารางที 1.1 ตารางแผนการดาเนินงาน
         หมายเหตุ              หมายถึง ระยะเวลาดาเนินการ
5




1.7 เครื่องมือทีคาดว่าจะใช้
                ่
        1.7.1 อุปกรณ์คอมพิวเตอร์ที่ใช้ในการทาโครงงาน
                1.7.1.1 Macbook Pro 13 Inc. GHz intel Core i5 4GB 1333 MHz DDR3
        Macintosh HD 256GB
                1.7.1.2 เครื่ องพิมพ์ปริ้ นเตอร์
        1.7.2 โปรแกรมที่สั่งงาน
                 1.7.2.1 ระบบปฏิบติการ Mac OS X version 10.6.8
                                 ั
                 1.7.2.2 ระบบปฏิบติการ Window7 Ultimate
                                 ั
                 1.7.2.3 ฐานข้อมูล My SQL
                 1.7.2.4 โปรแกรม Adobe Photoshop CS5
                 1.7.2.5 โปรแกรม Microsoft Word 2010
                 1.7.2.6 โปรแกรม Adobe Dreamweaver CS5
                 1.7.2.7 โปรแกรม Microsoft Office Power Point 2010
                 1.7.2.8 โปรแกรม Microsoft Office Visio 2010
                 1.7.2.9 โปรแกรม Adobe Flash
                 1.7.2.10 เครื่ องมือเขียนโค้ด Edit Plus
                 1.7.2.11 โปรแกรม MAMP
                 1.7.2.12 โปรแกรม Adobe Flash CS5
6




                                           บทที่ 2
                             แนวคิด ทฤษฎีและเอกสารที่เกี่ยวข้อง


แนวคิดและทฤษฎี
เทคโนโลยีสารสนเทศและการสื่ อสาร
ระบบสารสนเทศ(Information Technology)

ซอฟท์แวร์ (Software)
เทคโนโลยีทใช้
           ี่

HTML
       - HTML หรื อ Hypertext Markup Language เป็ นภาษาคอมพิวเตอร์ รูปแบบหนึ่ง ที่มี
         โครงสร้างการเขียนโดยอาศัยตัวกากับ (Tag) ควบคุมการแสดงผลข้อความ, รู ปภาพ
         หรื อวัตถุอื่นๆ ผ่านโปรแกรมเบราเซอร์ แต่ละ Tag อาจจะมีส่วนขยายที่เรี ยกว่า
         Attribute สาหรับระบุ หรื อควบคุมการแสดงผล ของเว็บได้ดวย HTML
                                                                ้
( http://www.ptbk.ac.th/htmlweb/html01.html )
โดยในส่ วน ของ ภาษา HTML นั้น ครอบคลุมทั้งตัวเว็บไซต์เพื่อการแสดงผลบนหน้าเว็บ Browser
สาหรับเทคนิคหลักๆที่นามาใช้จะเป็ นการสร้างตารางสาหรับลองสี เล็บทีละนิ้ว และการแสดง
สิ นค้าบนหน้า web page
7




                         รู ปที่ 2.1 ภาพแสดงคาสั่งในการแสดงสิ นค้า



การแสดงสิ นค้ าบนหน้ า Webpage
       โดยการสร้างตารางเพื่อวางรู ปสิ นค้า ให้มีความเรี ยบร้อย สวยงาม
8




CSS

        -     CSS คือ ชุดคาสั่งที่ใช้สาหรับการกาหนดการแสดงผลข้อมูลหน้าเว็บเพจ ซึ่งคาเต็ม ๆ
              ของ CSS คือ Cascading Style Sheets เป็ นมาตรฐานหนึ่งของ W3C ที่กาหนดขึ้นมา
              เพื่อใช้ในการตบแต่งหน้าเอกสารเว็บเพจโดยเฉพาะ การใช้งาน CSS จะเข้ามาช่วยเพิ่ม
                                  ั                             ่
              ความสามารถให้กบ HTML เดิมที่เราใช้งานกันอยูในปั จจุบน ซึ่ งในปั จจุบน
                                                                        ั            ั
                              ่
              นี้ CSS ได้มาอยูบนมาตรฐานที่เวอร์ ชน 2.0 (CSS2.0)
                                                   ั
         - ความสามารถของ CSS
              CSS ทาให้การปรับปรุ งเว็บเพจในส่ วนของการแสดงผลทาได้อย่างรวดเร็ วขึ้น
              เนื่องจากเราสามารถปรับปรุ งคุณสมบัติของการแสดงผลได้จากจุด ๆ เดียวแล้วส่ งผล
              ให้ท้ งหน้าเพจที่มีการใช้งาน CSS นั้นปรับปรุ งให้เป็ นไปตามที่เราแก้ไข
                    ั
(http://bu.lpc.rmutl.ac.th/naravit/begin-programming/basic_PHP/css_mean.htm)




                        รู ปที่ 2.2 ภาพแสดงคาสั่งกาหนดรู ปแบบบนหน้าเว็บไซต์

        การกาหนดรู ปแบบกล่ อง Tooltip ให้ แสดงผลบนหน้ าเว็บ
        โดยในส่ วนของเว็บไซต์ยาทาเล็บนั้นได้นา CSS มาใช้ในหลายส่ วนสาหรับการจัดรู ปแบบ
ตัวอักษรและการแสดงผลในหน้าต่างๆ สาหรับโค้ดที่จะนามาเสนอนี้ จะเป็ นการนามาใช้จดรู ปแบบ  ั
การแสดงผลของกล่องข้อความโต้ตอบซึ่ งเมื่อผูใช้เลื่อนเม้าส์ไปวางที่รูปสิ นค้าน้ ายาทาเล็บแล้วจะมี
                                             ้
กล่องข้อความอธิ บายถึงตัวสิ นค้านั้นๆแสดงขึ้นมา
9




         Ajax
        - เป็ นเทคนิคหรื อวิธีการที่เกี่ยวข้องกับการพัฒนาโปรแกรมแบบเว็บแอพพลิเคชัน (Web
                                                                                      ่
          Application) โยช่วยให้เราดึงข้อมูลจากเซิ ร์ฟเวอร์ มาปรับปรุ งหน้าเว็บเพจได้โดยที่
          บราวเซอร์ ไม่ตองโหลดเพจใหม่มาทั้งเพจ หน้าจอของบราวเซอร์ จึงไม่กระพริ บ และ
                          ้
          ทาให้การใช้งานเว็บแอพพลิเคชันมีความรู ้สึกแบบเดียวกับเดสก์ทอปแอพพลิเคชัน
                                             ่                             ็            ่
          หรื ออย่างน้อยก็ให้ความรู ้สึกที่ใกล้เคียงกันมากขึ้น
(พร้อมเลิศ หล่อวิจิตร,2551 คู่มือเรี ยน AJAX สาหรับผูเ้ ริ่ มต้น)




                     รู ปที่ 2.3 ภาพแสดงคาสั่งการตรวจสอบรหัสผ่านในการเข้าสู่ ระบบ



         การตรวจสอบรหัสผ่ านในการเข้ าสู่ ระบบ
10




       โดยแสดงเป็ นกล่อง Alert ขึ้นมา ไม่ตองเสี ยเวลาโหลดหน้าเว็บใหม่ท้ งหน้า
                                          ้                             ั

       Adobe Flash




                     รู ปที่ 2.4 ภาพแสดงการสร้างหน้าลองสิ นค้าบนแฟลช



       การสร้ างหน้ าลองสิ นค้ าบนแฟลช
          โดยในรายวิชา ICT491 ได้ทดลองใช้เทคโนโลยี Java Script ในการพัฒนาตัวมือ และการ
คลิ๊กที่ขวดน้ ายาทาเล็บแล้วนามาแปะบนนิ้วทีละนิ้ว โดยบ่างภาพมือเป็ นตาราง 10 คอลัมน์ จาก
การศึกษาค้นคว้าเพิ่มเติมต่อมาได้มีการนาเทคโนโลยีแฟลชเข้ามาใช้ในงาน เพื่อความสวยงามและดู
ใกล้เคียงกับมือของมนุษย์ให้มากขึ้น
11




Database
       - ระบบฐานข้อมูล (Database System) หมายถึง โครงสร้างสารสนเทศที่ประกอบด้วย
         รายละเอียดของข้อมูลที่เกี่ยวข้องกันที่จะนามาใช้ในระบบต่าง ๆ ร่ วมกันระบบ
         ฐานข้อมูล จึงนับว่าเป็ นการจัดเก็บข้อมูลอย่างเป็ นระบบ ซึ่ งผูใช้สามารถจัดการกับ
                                                                       ้
         ข้อมูลได้ในลักษณะต่าง ๆ ทั้งการเพิ่ม การแก้ไข การลบ ตลอดจนการเรี ยกดูขอมูล ซึ่ง
                                                                                     ้
         ส่ วนใหญ่จะเป็ นการประยุกต์นาเอาระบบคอมพิวเตอร์ เข้ามาช่วยในการจัดการ
         ฐานข้อมูล
(นอ. อโณทัย นอบไทย, 2544 การออกแบบระบบฐานข้อมูลเชิงสัมพันธ์)
       - ฐานข้อมูล (Database) หมายถึง กลุ่มของข้อมูลที่มีความสัมพันธ์กน นามาเก็บรวบรวม
                                                                      ั
         เข้าไว้ดวยกันอย่างมีระบบและข้อมูลที่ประกอบกันเป็ นฐานข้อมูลนั้น ต้องตรงตาม
                 ้
         วัตถุประสงค์การใช้งาน
(http://mpnn2551.net46.net/Subjects/DBMS32042014/dataBaseIntro.html)




                          รู ปที่ 2.5 ภาพแสดงการจัดการฐานข้อมูล



  การจัดการฐานข้ อมูลโดยโปรแกรม MAMP สาหรับ Mac OS x
12




          (Macintosh, Apache, Mysql and PHP) เป็ นโปรแกรมจาลองเซิฟเวอร์เพื่อการพัฒนา
ระบบ หรื อเว็บแอพพลิเคชันโดยมีลกษณะคล้ายกับตัว Appserve ในฝั่ง Window
                        ่      ั

       SQL
       - เอสคิวแอล (SQL) คือ ภาษาสอบถามข้อมูล หรื อภาษาจัดการข้อมูลอย่างมีโครงสร้าง มี
         การพัฒนาภาษาคอมพิวเตอร์ และโปรแกรมฐานข้อมูลที่รองรับมากมาย เพราะจัดการ
         ข้อมูลได้ง่าย เช่น MySQL, PostgreSQLหรื อ MS Access เป็ นต้น
(http://www.choosak.com/page-29/)




                รู ปที่ 2.6 ภาพแสดงการใช้ภาษา SQL สาหรับการเพิ่ม-แก้ไขข้อมูลสิ นค้า



       การใช้ ภาษา SQL สาหรับการเพิม-แก้ ไขข้ อมูลสิ นค้ าในฐานข้ อมูล
                                   ่
13




        โดยรับข้อมูล id ของสิ นค้านั้นๆที่ส่งมาเก็ฐไว้ในตัวแปร เพื่อค้นหาสิ นค้าตัวนั้นนามาคิวรี่
ข้อมูลให้ผใช้แก้ไข
          ู้




        รู ปที่ 2.7 ภาพแสดงการใช้ภาษา SQL สาหรับในการตรวจสอบ Username

                              การใช้ ภาษา SQL ในการตรวจสอบ Username
                                        ่             ่
        สาหรับการสมัครสมาชิกใหม่เพื่อดูวาชื่ อนี้มีอยูแล้วหรื อไม่ในฐานข้อมูล หากชื่อนั้นๆถูก
ใช้แล้วจะไม่สามารถใช้ชื่อซ้ ากันได้
14




                   รู ปที่ 2.8 ภาพแสดงการใช้ภาษา SQL สาหรับลบสิ นค้าในฐานข้อมูล

    การใช้ ภาษา SQL สาหรับลบสิ นค้ าในฐานข้ อมูล
          โดยการสร้างตัวแปรเพื่อใช้ในการลบสิ นค้าซึ่งมี id เป็ น Primery key สิ นค้าจะถูกลบ
ต่อเมื่อ มี id ตรงตามที่ขอมูลส่ งออกไป
                         ้
15




PHP
                                                       ั
       - ภาษาสคริ ปต์ที่สามารถเขียนโค้ดคาสั่งรวมไว้กบภายในเอกสาร HTML ได้เช่นเดียวกับ
         ภาษา JavaScript แต่ต่างกันที่ ภาษา PHP เป็ นภาษาสคริ ปต์ที่ทางานในฝั่งเซิ ร์ฟเวอร์
         (Server – Side Script Language) คือ โค้ดคาสังของ PHP จะถูกประมวลผลในฝั่ง
                                                     ่
         เซิ ร์ฟเวอร์ แล้วส่ งผลลัพธ์ในรู ปแบบของ HTML กลับไปยังไคลเอนต์ที่ร้องขอ โดย
         โค้ดของ PHP นี้ผใช้ในฝั่งไคลเอนต์จะไม่สามารถมองเห็นได้
                              ู้
(พิรพร หมุนสนิท, 2551 พื้นฐานการโปรแกรมบนเว็บ Web Programming Fundamentals)




                              รู ปที่ 2.9 ภาพแสดงการการเชื่อมต่อฐานข้อมูล

       การเชื่ อมต่ อฐานข้ อมูล
         โดยการสร้างตัวแปรขึ้นมา 1 ตัว ในการเชื่อมต่อกับฐานข้อมูล หากการติดต่อผิดพลาด
หรื อไม่สามารถทางานได้ ระบบจะแสดงข้อความ Could not connect : ตามด้วยสาเหตุที่ไม่สามารถ
เชื่อมต่อได้
16




                      รู ปที่ 2.10 ภาพแสดงการเพิ่ม-ลบสิ นค้าในฐานข้อมูล



การเพิม-ลบสิ นค้ าในฐานข้ อมูล
      ่
17




                                       บทที่ 3

                                  การออกแบบระบบ

3.1 การออกแบบกระบวนการเก็บและใช้ ข้อมูล

       3.1.1 แผนภาพแดสงการทางานของผูใช้ระบบ ( Use Case Diagram ) เว็บไซต์น้ ายาทาเล็บ
                                    ้




                                       Social Pugin


        รู ปที่ 3.1 แผนภาพการแสดงการทางานของ ผูใช้ทวไป สมาชิก และ ผูดูแลระบบ
                                               ้ ั่                 ้
18




3.1.2 แผนภาพการทางาน (Flow Chart) ของเว็บไซต์ นายาทาเล็บ
                                               ้




               รู ปที่ 3.2 แผนภาพ (Flow Chart) ของระบบเว็บไซต์น้ ายาทาเล็บ
19




รู ปที่ 3.3 แผนภาพ (Flow Chart) ของการสมัครสมาชิก
20




                      ,




รู ปที่ 3.4 แผนภาพ (Flow Chart) ของการตรวจสอบสถานการณ์เข้าสู่ ระบบ
21




รู ปที่ 3.5 แผนภาพ (Flow Chart) ส่ วนการทางานของสมาชิก
22




รู ปที่ 3.6 แผนภาพ (Flow Chart) ส่ วนการทางานของผูดูแลระบบ
                                                  ้
23




รู ปที่ 3.7 แผนภาพ (Flow Chart) ของการทดลองสิ นค้า
24




รู ปที่ 3.8 แผนภาพ (Flow Chart) ของการสั่งซื้ อสิ นค้า
25




3.3 แผนภาพแสดงความสัมพันธ์ระหว่างเอนทิต้ ี (Entity-Relationship Diagrams)




    รู ปที่ 3.9 แผนภาพแสดงความสัมพันธ์ระหว่างเอนทิต้ ี (Entity )และแอททิบิวต์ (Attribute)
26




        ชื่อตาราง Customer
        วัตถุประสงค์ เก็บข้อมูลสมาชิก
        แฟมทีเ่ กี่ยวข้ อง ไม่มี
          ้


        ตารางที่ 3.1 แสดงแฟ้ มข้อมูลสมาชิก

  ลาดับ        คุณสมบัติ             คาอธิบาย         ขนาด ประเภท       ค่า          ตรวจสอบ       ประเภทคีย ์
(Sequence      (Attribute)         (Description)     (Width) (Type) เบื้องต้น       ความถูกต้อง    (Key Type)
   No.)                                                              (Defult)   (Validation Check)
    1          Username             ชื่อสมาชิก         20    varcha      -      ตัวเลขและตัวอักษร     PK
    2          Password              รหัสผ่าน          20    varcha      -      ตัวเลขและตัวอักษร       -
    3             Tel              เบอโทรศัพท์         20    varcha      -      ตัวเลขและตัวอักษร       -
    4           Address                 ที่อยู่        100   varcha      -      ตัวเลขและตัวอักษร       -
    5           E-mail                  อีเมล์         64    varcha      -      ตัวเลขและตัวอักษร       -
    6            Type              ประเภทของ           10    varcha customer    ตัวเลขและตัวอักษร       -
                                       สมาชิก


        ชื่อตาราง Orders
        วัตถุประสงค์ เก็บข้อมูลการสั่งซื้ อ
        แฟมทีเ่ กี่ยวข้ อง ไม่มี
          ้

        ตารางที่ 3.2 แสดงแฟ้ มรายละเอียดการสั่งซื้ อ

  ลาดับ          คุณสมบัติ             คาอธิบาย     ขนาด ประเภท      ค่า      ตรวจสอบ        ประเภทคีย ์
(Sequence        (Attribute)         (Description) (Width (Type) เบื้องต้น   ความถูกต้อง     (Key Type)
   No.)                                               )          (Defult) (Validation Check)

    1             Order_Id            เลขที่การ        20      int      -            ตัวเลข              PK
                                        สังซื้ อ
                                          ่                                                              FK
    2              Date               วันสั่งซื้ อ      -      date     -                                 -
    3          Customer_Id            รหัสลุกค้า       10     varcha    -       ตัวเลขและตัวอักษร         -
27




       ชื่อตาราง Order_Detail
       วัตถุประสงค์ เก็บข้อมูลรายละเอียดการสั่งซื้ อ
       แฟมทีเ่ กี่ยวข้ อง ไม่มี
         ้
       ตารางที่ 3.3 แสดงแฟ้ มรายละเอียดการสั่งซื้ อ

  ลาดับ   คุณสมบัติ                 คาอธิบาย       ขนาด     ประเภท      ค่า        ตรวจสอบ        ประเภทคีย ์
(Sequence (Attribute)             (Description)   (Width)   (Type)    เบื้องต้    ความถูกต้อง     (Key Type)
   No.)                                                                   น    (Validation Check)
                                                                     (Defult)
   1           Order_Id รหัสการสังซื้ อ
                                 ่                  11        int         -          ตัวเลข          PK
   2          Product_Id รหัสสิ นค้า                11        int         -          ตัวเลข          FK
   3           Quentity    จานวน                    11        int         -          ตัวเลข            -
   4             Price      ราคา                    6,2      float        -          ตัวเลข            -




       ชื่อตาราง Product
       วัตถุประสงค์ เก็บข้อมูลสิ นค้า
       แฟมทีเ่ กี่ยวข้ อง ไม่มี
         ้


       ตารางที่ 3.4 แสดงแฟ้ มข้อมูลสิ นค้า

  ลาดับ   คุณสมบัติ     คาอธิบาย                   ขนาด ประเภท       ค่า      ตรวจสอบ        ประเภทคีย ์
(Sequence (Attribute) (Description)               (Width) (Type) เบื้องต้น   ความถูกต้อง     (Key Type)
   No.)                                                          (Defult) (Validation Check)
    1     Product_Id รหัสสิ นค้า                    10      int       -         ตัวเลข          PK
    2       Name        ชื่อสิ นค้า                 100   varcha      -        ตัวอักษร           -
    3       Detail     รายละเอียด                   300   varcha      -        ตัวอักษร           -
    4       Image       รู ปสิ นค้า                 100   varcha      -        ตัวอักษร           -
    5        Price         ราคา                     6,2    float      -         ตัวเลข            -
28




   6            Amount            จานวนสิ นค้า    10      int    -        ตัวเลข              -
   7           Username            ชื่อสมาชิก     100   varcha   -       ตัวอักษร             -
   8             Type               กาหนด         10      int    -        ตัวเลข              -
                                  ประเภทสิ นค้า


       ชื่อตาราง Promotion
       วัตถุประสงค์ เก็บข้อมูลโปรโมชัน
                                     ่
       แฟมทีเ่ กี่ยวข้ อง ไม่มี
         ้


       ตารางที่ 3.5 แสดงแฟ้ มข้อมูลโปรโมชัน
                                          ่

  ลาดับ   คุณสมบัติ         คาอธิบาย         ขนาด ประเภท   ค่า            ตรวจสอบ       ประเภทคีย ์
(Sequence (Attribute)     (Description) (Width) (Type) เบื้องต้น         ความถูกต้อง    (Key Type)
   No.)                                                  (Defult)    (Validation Check)
    1         Id            เลขที่            20  varcha    -        ตัวเลขและตัวอักษร     PK
                          โปรโมชัน   ่
   2             Title       หัวเรื่ อง       20  varcha    -        ตัวเลขและตัวอักษร        -
                            โปรโมชัน     ่
   3          Description     อธิบาย          20  varcha    -        ตัวเลขและตัวอักษร        -
                             เกี่ยวกับ
                            โปรโมชัน       ่
   4            Image        รู ปภาพ          100 varcha    -        ตัวเลขและตัวอักษร        -
                             ประกอบ
   5            Enable       สาหรับ           64  varcha    -        ตัวเลขและตัวอักษร        -
                          กาหนดว่าเปิ ด
                              ใช้งาน
                           โปรโมชันนี้ ่
                             หรื อไม่
29




3.1.4 แผนภาพบริบท (Context Diagram)
     ขั้นตอนการทางานของ Context Diagram ส่ วนที่แสดงจุดเริ่ มต้นหรื อแหล่งกาเนิดและเป็ นจุด
ที่ผใช้ขอมูลในเว็บไซต์น้ ายาทาเล็บซึ่งภาพบริ บทนี้จะเป็ นตัวกาหนดขอบเขตของระบบ เว็บไซต์
    ู้ ้
น้ ายาทาเล็บ ดังรู ปที่ 3.10

                        Social Plugin




                                                             Social Plugin




                                 Social Plugin

                รู ปที่ 3.10 ภาพแสดงแผนภาพบริ บท (Context Diagram)
30




3.1.5 แผนภาพกระแสข้ อมูล (Dataflow Diagram)

     กระบวนการท างานของกระบวนภาพกระแสข้อมูล (Dataflow Diagram) จะเป็ นแผนภาพที่
ช่วยแสดงให้เห็นถึงการไหลของข้อมูลระหว่างกระบวนการต่างๆในลักษณะของรู ปภาพซึ่ งมี
ประโยชน์ในด้านรายละเอียดของขั้นตอนการปฏิบติงานและการจัดทาโครงสร้างตารางข้อมูลต่างๆ
                                         ั
ที่เกี่ยวเนื่องกันทั้งหมด ที่ใช้ ในเว็บไซต์น้ ายาทาเล็บ โดยการแสดงผลแบบรู ปภาพนั้นจะสามารถทา
ให้ เข้าใจได้ง่ายและตรงกันมากขึ้น โดย การทางานแผนภาพกระแสข้อมูลนี้จะแบ่งการท างานของ
เว็บไซต์น้ ายาทาเล็บ ออกเป็ นกระบวนการต่างๆ โดยแต่ละขั้นตอนนั้นก็จะแสดงให้ เห็นถึงการไหล
ของข้อมูลซึ่ งในแผนภาพกระแสข้อมูลของจะมีกระบวนการดังนี้

                        ,                                            ,
                         , ,                                          , ,
                                                 1.0
                                                                                         D1



                          รู ปที่ 3.11 ภาพแสดงการสมัครสมาชิก

                           ,                                                 ,
                                                                         ,                D2
                                                        2.0
                          ,                                                          ,
                                                                             ,            D1



                               รู ปที่ 3.12 ภาพแสดงการเข้าสู่ ระบบ

                                                                                     ,
                    ,     ,          ,            3.0
                                                                     ,           ,
                                                                                         D1




                        รู ปที่ 3.13 ภาพแสดงการแก้ไขข้อมูลสมาชิก
31




                                             D3
                        4.0

                                             D4




รู ปที่ 3.14 ภาพแสดงการทดลองสิ นค้า

                                            D3
                      5.0

                                            D4




 รู ปที่ 3.15 ภาพแสดงการสั่งซื้ อสิ นค้า




                       6.0
                                            D4




รู ปที่ 3.16 ภาพแสดงวิเคราะห์การสั่งซื้ อ
32




                                              บทที่ 4

                                         ผลของการศึกษา

ผลของการศึกษา คือ สิ่ งที่ได้จากการพัฒนาโปรแกรมที่สาเร็ จแล้วที่ได้มาจากการศึกษาค้นคว้า

4.1 กระบวนการทางานทั้งหมดของโปรแกรมมีดังนี้

ชื่อกระบวนการ 1.0                         คาอธิบายการทางาน                    หมายเหตุ
                         เป็ นวิธีใช้สาหรับสมัครสมาชิ กใหม่ และจัดเก็บ
   สมัครสมาชิก           ข้อมูลลงฐานข้อมูล โดยมีการตรวจสอบข้อมูลใน
                         ระบบไม่ให้ขอมูลซ้ ากัน
                                        ้


            ตารางที่ 4.1 แสดงกระบวนการทางานของ 1.0 กระบวนการสมัครสมาชิก



ชื่อกระบวนการ 2.0                        คาอธิบายการทางาน                    หมายเหตุ
                        เป็ นวิธีที่สมาชิกใช้ในการเข้าสู่ ระบบ โดยการใส่
    เข้าสู่ ระบบ
                        ชื่อเข้าสู่ ระบบ รหัสผ่านของตนเอง


              ตารางที่ 4.2 แสดงกระบวนการทางานของ 2.0 กระบวนการเข้าสู่ ระบบ



  ชื่อกระบวนการ 3.0                        คาอธิบายการทางาน                  หมายเหตุ
                            เป็ นวิธีที่สมาชิกใช้สาหรับแก้ไขหรื อ
  แก้ไขข้อมูลส่ วนตัว
                            เปลี่ยนแปลงข้อมูลส่ วนตัว ของสมาชิก


         ตารางที่ 4.3 แสดงกระบวนการทางานของ 3.0 กระบวนการแก้ไขข้อมูลส่ วนตัว
33




  ชื่อกระบวนการ 4.0                   คาอธิบายการทางาน                           หมายเหตุ
   การทดลองสิ นค้า         เป็ นการทดลองสี น้ ายาทาเล็บและผสมสี ดวย
                                                                 ้
                           ตนเองบันทึกเพื่อสังซื้ อ
                                              ่


            ตารางที่ 4.4 แสดงกระบวนการทางานของ 4.0 กระบวนการทดลองสิ นค้า



  ชื่อกระบวนการ 5.0                        คาอธิบายการทางาน                      หมายเหตุ
     การสั่งซื้ อสิ นค้า   เป็ นการสั่งซื้ อสิ นค้า เมื่อสมาชิกได้เลือกสิ นค้า
                           ระบบจะคานวณราคารวมของสิ นค้าทั้งหมด


             ตารางที่ 4.5 แสดงกระบวนการทางานของ 5.0 กระบวนการสังซื้ อสิ นค้า
                                                               ่



  ชื่อกระบวนการ 6.0                     คาอธิบายการทางาน                         หมายเหตุ
การวิเคราะห์สินค้าขายดี    เป็ นการนาข้อมูลการสังซื้ อสิ นค้ามาวิเคราะห์
                                                ่
                           และแสดงผลการวิเคราะห์ในรู ปแบบกราฟ
                           วงกลม


        ตารางที่ 4.6 แสดงกระบวนการทางานของ 6.0 กระบวนการวิเคราะห์สินค้าขายดี
34




4.2 การแสดงผลของการพัฒนาโปรแกรมทีสาเร็จแล้ว
                                 ่

     4.2.1 หน้าแรก




                            รู ปที่ 4.1 แสดงหน้าแรกของเว็บไซต์

            หน้าแรกของเว็บไซต์มีการแสดงสิ นค้าและราคาของสิ นค้าทั้งหมด โปรโมชันของ
                                                                              ่
ทางเว็บไซต์ และสามารถเข้าสู่ หน้าต่างๆขอเว็บไซต์ได้จากหน้าแรกของเว็บไซต์
35




      4.2.2 หน้าสมัครสมาชิก




                                  รู ปที่ 4.2 การสมัครสมาชิก

             แสดงการสมัครสมาชิก โดยใส่ Username ,Password ,Tel และAddress



       4.2.3 หน้าเข้าสู่ ระบบ




                                รู ปที่ 4.3 แสดงหน้าเข้าสู่ ระบบ

         แสดงการเข้าสู่ ระบบของสมาชิกและผูดูและระบบ โดยมีการใส่ Username และ
                                          ้
Password ในช่อง LOGIN
36




        4.2.4 หน้าทดลองสิ นค้า




                                 รู ปที่ 4.4 แสดงหน้าทดลองสิ นค้า

               แสดงสิ นค้าทั้งหมด และสามารถทดลองสิ นค้าบนเล็บมือที่เตรี ยมไว้ให้ โดยสี ผว
                                                                                        ิ
ของมือก็จะสามารถเลือกเฉดสี ผวได้ 6 เฉดสี สมาชิกยังสามารถผสมสี จากสี ที่กาหนดไว้ให้ เพื่อให้
                            ิ
ได้สี่ที่ตองการได้ดวยตนเอง
          ้        ้
37




4.2.5 หน้าลองสิ นค้า (การอัพเดทสิ นค้า)




                                 รู ปที่ 4.5 แสดงการอัพเดทสิ นค้า

            แสดงสิ นค้าที่หมดในหน้าทดลองจะมีการเบลอภาพสิ นค้าและสิ นค้าที่หมดจะไม่
สามารถทดลองสิ นค้านั้นๆได้



       4.2.6 หน้าตะกร้าสิ นค้า




                                  รู ปที่ 4.6 แสดงการสั่งซื้ อสิ นค้า

            แสดงสิ นค้าทั้งหมดที่มีการเลือกสั่งซื้ อสิ นค้า
38




4.2.7 หน้า Edit Profile




                          รู ปที่ 4.7 แสดงการแก้ไขข้อมูลสมาชิก

                แสดงข้อมูลส่ วนตัวของสมาชิกและสามารถแก้ไขข้อมูลส่ วนตัวได้



     4.2.8 หน้าวิธีการชาระเงิน




                                 รู ปที่ 4.8 แสดงวิธีการชาระเงิน

              แสดงช่องทางและวิธีการชาระเงิน เมื่อสมาชิกต้องการสั่งซื้ อสิ นค้า
39




4.2.9 หน้า Contact us




                            รู ปที่ 4.9 แสดงข้อมูลการติดต่อกับเว็บไซต์

               แสดงข้อมูลที่สามารถติดต่อกับทางเว็บไซต์ เพื่อสอบถามและสังซื้ อสิ นค้า
                                                                       ่



       4.2.10 หน้าประวัติ




                                รู ปที่ 4.10 แสดงประวัติการสั่งซื้ อ

                  แสดงประวัติการสั่งซื้ อสิ นค้าของสมาชิก
40




4.2.11 หน้า Edit Promotion




                             รู ปที่ 4.11 แสดงการแก้ไขโปรโมชัน
                                                             ่

             แสดงโปรโมชันทั้งหมด และสามรถเพิ่ม แก้ไข ลบโปรโมชันได้ และต้องมีการเข้าสู่
                        ่                                     ่
ระบบโดยใช้ username ของ admin เท่านั้น
41




                                             บทที่ 5

                         สรุ ปผลการศึกษา การอภิปราย และข้อเสนอแนะ

5.1 การอภิปรายผล
         เว็บไซต์ Nail Colors นั้น เป็ นทางเลือกใหม่ของผูซ้ื อสิ นค้าประเภทยาทาเล็บ โดยมีฟังก์ชน
                                                         ้                                     ั่
    ที่ให้ลูกค้าสามารถลองสิ นค้าบนนิ้วมือ(ที่จดไว้ให้) และยังสามารถเลือกสี ผวหนังมือให้ตรงกับ
                                              ั                             ิ
    ความต้องการ สร้างความโดนเด่นให้บริ การผ่านเว็บซื้ อสิ นค้าอีกระดับ อีกทั้งยังรวมไปถึง
    ฟังก์ชนการผสมสี เป็ นทางเลือกแก่ผที่ตองการความแปลกใหม่ ต้องการสี ที่ไม่เหมือนใคร เพิ่ม
          ั่                         ู้ ้
    ความแปลกใหม่ ดึงดูดความสนใจให้ตวสิ นค้า
                                   ั

5.2 ข้ อจากัดของการศึกษา

         5.2.1) ซอฟท์แวร์ บางตัวที่ใช้มีราคาสู ง บางตัวมีระยะเวลาจากัดในการให้สิทธิ์ ทดลองใช้
งาน จึงทาให้ไม่สามารถพัฒนาระบบได้อย่างเต็มที่

         5.2.2) ระบบไม่สามารถนาไปทดสอบการใช้งานบนอินเตอร์ เน็ทจริ งได้ จึงไม่ได้รับทราบ
ถึงความคิดเห็นคนส่ วนใหญ่ผบริ โภคทุกกลุ่มอายุ
                          ู้

         5.2.3) ระยะเวลาในการพัฒนาด้านแฟลชมีอย่างจากัด ผูพฒนาระบบขาดความรู ้ทางด้าน
                                                         ้ ั
โปรแกรมแฟลช ทาให้ฟังก์ชนการผสมสี ยงขาดความหลากหลาย มีสีที่ยงไม่เพียงพอต่อการบริ การ
                       ั่         ั                        ั
ลูกค้า
42




5.3 ข้ อเสนอแนะ

        สาหรับข้อเสนอแนะที่ควรมีการนาไปพัฒนาต่อในการต่อยอดเชิงพาณิ ชย์น้ น เว็บไซต์ขาย
                                                                         ั
สิ นค้าน้ ายาทาเล็บ ควรมีความหลากหลายในเรื่ องเกี่ยวกับการผสมสี สี ท่ีได้ โดยอาจเพิ่มเติมในส่ วน
ของเนื้ อสี เพื่อความโดนเด่นและน่าสนใจยิงขึ้น
                                        ่

        ในปั จจุบนการเลือกซื้ อสิ นค้าผ่านแอพพลิเคชันบนมือถือ นับว่าเป็ นกระแสที่มาแรงไม่นอย
                 ั                                  ่                                     ้
ผูบริ โภคนิยมเลือกซื้ อ หรื อหาข้อมูลสิ นค้าผ่านทางมือถือเป็ นส่ วนมาก เนื่องจากความสะดวกสบาย
  ้
จึงมีความคิดว่าควรพัฒนาต่อยอดในเรื่ องการทาแอพพลิเคชันสาหรับสิ นค้าประเภทนี้ โดยเฉพาะ
                                                     ่



5.4 เปรียบเทียบกับคู่แข่ ง

    วิเคราะห์ความต้องการของลูกค้า โดยยกตัวอย่างเว็บ http://www.ยาทาเล็บ.com/




                             รู ปที่ 5.1 ภาพแสดงหน้าโฮมเพจเว็บ ยาทาเล็บ.com
43




                                            บรรณานุกรม

http://www.w3schools.com/

http://www.ptbk.ac.th/htmlweb/html01.html/
http://bu.lpc.rmutl.ac.th/naravit/begin-programming/basic_PHP/css_mean.htm/
http://mpnn2551.net46.net/Subjects/DBMS32042014/dataBaseIntro.html/
http://www.choosak.com/page-29/
http://www.ยาทาเล็บ.com/
http://thaifreewaredownload.blogspot.com/2010/01/flash-player.html

พิรพร หมุนสนิท, 2551 พื้นฐานการโปรแกรมบนเว็บ Web Programming Fundamentals
นอ. อโณทัย นอบไทย, 2544 การออกแบบระบบฐานข้อมูลเชิงสัมพันธ์
พร้อมเลิศ หล่อวิจิตร,2551 คู่มือเรี ยน AJAX สาหรับผูเ้ ริ่ มต้น
44




ภาคผนวก
45




ภาคผนวก ก.

       ก. 1. โปรแกรมที่ตองใช้ในระบบ
                        ้
             ก 1.1) เครื่ องคอมพิวเตอร์ ระบบปฏิบติการ Pentium 4 ขึ้นไป โทรศัพท์มือถือหรื อ
                                                ั
         Tablet ที่สามารถรองรับเทคโนโลยีแฟลชในการแสดงผลได้
             ก 1.2) ซอฟต์แวร์ที่จาเป็ นคือ Web browser พร้อมกับปลักอิน ที่รองรับเทคโนโลยี
                                                                  ๊
         แฟลช และโปรแกรมจาลองเซิฟเวอร์บนแมค
             ก 1.3) คู่มือการติดตั้งโปรแกรม flash player
                 ไปที่เว็บ http://get.adobe.com/flashplayer/
             จากนั้นคลิกที่ปุ่ม Agree and install now เพื่อเริ่ มการติดตั้ง โดยจะมีขนาดของไฟล์
             ประมาณ 1.83 MB.




                                   รู ปที่ ก 1.3.1 การติดตั้งโปรแกรม flash player



                      จะแสดงหน้าต่างขอบคุณที่เราดาวน์โหลดโปรแกรมมาใช้งาน จากนั้นให้
             เราเปิ ดโปรแกรม flash player ที่เราได้ดาวน์โหลดขึ้นมา เพื่อติดตั้งตามขั้นตอน
             ต่อไปดังนี้
46




              รู ปที่ ก 1.3.2 การติดตั้งโปรแกรม flash player



ให้เราคลิกปุ่ ม Run เพื่อเข้าสู่ การติดตั้งโปรแกรม




              รู ปที่ ก 1.3.3 การติดตั้งโปรแกรม flash player
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน

More Related Content

What's hot

กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์ 58
กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์  58กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์  58
กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์ 58renusaowiang
 
รูปแบบการเขียนรายงานโครงงาน 5 บท
รูปแบบการเขียนรายงานโครงงาน 5 บทรูปแบบการเขียนรายงานโครงงาน 5 บท
รูปแบบการเขียนรายงานโครงงาน 5 บทAekapoj Poosathan
 
ที่มาและความสำคัญของโครงงาน
ที่มาและความสำคัญของโครงงานที่มาและความสำคัญของโครงงาน
ที่มาและความสำคัญของโครงงานPhongsak Kongkham
 
บทที่ 5 สรุปผล และข้อเสนอแนะ
บทที่ 5 สรุปผล และข้อเสนอแนะบทที่ 5 สรุปผล และข้อเสนอแนะ
บทที่ 5 สรุปผล และข้อเสนอแนะKittichai Pinlert
 
สารบัญโครงงานคอม
สารบัญโครงงานคอมสารบัญโครงงานคอม
สารบัญโครงงานคอมkand-2539
 
ตัวอย่างบทคัดย่อ
ตัวอย่างบทคัดย่อตัวอย่างบทคัดย่อ
ตัวอย่างบทคัดย่อsukanya5729
 
ภาคผนวกโครงงานกล้อง
ภาคผนวกโครงงานกล้องภาคผนวกโครงงานกล้อง
ภาคผนวกโครงงานกล้องkrupornpana55
 
โครงงานเเยมกล้วย(Complete)
โครงงานเเยมกล้วย(Complete)โครงงานเเยมกล้วย(Complete)
โครงงานเเยมกล้วย(Complete)Pongpan Pairojana
 
หน้าปกโครงงาน
หน้าปกโครงงานหน้าปกโครงงาน
หน้าปกโครงงานKanistha Chudchum
 
บทที่3 วิธีดำเนินงาน
บทที่3 วิธีดำเนินงานบทที่3 วิธีดำเนินงาน
บทที่3 วิธีดำเนินงานChamp Wachwittayakhang
 
02 บทที่ 2-เอกสารที่เกี่ยวข้อง
02 บทที่ 2-เอกสารที่เกี่ยวข้อง02 บทที่ 2-เอกสารที่เกี่ยวข้อง
02 บทที่ 2-เอกสารที่เกี่ยวข้องPongtep Treeone
 
โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...
โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...
โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...ssuser858855
 
โครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มด
โครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มดโครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มด
โครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มดพัน พัน
 
เค้าโครงโครงงานวิทยาศาสตร์
เค้าโครงโครงงานวิทยาศาสตร์เค้าโครงโครงงานวิทยาศาสตร์
เค้าโครงโครงงานวิทยาศาสตร์โทโต๊ะ บินไกล
 
กิตติกรรมประกาศ
กิตติกรรมประกาศกิตติกรรมประกาศ
กิตติกรรมประกาศmaerimwittayakom school
 
โครงงานการประดิษฐ์กระถางจากขวดพลาสติก
โครงงานการประดิษฐ์กระถางจากขวดพลาสติกโครงงานการประดิษฐ์กระถางจากขวดพลาสติก
โครงงานการประดิษฐ์กระถางจากขวดพลาสติกพัน พัน
 

What's hot (20)

กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์ 58
กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์  58กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์  58
กิตติกรรมประกาศ บทคัดย่อ โครงงานทดลองวิทยาศาสตร์ 58
 
รูปแบบการเขียนรายงานโครงงาน 5 บท
รูปแบบการเขียนรายงานโครงงาน 5 บทรูปแบบการเขียนรายงานโครงงาน 5 บท
รูปแบบการเขียนรายงานโครงงาน 5 บท
 
ที่มาและความสำคัญของโครงงาน
ที่มาและความสำคัญของโครงงานที่มาและความสำคัญของโครงงาน
ที่มาและความสำคัญของโครงงาน
 
บทที่ 5 สรุปผล และข้อเสนอแนะ
บทที่ 5 สรุปผล และข้อเสนอแนะบทที่ 5 สรุปผล และข้อเสนอแนะ
บทที่ 5 สรุปผล และข้อเสนอแนะ
 
สารบัญโครงงานคอม
สารบัญโครงงานคอมสารบัญโครงงานคอม
สารบัญโครงงานคอม
 
ตัวอย่างบทคัดย่อ
ตัวอย่างบทคัดย่อตัวอย่างบทคัดย่อ
ตัวอย่างบทคัดย่อ
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์
 
ภาคผนวกโครงงานกล้อง
ภาคผนวกโครงงานกล้องภาคผนวกโครงงานกล้อง
ภาคผนวกโครงงานกล้อง
 
โครงงานเเยมกล้วย(Complete)
โครงงานเเยมกล้วย(Complete)โครงงานเเยมกล้วย(Complete)
โครงงานเเยมกล้วย(Complete)
 
โครงงานภาษาไทย เรื่อง คำไทยที่มักเขียนผิด
โครงงานภาษาไทย เรื่อง คำไทยที่มักเขียนผิดโครงงานภาษาไทย เรื่อง คำไทยที่มักเขียนผิด
โครงงานภาษาไทย เรื่อง คำไทยที่มักเขียนผิด
 
หน้าปกโครงงาน
หน้าปกโครงงานหน้าปกโครงงาน
หน้าปกโครงงาน
 
บทที่1 บทนำ
บทที่1 บทนำบทที่1 บทนำ
บทที่1 บทนำ
 
บทที่3 วิธีดำเนินงาน
บทที่3 วิธีดำเนินงานบทที่3 วิธีดำเนินงาน
บทที่3 วิธีดำเนินงาน
 
02 บทที่ 2-เอกสารที่เกี่ยวข้อง
02 บทที่ 2-เอกสารที่เกี่ยวข้อง02 บทที่ 2-เอกสารที่เกี่ยวข้อง
02 บทที่ 2-เอกสารที่เกี่ยวข้อง
 
โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...
โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...
โครงงานวิทยาศาสตร์ประเภททดลอง เรื่อง การทดลองการเจริญเติบโตของยีสต์ในน้ำหมักช...
 
2ตัวอย่างนำเสนอโครงการ
2ตัวอย่างนำเสนอโครงการ2ตัวอย่างนำเสนอโครงการ
2ตัวอย่างนำเสนอโครงการ
 
โครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มด
โครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มดโครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มด
โครงงานวิทยาศาสตร์เรื่อง เปลือกไข่ไล่มด
 
เค้าโครงโครงงานวิทยาศาสตร์
เค้าโครงโครงงานวิทยาศาสตร์เค้าโครงโครงงานวิทยาศาสตร์
เค้าโครงโครงงานวิทยาศาสตร์
 
กิตติกรรมประกาศ
กิตติกรรมประกาศกิตติกรรมประกาศ
กิตติกรรมประกาศ
 
โครงงานการประดิษฐ์กระถางจากขวดพลาสติก
โครงงานการประดิษฐ์กระถางจากขวดพลาสติกโครงงานการประดิษฐ์กระถางจากขวดพลาสติก
โครงงานการประดิษฐ์กระถางจากขวดพลาสติก
 

Viewers also liked

รูปเล่มโครงการแต้มสีเติมฝัน...
รูปเล่มโครงการแต้มสีเติมฝัน...รูปเล่มโครงการแต้มสีเติมฝัน...
รูปเล่มโครงการแต้มสีเติมฝัน...Prawwe Papasson
 
Soilless culture-technology
Soilless culture-technologySoilless culture-technology
Soilless culture-technologyFong'Beer KS
 
โครงงานโคมไฟไม้ไอติม
โครงงานโคมไฟไม้ไอติมโครงงานโคมไฟไม้ไอติม
โครงงานโคมไฟไม้ไอติมSupaluck
 
คําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิด
คําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิดคําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิด
คําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิดnidchakul
 
โครงงานยาเสพติด
โครงงานยาเสพติดโครงงานยาเสพติด
โครงงานยาเสพติดพัน พัน
 
หน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม Is
หน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม Isหน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม Is
หน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม IsSasiyada Promsuban
 
โครงงานภาษาไทยเรื่องนิทาน
โครงงานภาษาไทยเรื่องนิทานโครงงานภาษาไทยเรื่องนิทาน
โครงงานภาษาไทยเรื่องนิทานRawinnipha Joy
 

Viewers also liked (9)

รูปเล่มโครงการแต้มสีเติมฝัน...
รูปเล่มโครงการแต้มสีเติมฝัน...รูปเล่มโครงการแต้มสีเติมฝัน...
รูปเล่มโครงการแต้มสีเติมฝัน...
 
ปานเทพ
ปานเทพปานเทพ
ปานเทพ
 
Soilless culture-technology
Soilless culture-technologySoilless culture-technology
Soilless culture-technology
 
Em ball By ACR 58
Em ball By ACR 58Em ball By ACR 58
Em ball By ACR 58
 
โครงงานโคมไฟไม้ไอติม
โครงงานโคมไฟไม้ไอติมโครงงานโคมไฟไม้ไอติม
โครงงานโคมไฟไม้ไอติม
 
คําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิด
คําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิดคําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิด
คําที่มักเขียนผิด โครงงานภาษาไทยเรื่องคําที่มักเขียนผิด
 
โครงงานยาเสพติด
โครงงานยาเสพติดโครงงานยาเสพติด
โครงงานยาเสพติด
 
หน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม Is
หน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม Isหน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม Is
หน้าปก บทคัดย่อ สารบัญ ภาคผนวก บรรณานุกรม Is
 
โครงงานภาษาไทยเรื่องนิทาน
โครงงานภาษาไทยเรื่องนิทานโครงงานภาษาไทยเรื่องนิทาน
โครงงานภาษาไทยเรื่องนิทาน
 

Similar to รูปเล่มวิชาโครงงาน

รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
Exproject2
Exproject2Exproject2
Exproject2najak
 
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum UniversityKnowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum Universitybennypong
 
วิชาโครงงาน
วิชาโครงงานวิชาโครงงาน
วิชาโครงงานAjBenny Pong
 
รายงานการปฏิบัติงานสหกิจศึกษา
รายงานการปฏิบัติงานสหกิจศึกษารายงานการปฏิบัติงานสหกิจศึกษา
รายงานการปฏิบัติงานสหกิจศึกษาAttaporn Ninsuwan
 
ผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานAjBenny Pong
 
รูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียว
รูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียวรูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียว
รูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียวjakp191240
 

Similar to รูปเล่มวิชาโครงงาน (20)

รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
Book area
Book areaBook area
Book area
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
Present 270155
Present 270155Present 270155
Present 270155
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
Exproject2
Exproject2Exproject2
Exproject2
 
Nsc2012
Nsc2012Nsc2012
Nsc2012
 
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum UniversityKnowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum University
 
วิชาโครงงาน
วิชาโครงงานวิชาโครงงาน
วิชาโครงงาน
 
Library Branding with ICT
Library Branding with ICTLibrary Branding with ICT
Library Branding with ICT
 
รายงานการปฏิบัติงานสหกิจศึกษา
รายงานการปฏิบัติงานสหกิจศึกษารายงานการปฏิบัติงานสหกิจศึกษา
รายงานการปฏิบัติงานสหกิจศึกษา
 
00 ส่วนนำ1
00 ส่วนนำ100 ส่วนนำ1
00 ส่วนนำ1
 
ผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงาน
 
รูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียว
รูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียวรูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียว
รูปเล่มโครงงาน สวนสัตว์เปิดเขาเขียว
 
633 1
633 1633 1
633 1
 

รูปเล่มวิชาโครงงาน

  • 1. เว็บไซต์น้ ายาทาเล็บ (Nail Shop) โดย 1. นางสาวกนกพรรณ ตราช่าง รหัส 51039908 2. นางสาวอาไพรัตน์ นิลพังงา รหัส 51036181 โครงงานนี้เป็ นส่ วนหนึ่งของการศึกษาตามหลักสู ตรวิทยาศาตร์ บณทิต ั ภาควิชาเทคโนโลยีสารสนเทศและการสื่ อสาร คณะเทคโนโลยีสารสนเทศ มหาวิทยาลัยศรี ปทุม พ.ศ.2555
  • 2. มหาวิทยาลัยศรี ปทุม คณะเทคโนโลยีสารสนเทศ โครงงานของ ชื่อ........................................... รหัส................ ชื่อ........................................... รหัส................ เรื่ อง ............................................................................... ได้ รับตรวจสอบและอนุมตให้ เป็ นส่วนหนึงของการศึกษาตาม ัิ ่ หลักสูตรวิทยาศาสตร์ บณฑิต สาขาเทคโนโลยีสารสนเทศและการสื่อสาร ั เมื่อวันที่ ................................... ประธานกรรมการ ........................................ ( ) กรรมการ ......................................... ( ) อาจารย์ที่ปรึกษา ........................................ ( ) กรรมการและเลขานุการ ......................................... ( )
  • 3. ข บทคัดย่ อ เว็บไซต์น ้ายาทาเล็บ (Nail Shop) โดย 1. นางสาวกนกพรรณ ตราช่าง รหัส 51039908 2. นางสาวอาไพรัตน์ นิลพังงา รหัส 51036181 อาจารย์ ท่ ปรึกษา ี ดร.วสุวรรธน์ พงศ์ขจร ___________________________________________________________________________ ปั จจุบนการใช้ ชีวิตประจาวันเป็ นไปอย่างเร่งรี บ การเลือกซื ้อสินค้ าออนไลน์จึงเป็ นที่นยมกันอย่าง ั ิ แพร่หลายมากยิงขึ ้น ซึงเป็ นอีกหนึงทางเลือกที่สามารถเลือกซื ้อสินค้ าได้ สะดวกและประหยัดเวลาได้ อีกด้ วย แต่ ่ ่ ่ อาจมีปัญหาที่ตามมา คือ สินค้ าที่เลือกซื ้อไม่เหมือนในเว็บไซต์ รวมถึงน ้ายาทาเล็บเช่นกัน ที่สในขวดเมื่อลองทา ี แล้ วไม่เหมือนที่คาดหวังไว้ ดังนันเว็บไซต์น ้ายาทาเล็บ จึงมีเทคโนโลยีที่ให้ ผ้ ที่เลือกซื ้อน ้ายาทาเล็บสามารถทดลองสินค้ าก่อน ้ ู เลือกซื ้อได้ และสามารถเลือกผสมสีที่ต้องการได้ จากสีที่ทางเว็บไซต์กาหนดให้ นอกจากนันยังสามารเลือกสีผิว ้ ของนิ ้วมือทีใกล้ เคียงกับผิวตัวเองมากที่สด ซึงจะทาให้ การเลือกซื ้อน ้ายาทาเล็บผ่านทางเว็บไซต์เป็ นทางเลือกที่ ่ ุ ่ เสมือนไปซื ้อหน้ าร้ าน และยังสะดวก รวดเร็วอีกด้ วย
  • 4. กิตติกรรมประกาศ ทางคณะจัดทาเว็บไซต์น ้ายาทาเล็บ (Nail Shop) ขอขอบคุณ ดร.วสุวรรธน์ พงศ์ขจร อาจารย์ที่ ปรึกษาโครงงาน ที่ให้ คาแนะนาต่างๆ และให้ ข้อมูลในการจัดทาโครงงาน และขอขอบคุณอาจารย์ทกท่านที่ให้ ุ ความร่วมมือ ให้ รายละเอียดต่างๆเกี่ยวกับโปรแกรมทีใช้ จดทาโครงงาน และขอขอบคุณ ผู้ที่มีสวนเกี่ยวข้ อง กับ ่ ั ่ เว็บไซต์น ้ายาทาเล็บ (Nail Shop) ทุกท่านที่ทาให้ โครงงานสาเร็จลุลวงไปด้ วยดี ่
  • 5. คานา ปั จจุบนโลกออนไลน์ได้ ก้าวหน้ าไปอย่างไม่หยุดยังและได้ กลายมาเป็ นส่วนหนึง ในการดาเนิน ั ้ ่ ชีวิตประจาวันของมนุษย์ มีการใช้ งานอย่างแพร่หลายในหลายด้ าน ไม่วาจะเป็ นการรับข้ อมูลข่าวสาร การ ่ เชื่อมต่อข้ อมูลการทางาน การพบปะสังคมออนไลน์ รวมไปถึงการเลือกซื ้อสินค้ าบนเว็บไซต์ และเป็ นที่นิยมกัน อย่างแพร่หลาย เนื่องจากความสะดวกสบาย และการพัฒนาด้ านความปลอดภัยในการทาธุรกรรมบน อินเตอร์ เน็ตที่สงขึ ้น จึงเป็ นสาเหตุให้ ร้านค้ าใหม่ๆบนอินเตอร์ เน็ตเกิดขึ ้นอย่างแพร่หลาย ู เมื่อความต้ องการในโลกอินเตอร์ เน็ตสูงขึ ้น จึงเกิดการพัฒนาเว็บไซต์ขายสินค้ าน ้ายาทาเล็บ เพื่อให้ การขายสินค้ าควบคูไปกับเทคโนโลยีบนอินเตอร์ เน็ต เข้ าถึงกลุมลูกค้ ามากขึ ้น ไม่ต้องนังรถไปซื ้อที่ ่ ่ ่ ห้ างสรรพสินค้ า หรื อร้ านตัวแทนจาหน่าย ก็สามารถซื ้อสินค้ าได้ เพียงแค่เข้ าระบบอินเตอร์ เน็ต ก็สามารถเลือก ซื ้อสินค้ าที่ต้องการได้ ข้ อมูลในโครงงานฉบับนี ้ เป็ นการรายงานถึงผลการศึกษาค้ นคว้ า การพัฒนาระบบเว็บไซต์น ้ายาทาเล็บ ที่ผ้ ศกษาได้ นามารวบรวมไว้ ทงจากสือความรู้ และการสรุปการศึกษาด้ วยตนเอง หากมีข้อมูลใดผิดพลาดทาง ู ึ ั้ ่ ผู้จดทาขออภัย ณ ที่นี ้ ั
  • 6. สารบัญ หน้ า ใบอนุมติ ั ก บทคัดย่อ ข กิตติกรรมประกาศ ค คานา ง สารบัญ จ สารบัญรูป ช สารบัญตาราง ญ บทที่ 1 บทนา 1.1 ภูมิหลังความเป็ นมา 1 1.2 วัตถุประสงค์ 1 1.3 ขอบเขตการศึกษา 2 1.4 นิยามศัพท์เฉพาะ 2 1.5 ผลที่คาดว่าจะได้ รับ 3 1.6 แผนการดาเนินงาน 3 1.7 เครื่ องมือที่คาดว่าจะใช้ 5 บทที่ 2 เทคโนโลยีที่ใช้ ในการศึกษาโครงงาน 2.1 แนวคิดและทฤษฎี 6 2.2 เทคโนโลยีที่ใช้ 6
  • 7. สารบัญ (ต่ อ) หน้ า บทที่ 3 การออกแบบระบบ 3.1 การออกแบบกระบวนการเก็บและใช้ ข้อมูล 17 3.2 แผนภาพการทางาน (Flow Chart) ของเว็บไซต์น ้ายาทาเล็บ 18 3.3 แผนภาพแสดงความสัมพันธ์ ระหว่างเอนทิตี ้และแอททิบวต์ ิ 25 3.4 แผนภาพบริ บท(Context Diagram) 29 3.5 แผนภาพกระแสข้ อมูล(Dataflow Diagram) 30 บทที่ 4 การพัฒนาโปรแกรม 4.1 ผลของการศึกษา 32 4.2 การแสดงผลของการพัฒนาโปรแกรมที่สาเร็ จแล้ ว 34 บทที่ 5 สรุปโครงงาน ปั ญหา และข้ อเสนอแนะ 5.1 สรุ ปโครงงาน 41 5.2 ข้ อจากัดของการศึกษา 41 5.3 ข้ อเสนอแนะ 42 5.4 เปรี ยบเทียบกับคูแข่ง ่ 42 บรรณานุกรม 43 ภาคผนวก 44 ภาคผนวก ก วิธีการติดตังโปรแกรม ้ 45 ประวัติผ้ จดทาโครงงาน ูั 64
  • 8. สารบัญรูป รูปที่ หน้ า รูปที่ 2.1 ภาพแสดงคาสังในการแสดงสินค้ า ่ 7 รูปที่ 2.2 ภาพแสดงคาสังกาหนดรูปแบบบนหน้ าเว็บไซต์ ่ 8 รูปที่ 2.3 ภาพแสดงคาสังการตรวจสอบรหัสผ่านในการเข้ าสูระบบ ่ ่ 9 รูปที่ 2.4 ภาพแสดงการสร้ างหน้ าลองสินค้ าบนแฟลช 10 รูปที่ 2.5 ภาพแสดงการจัดการฐานข้ อมูล 11 รูปที่ 2.6 ภาพแสดงการใช้ ภาษา SQL สาหรับการเพิ่ม-แก้ ไขข้ อมูลสินค้ า 12 รูปที่ 2.7 ภาพแสดงการใช้ ภาษา SQL สาหรับในการตรวจสอบ Username 13 รูปที่ 2.8 ภาพแสดงการใช้ ภาษา SQL สาหรับลบสินค้ าในฐานข้ อมูล 14 รูปที่ 2.9 ภาพแสดงการการเชื่อมต่อฐานข้ อมูล 15 รูปที่ 2.10 ภาพแสดงการเพิ่ม-ลบสินค้ าในฐานข้ อมูล 16 รูปที่ 3.1 แผนภาพการแสดงการทางานของ ผู้ใช้ ทวไป สมาชิก และ ผู้ดแลระบบ ั่ ู 17 รูปที่ 3.2 แผนภาพ (Flow Chart) ของระบบเว็บไซต์น ้ายาทาเล็บ 18 รูปที่ 3.3 แผนภาพ (Flow Chart) ของการสมัครสมาชิก 19 รูปที่ 3.4 แผนภาพ (Flow Chart) ของการตรวจสอบสถานการณ์เข้ าสูระบบ ่ 20 รูปที่ 3.5 แผนภาพ (Flow Chart) ส่วนการทางานของสมาชิก 21 รูปที่ 3.6 แผนภาพ (Flow Chart) ส่วนการทางานของผู้ดแลระบบ ู 22 รูปที่ 3.7 แผนภาพ (Flow Chart) ของการทดลองสินค้ า 23
  • 9. สารบัญรูป(ต่ อ) รูปที่ หน้ า รูปที่ 3.8 แผนภาพ (Flow Chart) ของการสังซื ้อสินค้ า ่ 24 รูปที่ 3.9 แผนภาพแสดงความสัมพันธ์ระหว่างเอนทิตี ้ (Entity )และแอททริ บิวต์ (Attribute) 25 รูปที่ 3.10 ภาพแสดงแผนภาพบริ บท (Context Diagram) 29 รูปที่ 3.11 ภาพแสดงการสมัครสมาชิก 30 รูปที่ 3.12 ภาพแสดงการเข้ าสูระบบ ่ 30 รูปที่ 3.13 ภาพแสดงการแก้ ไขข้ อมูลสมาชิก 30 รูปที่ 3.14 ภาพแสดงการทดลองสินค้ า 31 รูปที่ 3.15 ภาพแสดงการสังซื ้อสินค้ า ่ 31 รูปที่ 3.16 ภาพแสดงการวิเคราะห์การสังซื ้อ ่ 31 รูปที่ 4.1 แสดงหน้ าแรกของเว็บไซต์ 34 รูปที่ 4.2 การสมัครสมาชิก 35 รูปที่ 4.3 แสดงหน้ าเข้ าสูระบบ ่ 35 รูปที่ 4.4 แสดงหน้ าทดลองสินค้ า 36 รูปที่ 4.5 แสดงการอัพเดทสินค้ า 37 รูปที่ 4.6 แสดงการสังซื ้อสินค้ า ่ 37 รูปที่ 4.7 แสดงการแก้ ไขข้ อมูลสมาชิก 38
  • 10. สารบัญรูป(ต่ อ) รูปที่ หน้ า รูปที่ 4.8 แสดงวิธีการชาระเงิน 38 รูปที่ 4.9 แสดงข้ อมูลการติดต่อกับเว็บไซต์ 39 รูปที่ 4.10 แสดงประวัตการสังซื ้อ ิ ่ 39 รูปที่ 4.11 แสดงการแก้ ไขโปรโมชัน ่ 40 รูปที่ 5.1 ภาพแสดงหน้ าโฮมเพจเว็บ ยาทาเล็บ.com 42 รูปที่ ก 1.3.1 การติดตังโปรแกรม flash player ้ 45 รูปที่ ก 1.3.2 การติดตังโปรแกรม flash player ้ 46 รูปที่ ก 1.3.3 การติดตังโปรแกรม flash player ้ 46 รูปที่ ก 1.3.4 การติดตังโปรแกรม flash player ้ 47 รูปที่ ก 1.3.5 การติดตังโปรแกรม flash player ้ 47 รูปที่ ก 1.4.1 ภาพแสดงหน้ าโฮมเพจของ MAMP.info 48 รูปที่ ก 1.4.2 ภาพแสดงการติดตังแอพพลิเคชัน ้ ่ 49 รูปที่ ก 1.4.3 ภาพแสดงโฟลเดอร์ MAMP 50 รูปที่ ก 1.4.4 ภาพแสดงกล่องถามสิทธิ์ในการติดตังโปรแกรม MAMP ้ 50 รูปที่ ก 1.4.5 ภาพแสดงหน้ าต่าง MAMP 51 รูปที่ ก 1.4.6 ภาพแสดงหน้ าการตังค่าของ MAMP ้ 52
  • 11. สารบัญรูป(ต่ อ) รูปที่ หน้ า รูปที่ ก 1.4.7 ภาพแสดงหน้ าการตังค่าของ MAMP ้ 53 รูปที่ ก 1.4.8 ภาพแสดงหน้ าการตังค่าของ MAMP ้ 53 รูปที่ ก 1.5.1 ภาพแสดงหน้ าโฮมเพจของเว็บไซต์น ้ายาทาเล็บ 54 รูปที่ ก 1.5.2 ภาพแสดงสินค้ าต่างๆ 55 รูปที่ ก 1.5.3 ภาพหน้ าตะกร้ าสินค้ า 55 รูปที่ ก 1.5.4 ภาพหน้ ากรอกข้ อมูลสมัครสมาชิก 56 รูปที่ ก 1.5.5 ภาพแสดงการตรวจสอบ username ว่าสามารถใช้ ได้ หรื อไม่ 57 รูปที่ ก 1.5.6 ภาพตัวอย่างการกรอกข้ อมูลเพื่อสมัครสมาชิก 57 รูปที่ ก 1.5.7 ภาพแสดงการล็อกอินเข้ าสูระบบ ่ 58 รูปที่ ก 1.5.8 ภาพหน้ าตะกร้ าสินค้ า เมื่อผู้ใช้ มการซื ้อสินค้ า ี 59 รูปที่ ก 1.5.9 ภาพแสดงหน้ าลองสินค้ า 60 รูปที่ ก 1.5.10 ภาพแสดงการสังซื ้อสินค้ าในหน้ าทดลองสินค้ า ่ 61 รูปที่ ก 1.5.11 ภาพแสดงการ tweet ลงในเว็บไซต์ twitter.com เพื่อแชร์ เว็บไซต์ 62 รูปที่ ก 1.5.12 ภาพแสดงการแชร์ เว็บไซต์บน Google+ 62 รูปที่ ก 1.5.13 ภาพแสดงการแสดงความคิดเห็นโดยการเข้ าสูระบบเว็บ facebook.com ่ 63
  • 12. สารบัญตาราง ตารางที่ หน้ า ตารางที 1.1 ตารางแผนการดาเนินงาน 4 ตารางที่ 3.1 แสดงแฟ้ มข้ อมูลสมาชิก 26 ตารางที่ 3.2 แสดงแฟ้ มรายละเอียดการสังซื ้อ ่ 26 ตารางที่ 3.3 แสดงแฟ้ มรายละเอียดการสังซื ้อ ่ 27 ตารางที่ 3.4 แสดงแฟ้ มข้ อมูลสินค้ า 27 ตารางที่ 3.5 แสดงแฟ้ มข้ อมูลโปรโมชัน ่ 28 ตารางที่ 4.1 แสดงกระบวนการทางานของ 1.0 กระบวนการสมัครสมาชิก 32 ตารางที่ 4.2 แสดงกระบวนการทางานของ 2.0 กระบวนการเข้ าสูระบบ ่ 32 ตารางที่ 4.3 แสดงกระบวนการทางานของ 3.0 กระบวนการแก้ ไขข้ อมูลส่วนตัว 32 ตารางที่ 4.4 แสดงกระบวนการทางานของ 4.0 กระบวนการทดลองสินค้ า 33 ตารางที่ 4.5 แสดงกระบวนการทางานของ 5.0 กระบวนการสังซื ้อสินค้ า ่ 33 ตารางที่ 4.6 แสดงกระบวนการทางานของ 6.0 กระบวนการวิเคราะห์สนค้ าขายดี ิ 33
  • 13. บทที่ 1 บทนา 1.1 ภูมิหลังความเป็ นมา ในปั จจุบนถือว่าผูหญิงมักมาคู่กบความสวยความงาม รวมไปถึงน้ ายาทาเล็บที่ทาให้เล็บ ั ้ ั ของผูหญิงดูสะดุดตายิงขึ้น โดยส่ วนใหญ่ผหญิงในปั จจุบนมักทางานจึงไม่ค่อยมีเวลาในการออกไป ้ ่ ู้ ั เลือกซื้ อตามร้านสะดวกซื้ อหรื อตามห้างร้านค้าโดยทัวไป เราจึงนาอินเตอร์ เน็ตและเทคโนโลยีเข้า ่ มาช่วยในด้านธุ รกิจการขายน้ ายาทาเล็บผ่านบนเว็บไซด์เพื่อดึงดูดลูกค้าและทาให้เกิดความ ั ้ สะดวกสบายและรวดเร็ วให้กบผูที่สนใจสิ นค้าน้ ายาทาเล็บและมีความประสงค์ท่ีจะซื้ อน้ ายาทาเล็บ สามารถสังซื้ อได้ทนทีโดยไม่ตองเสี ยเวลาไปซื้ อตามร้านในห้างสรรพสิ นค้าทัวไป ่ ั ้ ่ จึงมีการนาเทคโนโลยีอินเตอร์ เน็ตเข้ามาช่วยในการจัดทาสื่ อโฆษณานาเสนอสิ นค้าน้ ายาทา เล็บเพื่อให้สินค้ามีความน่าสนใจและเป็ นจุดเด่นของทางร้านในการบริ การลูกค้า ลูกค้าสามารถ เลือกสี ตามความต้องการของตนเองได้โดยใช้เทคโนโลยี Flash เข้ามาช่วยทาให้เว็บไซด์เกิดความ น่าสนใจแบะดึงดูดลูกค้าให้เข้ามาสั่งซื้ อสิ นค้าของทางเว็บไซด์มากขึ้น 1.2 วัตถุประสงค์ 1.2.1 เพื่อนามาช่วยในเรื่ องของความสะดวกรวดเร็ ว เน้นเรื่ องการบริ การลูกค้า 1.2.2 เพื่อเพิมความสามารถเพื่อให้ลูกค้าได้เลือกซื้ อสิ นค้าได้สะดวกมากยิงขึ้น ่ ่ 1.2.3 สามารถตอบสนองความต้องการของลูกค้าได้อย่างตรงจุด 1.3 ขอบเขตการศึกษา 1.3.1 ส่ วนของผูใช้ทวไป ้ ่ั 1.3.1.1 สามารถมองเห็นสิ นค้ารวมทั้งรายละเอียดของสิ นค้าได้ ่ 1.3.1.2 สามารถดูขาวสารของเว็บไซต์ได้ 1.3.1.3 สามารถสมัครสมาชิกได้
  • 14. 2 1.3.2 ส่ วนของสมาชิก 1.3.2.1 สามารถมองเห็นสิ นค้ารวมทั้งรายละเอียดของสิ นค้าได้ 1.3.2.2 สามารถดูข่าวสารของเว็บไซต์ได้ 1.3.2.3 สามารถลองสี น้ ายาทาเล็บบนเว็บไซต์ของทางร้านได้ 1.3.2.4 สามารถสั่งซื้ อสิ นค้าบนเว็บไซต์ของทางร้านได้ 1.3.2.5 สามารถผสมสี ที่ตองการเองได้ ้ 1.3.2.6 สามารถเลือกสี นิ้วที่ใกล้เคียงกับตัวเองนี้ได้กกกเองได้แ 11mflkkovmskjbf;lkmbmflml;d 1.3.3 ส่ วนของผูดูแลระบบ ้ 1.3.3.1 สามารถมองเห็นสิ นค้ารวมทั้งรายละเอียดของสิ นค้าได้ 1.3.3.2 สามารถดูข่าวสารของเว็บไซต์ได้ 1.3.3.3 สามารถเพิ่ม แก้ไข ลบข้อมูลของสิ นค้าได้ 1.3.3.4 สามารถลบสมาชิกในเว็บไซต์ได้ 1.4 นิยามศัพท์เฉพาะ 1.4.1 My SQL คือ ระบบจัดการฐานข้อมูลเชิงสัมพันธ์ โดยใช้ภาษา SQL 1.4.2 PHP คือ ภาษาคอมพิวเตอร์ในลักษณะ Server-SideScript โดยลิขสิ ทธิ์ อยูในลักษณะ ่ โอเพนซอร์ส ภาษาPHP ใช้สาหรับจัดทาเว็บไซด์ และแสดงผลออกมาในรู ปแบบ HTML โดยมี รากฐานโครงสร้างคาสั่งมาจากภาษา ภาษาซี ภาษาจาวา และภาษาเพิร์ล 1.4.3 Ajax คือ กลุ่มของเทคนิคในการพัฒนาแอปพลิเคชัน เพื่อให้ความสามารถโต้ตอบกับ ่ ผูใช้ดีข้ ึน โดยการรับส่ งข้อมูลฉากหลัง ทาให้ท้ งหน้าไม่ตองโหลดใหม่ทุกครั้งที่มีการเปลี่ยนแปลง ้ ั ้ ซึ่ งช่วยทาให้เพิ่มการตอบสนอง ความรวดเร็ ว และการใช้งานโดยรวม 1.4.4 JavaScript คือ ภาษาโปรแกรมประเภทหนึ่ง ที่เรี ยกกันว่า “สคริ ปต์” ซึ่งมีวธีการ ิ ทางานในลักษณะ “แปลความและดาเนินงานไปทีละคาสั่ง” ซึ่ งภาษานี้เดิมมีชื่อว่า LiveScript
  • 15. 3 1.4.5 Flash คือ โปรแกรมที่มีความสามารถในด้านการสร้างภาพเคลื่อนไหว ที่ได้รับความ นิยมมากที่สุดในปั จจุบน ซึ่ งได้พฒนาปรับปรุ งเครื่ องมือต่างๆให้มีความสามารถใช้งานได้สะดวก ั ั สามารถใช้ผลิตสื่ อการสอนเชิงตอบโต้ได้ 1.5 ประโยชน์ ทคาดว่าจะได้ รับ ี่ 1.5.1 ทาให้ได้รับความรู้ในการพัฒนาทางด้านการใช้ภาษา HTML 1.5.2 นาความรู ้ที่ได้ไปใช้เป็ นพื้นฐานในการปฏิบติงานหรื อการประกอบอาชีพได้ ั 1.5.3 เพื่อศึกษาออกแบบฐานข้อมูลการจัดเก็บสิ นค้าบนเว็บไซด์ 1.6 แผนการดาเนินงาน 1.6.1 ศึกษาแนวคิด ทฤษฏีและเอกสารที่เกี่ยวข้อง 1.6.2 ศึกษาเทคโนโลยีที่จะใช้ 1.6.3 การระบุปัญหา 1.6.4 การรวบรวมข้อมูลและการจัดการข้อมูล 1.6.5 การวิเคราะห์ขอมูลหรื อการออกแบบระบบและโปรแกรม ้ 1.6.6 การสร้างตัวแบบหรื อการพัฒนาโปรแกรม 1.6.7 ทดสอบติดตั้งระบบหรื อการทดสอบตัวแบบ 1.6.8 จัดทาเอกสาร
  • 16. 4 ตารางแผนการดาเนินงาน ตารางแผนการดาเนินงาน ระยะเวลาดาเนินการ ลาดับ กิจกรรม เม.ย.- 55 พ.ค.- 55 ม.ค.- 55 มี.ค.- 55 ส.ค.- 55 มิ.ย.- 55 ก.ค.- 55 ก.ย.- 55 ก.พ.55 1 ศึกษาแนวคิด ทฤษฏีและเอกสารที่ เกียวข้ อง ่ 2 ศึกษาเทคโนโลยีทจะใช้ ี่ 3 การระบุปัญหา 4 การรวบรวมข้ อมูลและการจัดการ ข้ อมูล 5 การวิเคราะห์ ข้อมูลหรือการออกแบบ ระบบและโปรแกรม 6 การสร้ างตัวแบบหรือการพัฒนา โปรแกรม 7 ทดสอบการติดตั้งระบบหรือการ ทดสอบตัวแบบ 8 จัดทาเอกสาร ตารางที 1.1 ตารางแผนการดาเนินงาน หมายเหตุ หมายถึง ระยะเวลาดาเนินการ
  • 17. 5 1.7 เครื่องมือทีคาดว่าจะใช้ ่ 1.7.1 อุปกรณ์คอมพิวเตอร์ที่ใช้ในการทาโครงงาน 1.7.1.1 Macbook Pro 13 Inc. GHz intel Core i5 4GB 1333 MHz DDR3 Macintosh HD 256GB 1.7.1.2 เครื่ องพิมพ์ปริ้ นเตอร์ 1.7.2 โปรแกรมที่สั่งงาน 1.7.2.1 ระบบปฏิบติการ Mac OS X version 10.6.8 ั 1.7.2.2 ระบบปฏิบติการ Window7 Ultimate ั 1.7.2.3 ฐานข้อมูล My SQL 1.7.2.4 โปรแกรม Adobe Photoshop CS5 1.7.2.5 โปรแกรม Microsoft Word 2010 1.7.2.6 โปรแกรม Adobe Dreamweaver CS5 1.7.2.7 โปรแกรม Microsoft Office Power Point 2010 1.7.2.8 โปรแกรม Microsoft Office Visio 2010 1.7.2.9 โปรแกรม Adobe Flash 1.7.2.10 เครื่ องมือเขียนโค้ด Edit Plus 1.7.2.11 โปรแกรม MAMP 1.7.2.12 โปรแกรม Adobe Flash CS5
  • 18. 6 บทที่ 2 แนวคิด ทฤษฎีและเอกสารที่เกี่ยวข้อง แนวคิดและทฤษฎี เทคโนโลยีสารสนเทศและการสื่ อสาร ระบบสารสนเทศ(Information Technology) ซอฟท์แวร์ (Software) เทคโนโลยีทใช้ ี่ HTML - HTML หรื อ Hypertext Markup Language เป็ นภาษาคอมพิวเตอร์ รูปแบบหนึ่ง ที่มี โครงสร้างการเขียนโดยอาศัยตัวกากับ (Tag) ควบคุมการแสดงผลข้อความ, รู ปภาพ หรื อวัตถุอื่นๆ ผ่านโปรแกรมเบราเซอร์ แต่ละ Tag อาจจะมีส่วนขยายที่เรี ยกว่า Attribute สาหรับระบุ หรื อควบคุมการแสดงผล ของเว็บได้ดวย HTML ้ ( http://www.ptbk.ac.th/htmlweb/html01.html ) โดยในส่ วน ของ ภาษา HTML นั้น ครอบคลุมทั้งตัวเว็บไซต์เพื่อการแสดงผลบนหน้าเว็บ Browser สาหรับเทคนิคหลักๆที่นามาใช้จะเป็ นการสร้างตารางสาหรับลองสี เล็บทีละนิ้ว และการแสดง สิ นค้าบนหน้า web page
  • 19. 7 รู ปที่ 2.1 ภาพแสดงคาสั่งในการแสดงสิ นค้า การแสดงสิ นค้ าบนหน้ า Webpage โดยการสร้างตารางเพื่อวางรู ปสิ นค้า ให้มีความเรี ยบร้อย สวยงาม
  • 20. 8 CSS - CSS คือ ชุดคาสั่งที่ใช้สาหรับการกาหนดการแสดงผลข้อมูลหน้าเว็บเพจ ซึ่งคาเต็ม ๆ ของ CSS คือ Cascading Style Sheets เป็ นมาตรฐานหนึ่งของ W3C ที่กาหนดขึ้นมา เพื่อใช้ในการตบแต่งหน้าเอกสารเว็บเพจโดยเฉพาะ การใช้งาน CSS จะเข้ามาช่วยเพิ่ม ั ่ ความสามารถให้กบ HTML เดิมที่เราใช้งานกันอยูในปั จจุบน ซึ่ งในปั จจุบน ั ั ่ นี้ CSS ได้มาอยูบนมาตรฐานที่เวอร์ ชน 2.0 (CSS2.0) ั - ความสามารถของ CSS CSS ทาให้การปรับปรุ งเว็บเพจในส่ วนของการแสดงผลทาได้อย่างรวดเร็ วขึ้น เนื่องจากเราสามารถปรับปรุ งคุณสมบัติของการแสดงผลได้จากจุด ๆ เดียวแล้วส่ งผล ให้ท้ งหน้าเพจที่มีการใช้งาน CSS นั้นปรับปรุ งให้เป็ นไปตามที่เราแก้ไข ั (http://bu.lpc.rmutl.ac.th/naravit/begin-programming/basic_PHP/css_mean.htm) รู ปที่ 2.2 ภาพแสดงคาสั่งกาหนดรู ปแบบบนหน้าเว็บไซต์ การกาหนดรู ปแบบกล่ อง Tooltip ให้ แสดงผลบนหน้ าเว็บ โดยในส่ วนของเว็บไซต์ยาทาเล็บนั้นได้นา CSS มาใช้ในหลายส่ วนสาหรับการจัดรู ปแบบ ตัวอักษรและการแสดงผลในหน้าต่างๆ สาหรับโค้ดที่จะนามาเสนอนี้ จะเป็ นการนามาใช้จดรู ปแบบ ั การแสดงผลของกล่องข้อความโต้ตอบซึ่ งเมื่อผูใช้เลื่อนเม้าส์ไปวางที่รูปสิ นค้าน้ ายาทาเล็บแล้วจะมี ้ กล่องข้อความอธิ บายถึงตัวสิ นค้านั้นๆแสดงขึ้นมา
  • 21. 9 Ajax - เป็ นเทคนิคหรื อวิธีการที่เกี่ยวข้องกับการพัฒนาโปรแกรมแบบเว็บแอพพลิเคชัน (Web ่ Application) โยช่วยให้เราดึงข้อมูลจากเซิ ร์ฟเวอร์ มาปรับปรุ งหน้าเว็บเพจได้โดยที่ บราวเซอร์ ไม่ตองโหลดเพจใหม่มาทั้งเพจ หน้าจอของบราวเซอร์ จึงไม่กระพริ บ และ ้ ทาให้การใช้งานเว็บแอพพลิเคชันมีความรู ้สึกแบบเดียวกับเดสก์ทอปแอพพลิเคชัน ่ ็ ่ หรื ออย่างน้อยก็ให้ความรู ้สึกที่ใกล้เคียงกันมากขึ้น (พร้อมเลิศ หล่อวิจิตร,2551 คู่มือเรี ยน AJAX สาหรับผูเ้ ริ่ มต้น) รู ปที่ 2.3 ภาพแสดงคาสั่งการตรวจสอบรหัสผ่านในการเข้าสู่ ระบบ การตรวจสอบรหัสผ่ านในการเข้ าสู่ ระบบ
  • 22. 10 โดยแสดงเป็ นกล่อง Alert ขึ้นมา ไม่ตองเสี ยเวลาโหลดหน้าเว็บใหม่ท้ งหน้า ้ ั Adobe Flash รู ปที่ 2.4 ภาพแสดงการสร้างหน้าลองสิ นค้าบนแฟลช การสร้ างหน้ าลองสิ นค้ าบนแฟลช โดยในรายวิชา ICT491 ได้ทดลองใช้เทคโนโลยี Java Script ในการพัฒนาตัวมือ และการ คลิ๊กที่ขวดน้ ายาทาเล็บแล้วนามาแปะบนนิ้วทีละนิ้ว โดยบ่างภาพมือเป็ นตาราง 10 คอลัมน์ จาก การศึกษาค้นคว้าเพิ่มเติมต่อมาได้มีการนาเทคโนโลยีแฟลชเข้ามาใช้ในงาน เพื่อความสวยงามและดู ใกล้เคียงกับมือของมนุษย์ให้มากขึ้น
  • 23. 11 Database - ระบบฐานข้อมูล (Database System) หมายถึง โครงสร้างสารสนเทศที่ประกอบด้วย รายละเอียดของข้อมูลที่เกี่ยวข้องกันที่จะนามาใช้ในระบบต่าง ๆ ร่ วมกันระบบ ฐานข้อมูล จึงนับว่าเป็ นการจัดเก็บข้อมูลอย่างเป็ นระบบ ซึ่ งผูใช้สามารถจัดการกับ ้ ข้อมูลได้ในลักษณะต่าง ๆ ทั้งการเพิ่ม การแก้ไข การลบ ตลอดจนการเรี ยกดูขอมูล ซึ่ง ้ ส่ วนใหญ่จะเป็ นการประยุกต์นาเอาระบบคอมพิวเตอร์ เข้ามาช่วยในการจัดการ ฐานข้อมูล (นอ. อโณทัย นอบไทย, 2544 การออกแบบระบบฐานข้อมูลเชิงสัมพันธ์) - ฐานข้อมูล (Database) หมายถึง กลุ่มของข้อมูลที่มีความสัมพันธ์กน นามาเก็บรวบรวม ั เข้าไว้ดวยกันอย่างมีระบบและข้อมูลที่ประกอบกันเป็ นฐานข้อมูลนั้น ต้องตรงตาม ้ วัตถุประสงค์การใช้งาน (http://mpnn2551.net46.net/Subjects/DBMS32042014/dataBaseIntro.html) รู ปที่ 2.5 ภาพแสดงการจัดการฐานข้อมูล การจัดการฐานข้ อมูลโดยโปรแกรม MAMP สาหรับ Mac OS x
  • 24. 12 (Macintosh, Apache, Mysql and PHP) เป็ นโปรแกรมจาลองเซิฟเวอร์เพื่อการพัฒนา ระบบ หรื อเว็บแอพพลิเคชันโดยมีลกษณะคล้ายกับตัว Appserve ในฝั่ง Window ่ ั SQL - เอสคิวแอล (SQL) คือ ภาษาสอบถามข้อมูล หรื อภาษาจัดการข้อมูลอย่างมีโครงสร้าง มี การพัฒนาภาษาคอมพิวเตอร์ และโปรแกรมฐานข้อมูลที่รองรับมากมาย เพราะจัดการ ข้อมูลได้ง่าย เช่น MySQL, PostgreSQLหรื อ MS Access เป็ นต้น (http://www.choosak.com/page-29/) รู ปที่ 2.6 ภาพแสดงการใช้ภาษา SQL สาหรับการเพิ่ม-แก้ไขข้อมูลสิ นค้า การใช้ ภาษา SQL สาหรับการเพิม-แก้ ไขข้ อมูลสิ นค้ าในฐานข้ อมูล ่
  • 25. 13 โดยรับข้อมูล id ของสิ นค้านั้นๆที่ส่งมาเก็ฐไว้ในตัวแปร เพื่อค้นหาสิ นค้าตัวนั้นนามาคิวรี่ ข้อมูลให้ผใช้แก้ไข ู้ รู ปที่ 2.7 ภาพแสดงการใช้ภาษา SQL สาหรับในการตรวจสอบ Username การใช้ ภาษา SQL ในการตรวจสอบ Username ่ ่ สาหรับการสมัครสมาชิกใหม่เพื่อดูวาชื่ อนี้มีอยูแล้วหรื อไม่ในฐานข้อมูล หากชื่อนั้นๆถูก ใช้แล้วจะไม่สามารถใช้ชื่อซ้ ากันได้
  • 26. 14 รู ปที่ 2.8 ภาพแสดงการใช้ภาษา SQL สาหรับลบสิ นค้าในฐานข้อมูล การใช้ ภาษา SQL สาหรับลบสิ นค้ าในฐานข้ อมูล โดยการสร้างตัวแปรเพื่อใช้ในการลบสิ นค้าซึ่งมี id เป็ น Primery key สิ นค้าจะถูกลบ ต่อเมื่อ มี id ตรงตามที่ขอมูลส่ งออกไป ้
  • 27. 15 PHP ั - ภาษาสคริ ปต์ที่สามารถเขียนโค้ดคาสั่งรวมไว้กบภายในเอกสาร HTML ได้เช่นเดียวกับ ภาษา JavaScript แต่ต่างกันที่ ภาษา PHP เป็ นภาษาสคริ ปต์ที่ทางานในฝั่งเซิ ร์ฟเวอร์ (Server – Side Script Language) คือ โค้ดคาสังของ PHP จะถูกประมวลผลในฝั่ง ่ เซิ ร์ฟเวอร์ แล้วส่ งผลลัพธ์ในรู ปแบบของ HTML กลับไปยังไคลเอนต์ที่ร้องขอ โดย โค้ดของ PHP นี้ผใช้ในฝั่งไคลเอนต์จะไม่สามารถมองเห็นได้ ู้ (พิรพร หมุนสนิท, 2551 พื้นฐานการโปรแกรมบนเว็บ Web Programming Fundamentals) รู ปที่ 2.9 ภาพแสดงการการเชื่อมต่อฐานข้อมูล การเชื่ อมต่ อฐานข้ อมูล โดยการสร้างตัวแปรขึ้นมา 1 ตัว ในการเชื่อมต่อกับฐานข้อมูล หากการติดต่อผิดพลาด หรื อไม่สามารถทางานได้ ระบบจะแสดงข้อความ Could not connect : ตามด้วยสาเหตุที่ไม่สามารถ เชื่อมต่อได้
  • 28. 16 รู ปที่ 2.10 ภาพแสดงการเพิ่ม-ลบสิ นค้าในฐานข้อมูล การเพิม-ลบสิ นค้ าในฐานข้ อมูล ่
  • 29. 17 บทที่ 3 การออกแบบระบบ 3.1 การออกแบบกระบวนการเก็บและใช้ ข้อมูล 3.1.1 แผนภาพแดสงการทางานของผูใช้ระบบ ( Use Case Diagram ) เว็บไซต์น้ ายาทาเล็บ ้ Social Pugin รู ปที่ 3.1 แผนภาพการแสดงการทางานของ ผูใช้ทวไป สมาชิก และ ผูดูแลระบบ ้ ั่ ้
  • 30. 18 3.1.2 แผนภาพการทางาน (Flow Chart) ของเว็บไซต์ นายาทาเล็บ ้ รู ปที่ 3.2 แผนภาพ (Flow Chart) ของระบบเว็บไซต์น้ ายาทาเล็บ
  • 31. 19 รู ปที่ 3.3 แผนภาพ (Flow Chart) ของการสมัครสมาชิก
  • 32. 20 , รู ปที่ 3.4 แผนภาพ (Flow Chart) ของการตรวจสอบสถานการณ์เข้าสู่ ระบบ
  • 33. 21 รู ปที่ 3.5 แผนภาพ (Flow Chart) ส่ วนการทางานของสมาชิก
  • 34. 22 รู ปที่ 3.6 แผนภาพ (Flow Chart) ส่ วนการทางานของผูดูแลระบบ ้
  • 35. 23 รู ปที่ 3.7 แผนภาพ (Flow Chart) ของการทดลองสิ นค้า
  • 36. 24 รู ปที่ 3.8 แผนภาพ (Flow Chart) ของการสั่งซื้ อสิ นค้า
  • 37. 25 3.3 แผนภาพแสดงความสัมพันธ์ระหว่างเอนทิต้ ี (Entity-Relationship Diagrams) รู ปที่ 3.9 แผนภาพแสดงความสัมพันธ์ระหว่างเอนทิต้ ี (Entity )และแอททิบิวต์ (Attribute)
  • 38. 26 ชื่อตาราง Customer วัตถุประสงค์ เก็บข้อมูลสมาชิก แฟมทีเ่ กี่ยวข้ อง ไม่มี ้ ตารางที่ 3.1 แสดงแฟ้ มข้อมูลสมาชิก ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่า ตรวจสอบ ประเภทคีย ์ (Sequence (Attribute) (Description) (Width) (Type) เบื้องต้น ความถูกต้อง (Key Type) No.) (Defult) (Validation Check) 1 Username ชื่อสมาชิก 20 varcha - ตัวเลขและตัวอักษร PK 2 Password รหัสผ่าน 20 varcha - ตัวเลขและตัวอักษร - 3 Tel เบอโทรศัพท์ 20 varcha - ตัวเลขและตัวอักษร - 4 Address ที่อยู่ 100 varcha - ตัวเลขและตัวอักษร - 5 E-mail อีเมล์ 64 varcha - ตัวเลขและตัวอักษร - 6 Type ประเภทของ 10 varcha customer ตัวเลขและตัวอักษร - สมาชิก ชื่อตาราง Orders วัตถุประสงค์ เก็บข้อมูลการสั่งซื้ อ แฟมทีเ่ กี่ยวข้ อง ไม่มี ้ ตารางที่ 3.2 แสดงแฟ้ มรายละเอียดการสั่งซื้ อ ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่า ตรวจสอบ ประเภทคีย ์ (Sequence (Attribute) (Description) (Width (Type) เบื้องต้น ความถูกต้อง (Key Type) No.) ) (Defult) (Validation Check) 1 Order_Id เลขที่การ 20 int - ตัวเลข PK สังซื้ อ ่ FK 2 Date วันสั่งซื้ อ - date - - 3 Customer_Id รหัสลุกค้า 10 varcha - ตัวเลขและตัวอักษร -
  • 39. 27 ชื่อตาราง Order_Detail วัตถุประสงค์ เก็บข้อมูลรายละเอียดการสั่งซื้ อ แฟมทีเ่ กี่ยวข้ อง ไม่มี ้ ตารางที่ 3.3 แสดงแฟ้ มรายละเอียดการสั่งซื้ อ ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่า ตรวจสอบ ประเภทคีย ์ (Sequence (Attribute) (Description) (Width) (Type) เบื้องต้ ความถูกต้อง (Key Type) No.) น (Validation Check) (Defult) 1 Order_Id รหัสการสังซื้ อ ่ 11 int - ตัวเลข PK 2 Product_Id รหัสสิ นค้า 11 int - ตัวเลข FK 3 Quentity จานวน 11 int - ตัวเลข - 4 Price ราคา 6,2 float - ตัวเลข - ชื่อตาราง Product วัตถุประสงค์ เก็บข้อมูลสิ นค้า แฟมทีเ่ กี่ยวข้ อง ไม่มี ้ ตารางที่ 3.4 แสดงแฟ้ มข้อมูลสิ นค้า ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่า ตรวจสอบ ประเภทคีย ์ (Sequence (Attribute) (Description) (Width) (Type) เบื้องต้น ความถูกต้อง (Key Type) No.) (Defult) (Validation Check) 1 Product_Id รหัสสิ นค้า 10 int - ตัวเลข PK 2 Name ชื่อสิ นค้า 100 varcha - ตัวอักษร - 3 Detail รายละเอียด 300 varcha - ตัวอักษร - 4 Image รู ปสิ นค้า 100 varcha - ตัวอักษร - 5 Price ราคา 6,2 float - ตัวเลข -
  • 40. 28 6 Amount จานวนสิ นค้า 10 int - ตัวเลข - 7 Username ชื่อสมาชิก 100 varcha - ตัวอักษร - 8 Type กาหนด 10 int - ตัวเลข - ประเภทสิ นค้า ชื่อตาราง Promotion วัตถุประสงค์ เก็บข้อมูลโปรโมชัน ่ แฟมทีเ่ กี่ยวข้ อง ไม่มี ้ ตารางที่ 3.5 แสดงแฟ้ มข้อมูลโปรโมชัน ่ ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่า ตรวจสอบ ประเภทคีย ์ (Sequence (Attribute) (Description) (Width) (Type) เบื้องต้น ความถูกต้อง (Key Type) No.) (Defult) (Validation Check) 1 Id เลขที่ 20 varcha - ตัวเลขและตัวอักษร PK โปรโมชัน ่ 2 Title หัวเรื่ อง 20 varcha - ตัวเลขและตัวอักษร - โปรโมชัน ่ 3 Description อธิบาย 20 varcha - ตัวเลขและตัวอักษร - เกี่ยวกับ โปรโมชัน ่ 4 Image รู ปภาพ 100 varcha - ตัวเลขและตัวอักษร - ประกอบ 5 Enable สาหรับ 64 varcha - ตัวเลขและตัวอักษร - กาหนดว่าเปิ ด ใช้งาน โปรโมชันนี้ ่ หรื อไม่
  • 41. 29 3.1.4 แผนภาพบริบท (Context Diagram) ขั้นตอนการทางานของ Context Diagram ส่ วนที่แสดงจุดเริ่ มต้นหรื อแหล่งกาเนิดและเป็ นจุด ที่ผใช้ขอมูลในเว็บไซต์น้ ายาทาเล็บซึ่งภาพบริ บทนี้จะเป็ นตัวกาหนดขอบเขตของระบบ เว็บไซต์ ู้ ้ น้ ายาทาเล็บ ดังรู ปที่ 3.10 Social Plugin Social Plugin Social Plugin รู ปที่ 3.10 ภาพแสดงแผนภาพบริ บท (Context Diagram)
  • 42. 30 3.1.5 แผนภาพกระแสข้ อมูล (Dataflow Diagram) กระบวนการท างานของกระบวนภาพกระแสข้อมูล (Dataflow Diagram) จะเป็ นแผนภาพที่ ช่วยแสดงให้เห็นถึงการไหลของข้อมูลระหว่างกระบวนการต่างๆในลักษณะของรู ปภาพซึ่ งมี ประโยชน์ในด้านรายละเอียดของขั้นตอนการปฏิบติงานและการจัดทาโครงสร้างตารางข้อมูลต่างๆ ั ที่เกี่ยวเนื่องกันทั้งหมด ที่ใช้ ในเว็บไซต์น้ ายาทาเล็บ โดยการแสดงผลแบบรู ปภาพนั้นจะสามารถทา ให้ เข้าใจได้ง่ายและตรงกันมากขึ้น โดย การทางานแผนภาพกระแสข้อมูลนี้จะแบ่งการท างานของ เว็บไซต์น้ ายาทาเล็บ ออกเป็ นกระบวนการต่างๆ โดยแต่ละขั้นตอนนั้นก็จะแสดงให้ เห็นถึงการไหล ของข้อมูลซึ่ งในแผนภาพกระแสข้อมูลของจะมีกระบวนการดังนี้ , , , , , , 1.0 D1 รู ปที่ 3.11 ภาพแสดงการสมัครสมาชิก , , , D2 2.0 , , , D1 รู ปที่ 3.12 ภาพแสดงการเข้าสู่ ระบบ , , , , 3.0 , , D1 รู ปที่ 3.13 ภาพแสดงการแก้ไขข้อมูลสมาชิก
  • 43. 31 D3 4.0 D4 รู ปที่ 3.14 ภาพแสดงการทดลองสิ นค้า D3 5.0 D4 รู ปที่ 3.15 ภาพแสดงการสั่งซื้ อสิ นค้า 6.0 D4 รู ปที่ 3.16 ภาพแสดงวิเคราะห์การสั่งซื้ อ
  • 44. 32 บทที่ 4 ผลของการศึกษา ผลของการศึกษา คือ สิ่ งที่ได้จากการพัฒนาโปรแกรมที่สาเร็ จแล้วที่ได้มาจากการศึกษาค้นคว้า 4.1 กระบวนการทางานทั้งหมดของโปรแกรมมีดังนี้ ชื่อกระบวนการ 1.0 คาอธิบายการทางาน หมายเหตุ เป็ นวิธีใช้สาหรับสมัครสมาชิ กใหม่ และจัดเก็บ สมัครสมาชิก ข้อมูลลงฐานข้อมูล โดยมีการตรวจสอบข้อมูลใน ระบบไม่ให้ขอมูลซ้ ากัน ้ ตารางที่ 4.1 แสดงกระบวนการทางานของ 1.0 กระบวนการสมัครสมาชิก ชื่อกระบวนการ 2.0 คาอธิบายการทางาน หมายเหตุ เป็ นวิธีที่สมาชิกใช้ในการเข้าสู่ ระบบ โดยการใส่ เข้าสู่ ระบบ ชื่อเข้าสู่ ระบบ รหัสผ่านของตนเอง ตารางที่ 4.2 แสดงกระบวนการทางานของ 2.0 กระบวนการเข้าสู่ ระบบ ชื่อกระบวนการ 3.0 คาอธิบายการทางาน หมายเหตุ เป็ นวิธีที่สมาชิกใช้สาหรับแก้ไขหรื อ แก้ไขข้อมูลส่ วนตัว เปลี่ยนแปลงข้อมูลส่ วนตัว ของสมาชิก ตารางที่ 4.3 แสดงกระบวนการทางานของ 3.0 กระบวนการแก้ไขข้อมูลส่ วนตัว
  • 45. 33 ชื่อกระบวนการ 4.0 คาอธิบายการทางาน หมายเหตุ การทดลองสิ นค้า เป็ นการทดลองสี น้ ายาทาเล็บและผสมสี ดวย ้ ตนเองบันทึกเพื่อสังซื้ อ ่ ตารางที่ 4.4 แสดงกระบวนการทางานของ 4.0 กระบวนการทดลองสิ นค้า ชื่อกระบวนการ 5.0 คาอธิบายการทางาน หมายเหตุ การสั่งซื้ อสิ นค้า เป็ นการสั่งซื้ อสิ นค้า เมื่อสมาชิกได้เลือกสิ นค้า ระบบจะคานวณราคารวมของสิ นค้าทั้งหมด ตารางที่ 4.5 แสดงกระบวนการทางานของ 5.0 กระบวนการสังซื้ อสิ นค้า ่ ชื่อกระบวนการ 6.0 คาอธิบายการทางาน หมายเหตุ การวิเคราะห์สินค้าขายดี เป็ นการนาข้อมูลการสังซื้ อสิ นค้ามาวิเคราะห์ ่ และแสดงผลการวิเคราะห์ในรู ปแบบกราฟ วงกลม ตารางที่ 4.6 แสดงกระบวนการทางานของ 6.0 กระบวนการวิเคราะห์สินค้าขายดี
  • 46. 34 4.2 การแสดงผลของการพัฒนาโปรแกรมทีสาเร็จแล้ว ่ 4.2.1 หน้าแรก รู ปที่ 4.1 แสดงหน้าแรกของเว็บไซต์ หน้าแรกของเว็บไซต์มีการแสดงสิ นค้าและราคาของสิ นค้าทั้งหมด โปรโมชันของ ่ ทางเว็บไซต์ และสามารถเข้าสู่ หน้าต่างๆขอเว็บไซต์ได้จากหน้าแรกของเว็บไซต์
  • 47. 35 4.2.2 หน้าสมัครสมาชิก รู ปที่ 4.2 การสมัครสมาชิก แสดงการสมัครสมาชิก โดยใส่ Username ,Password ,Tel และAddress 4.2.3 หน้าเข้าสู่ ระบบ รู ปที่ 4.3 แสดงหน้าเข้าสู่ ระบบ แสดงการเข้าสู่ ระบบของสมาชิกและผูดูและระบบ โดยมีการใส่ Username และ ้ Password ในช่อง LOGIN
  • 48. 36 4.2.4 หน้าทดลองสิ นค้า รู ปที่ 4.4 แสดงหน้าทดลองสิ นค้า แสดงสิ นค้าทั้งหมด และสามารถทดลองสิ นค้าบนเล็บมือที่เตรี ยมไว้ให้ โดยสี ผว ิ ของมือก็จะสามารถเลือกเฉดสี ผวได้ 6 เฉดสี สมาชิกยังสามารถผสมสี จากสี ที่กาหนดไว้ให้ เพื่อให้ ิ ได้สี่ที่ตองการได้ดวยตนเอง ้ ้
  • 49. 37 4.2.5 หน้าลองสิ นค้า (การอัพเดทสิ นค้า) รู ปที่ 4.5 แสดงการอัพเดทสิ นค้า แสดงสิ นค้าที่หมดในหน้าทดลองจะมีการเบลอภาพสิ นค้าและสิ นค้าที่หมดจะไม่ สามารถทดลองสิ นค้านั้นๆได้ 4.2.6 หน้าตะกร้าสิ นค้า รู ปที่ 4.6 แสดงการสั่งซื้ อสิ นค้า แสดงสิ นค้าทั้งหมดที่มีการเลือกสั่งซื้ อสิ นค้า
  • 50. 38 4.2.7 หน้า Edit Profile รู ปที่ 4.7 แสดงการแก้ไขข้อมูลสมาชิก แสดงข้อมูลส่ วนตัวของสมาชิกและสามารถแก้ไขข้อมูลส่ วนตัวได้ 4.2.8 หน้าวิธีการชาระเงิน รู ปที่ 4.8 แสดงวิธีการชาระเงิน แสดงช่องทางและวิธีการชาระเงิน เมื่อสมาชิกต้องการสั่งซื้ อสิ นค้า
  • 51. 39 4.2.9 หน้า Contact us รู ปที่ 4.9 แสดงข้อมูลการติดต่อกับเว็บไซต์ แสดงข้อมูลที่สามารถติดต่อกับทางเว็บไซต์ เพื่อสอบถามและสังซื้ อสิ นค้า ่ 4.2.10 หน้าประวัติ รู ปที่ 4.10 แสดงประวัติการสั่งซื้ อ แสดงประวัติการสั่งซื้ อสิ นค้าของสมาชิก
  • 52. 40 4.2.11 หน้า Edit Promotion รู ปที่ 4.11 แสดงการแก้ไขโปรโมชัน ่ แสดงโปรโมชันทั้งหมด และสามรถเพิ่ม แก้ไข ลบโปรโมชันได้ และต้องมีการเข้าสู่ ่ ่ ระบบโดยใช้ username ของ admin เท่านั้น
  • 53. 41 บทที่ 5 สรุ ปผลการศึกษา การอภิปราย และข้อเสนอแนะ 5.1 การอภิปรายผล เว็บไซต์ Nail Colors นั้น เป็ นทางเลือกใหม่ของผูซ้ื อสิ นค้าประเภทยาทาเล็บ โดยมีฟังก์ชน ้ ั่ ที่ให้ลูกค้าสามารถลองสิ นค้าบนนิ้วมือ(ที่จดไว้ให้) และยังสามารถเลือกสี ผวหนังมือให้ตรงกับ ั ิ ความต้องการ สร้างความโดนเด่นให้บริ การผ่านเว็บซื้ อสิ นค้าอีกระดับ อีกทั้งยังรวมไปถึง ฟังก์ชนการผสมสี เป็ นทางเลือกแก่ผที่ตองการความแปลกใหม่ ต้องการสี ที่ไม่เหมือนใคร เพิ่ม ั่ ู้ ้ ความแปลกใหม่ ดึงดูดความสนใจให้ตวสิ นค้า ั 5.2 ข้ อจากัดของการศึกษา 5.2.1) ซอฟท์แวร์ บางตัวที่ใช้มีราคาสู ง บางตัวมีระยะเวลาจากัดในการให้สิทธิ์ ทดลองใช้ งาน จึงทาให้ไม่สามารถพัฒนาระบบได้อย่างเต็มที่ 5.2.2) ระบบไม่สามารถนาไปทดสอบการใช้งานบนอินเตอร์ เน็ทจริ งได้ จึงไม่ได้รับทราบ ถึงความคิดเห็นคนส่ วนใหญ่ผบริ โภคทุกกลุ่มอายุ ู้ 5.2.3) ระยะเวลาในการพัฒนาด้านแฟลชมีอย่างจากัด ผูพฒนาระบบขาดความรู ้ทางด้าน ้ ั โปรแกรมแฟลช ทาให้ฟังก์ชนการผสมสี ยงขาดความหลากหลาย มีสีที่ยงไม่เพียงพอต่อการบริ การ ั่ ั ั ลูกค้า
  • 54. 42 5.3 ข้ อเสนอแนะ สาหรับข้อเสนอแนะที่ควรมีการนาไปพัฒนาต่อในการต่อยอดเชิงพาณิ ชย์น้ น เว็บไซต์ขาย ั สิ นค้าน้ ายาทาเล็บ ควรมีความหลากหลายในเรื่ องเกี่ยวกับการผสมสี สี ท่ีได้ โดยอาจเพิ่มเติมในส่ วน ของเนื้ อสี เพื่อความโดนเด่นและน่าสนใจยิงขึ้น ่ ในปั จจุบนการเลือกซื้ อสิ นค้าผ่านแอพพลิเคชันบนมือถือ นับว่าเป็ นกระแสที่มาแรงไม่นอย ั ่ ้ ผูบริ โภคนิยมเลือกซื้ อ หรื อหาข้อมูลสิ นค้าผ่านทางมือถือเป็ นส่ วนมาก เนื่องจากความสะดวกสบาย ้ จึงมีความคิดว่าควรพัฒนาต่อยอดในเรื่ องการทาแอพพลิเคชันสาหรับสิ นค้าประเภทนี้ โดยเฉพาะ ่ 5.4 เปรียบเทียบกับคู่แข่ ง วิเคราะห์ความต้องการของลูกค้า โดยยกตัวอย่างเว็บ http://www.ยาทาเล็บ.com/ รู ปที่ 5.1 ภาพแสดงหน้าโฮมเพจเว็บ ยาทาเล็บ.com
  • 55. 43 บรรณานุกรม http://www.w3schools.com/ http://www.ptbk.ac.th/htmlweb/html01.html/ http://bu.lpc.rmutl.ac.th/naravit/begin-programming/basic_PHP/css_mean.htm/ http://mpnn2551.net46.net/Subjects/DBMS32042014/dataBaseIntro.html/ http://www.choosak.com/page-29/ http://www.ยาทาเล็บ.com/ http://thaifreewaredownload.blogspot.com/2010/01/flash-player.html พิรพร หมุนสนิท, 2551 พื้นฐานการโปรแกรมบนเว็บ Web Programming Fundamentals นอ. อโณทัย นอบไทย, 2544 การออกแบบระบบฐานข้อมูลเชิงสัมพันธ์ พร้อมเลิศ หล่อวิจิตร,2551 คู่มือเรี ยน AJAX สาหรับผูเ้ ริ่ มต้น
  • 57. 45 ภาคผนวก ก. ก. 1. โปรแกรมที่ตองใช้ในระบบ ้ ก 1.1) เครื่ องคอมพิวเตอร์ ระบบปฏิบติการ Pentium 4 ขึ้นไป โทรศัพท์มือถือหรื อ ั Tablet ที่สามารถรองรับเทคโนโลยีแฟลชในการแสดงผลได้ ก 1.2) ซอฟต์แวร์ที่จาเป็ นคือ Web browser พร้อมกับปลักอิน ที่รองรับเทคโนโลยี ๊ แฟลช และโปรแกรมจาลองเซิฟเวอร์บนแมค ก 1.3) คู่มือการติดตั้งโปรแกรม flash player ไปที่เว็บ http://get.adobe.com/flashplayer/ จากนั้นคลิกที่ปุ่ม Agree and install now เพื่อเริ่ มการติดตั้ง โดยจะมีขนาดของไฟล์ ประมาณ 1.83 MB. รู ปที่ ก 1.3.1 การติดตั้งโปรแกรม flash player จะแสดงหน้าต่างขอบคุณที่เราดาวน์โหลดโปรแกรมมาใช้งาน จากนั้นให้ เราเปิ ดโปรแกรม flash player ที่เราได้ดาวน์โหลดขึ้นมา เพื่อติดตั้งตามขั้นตอน ต่อไปดังนี้
  • 58. 46 รู ปที่ ก 1.3.2 การติดตั้งโปรแกรม flash player ให้เราคลิกปุ่ ม Run เพื่อเข้าสู่ การติดตั้งโปรแกรม รู ปที่ ก 1.3.3 การติดตั้งโปรแกรม flash player