# \[Project] qID – โปรแกรมแต่งรูปง่ายๆ เพื่อการอัพลงเว็บ

![](https://maxmacstn.files.wordpress.com/2017/05/1.png?w=816)

> #### _qID | Quick Image Develop – โปรแกรมแต่งรูปง่ายๆ อย่างรวดเร็ว ใช้สำหรับแปลงภาพก่อนลงเว็บ_



#### เกี่ยวกับโปรแกรม

* โปรเจ็ค Software Engineer ปี 1 เทอม 1
* ภาษาทีใช้ Python

โปรเจ็ค qID หรือ Quick Image Develop เนี่ย คือโปรแกรมที่ใช้สำหรับปรับแต่งรูปก่อนอัพโหลดลงเว็บ โดยจุดประสงค์หลัคคือเพื่อย่อขนาดและลดไฟล์รูป เพื่อให้อัพลงเน็ตได้เร็วขึ้น และขนาดภาพไม่ใหญ่เกินไปนอกจากนี้ยังมีฟังก์ชั่นการปรับแต่งรูปแบบพื้นฐานให้ปรับกันเพื่อแก้ไขภาพกันก่อนที่จะอัพโหลดด้วย

**ฟีเจอร์ของโปรแกรม**

1. ปรับแต่งแสงและสีอย่างง่าย (Basic Adjustment)
   * Brightness
   * Contrast
   * Saturation
2. ใส่ฟิลเตอร์สำเร็จรูป (Instant Filter)
3. ตั้งค่าความกว้างของรูปที่ต้องการจะ Export
4. ทำรูปให้ดูคมขึ้น (Sharpen) โดยเทคนิค Unsharp Mask เพื่อรักษาความคมชัดของภาพหลังจากการ Export
5. ใส่ลายน้ำลงไปในรูปได้
6. สามารถสร้างและโหลด Preset ได้

**ไลบรารี่ที่ใช้ในโปรแกรม**

1. Pillow – Python Imaging Library(PIL)  ใช้สำหรับการปรับแต่งรูป
2. PIP – ใช้สำหรับ Download Module ที่จำเป็นอัตโนมัตเมื่อเปิดโปรแกรม
3. Tkinter – สำหรับทำ GUI
4. Pickle – สำหรับการเซฟ Preset
5. globe, os, sys – สำหรับการเซฟไฟล์

**เปรียบเทียบภาพก่อนและหลังการปรับแต่งด้วยโปรแกรม qID**

|                   | ![c1](https://maxmacstn.files.wordpress.com/2017/05/c1.jpg?w=736) | ![c2](https://maxmacstn.files.wordpress.com/2017/05/c2.jpg?w=736)                  |
| ----------------- | ----------------------------------------------------------------- | ---------------------------------------------------------------------------------- |
|                   | รูป Original                                                      | รูปที่ได้จากการปรับแต่งด้วยโปรแกรม qID                                             |
| **ขนาดรูปภาพ**    | 3796×2845                                                         | 1080 × 809                                                                         |
| **ขนาดไฟล์**      | 8.36 MB                                                           | 284 KB                                                                             |
| **การปรับแต่งสี** | ยังไม่ได้ปรับ                                                     | <p>–          Brightness</p><p>–          Contrast</p><p>–          Saturation</p> |
| **sharpen**       | ไม่                                                               | ใช่                                                                                |
| **ลายน้ำ**        | ไม่                                                               | ใช่                                                                                |
| **DPI**           | 300                                                               | 96                                                                                 |
|                   | **ทดสอบการโหลดรูปด้วยเน็ต 256kb/s (จำลองด้วย Chrome Devtools)**   |                                                                                    |
| **เวลาที่ใช้**    | 300ms                                                             | 13ms                                                                               |
| **ความเร็ว**      | 1x                                                                | เร็วกว่ารูป Original 23 เท่า                                                       |

#### การใช้งานโปรแกรม

1.
   1. เปิดโปรแกรมโดยใช้ Python 3.5 ขึ้นไป  หลังจากนั้นโปรแกรมจะเริ่มเช็ค Modules ถ้าไม่มี จะทำการโหลดอัตโนมัติ

![2](https://maxmacstn.files.wordpress.com/2017/05/2.png?w=583\&h=276)

* เมื่อโปรแกรมเช็ค Modules เรียบร้อยแล้วก็จะแสดงหน้าหลัก  กดเมนู File > Open image file เพือโหลดภาพเข้าโปรแกรม

![ ปรับแสง ปรับสี รวมทั้งใส่ Filter ได้ตามใจชอบ](https://maxmacstn.files.wordpress.com/2017/05/6.png?w=736)

* สามารถเซฟและโหลด Preset ได้ด้วยเมนู Preset&#x20;

![7](https://maxmacstn.files.wordpress.com/2017/05/7.png?w=736)

* สามารถใส่ลายน้ำหรือ Icon ที่มุมล่างขวาได้โดยเมนู Preset

![8](https://maxmacstn.files.wordpress.com/2017/05/8.png?w=736)



* เมื่อพอใจแล้ว เลือกขนาดไฟล์ที่ต้องการแล้วกด Export&#x20;

![](https://3650666907-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M16IoaANYRvc0I-U9uw%2F-M39FnUksquOPWnwRXhA%2F-M3AADNJvxp_vCNC206l%2Fimage.png?alt=media\&token=191f64fd-50f1-4a5f-b54d-be3a4c6657b0)

**เปรียบเทียบรูปภาพก่อนและหลังการปรับแต่งด้วยโปรแกรม**

![10](https://maxmacstn.files.wordpress.com/2017/05/10.png?w=736)

#### ดาวน์โหลดโปรแกรม | Download qID 2.0

[![tumblr\_inline\_n3uva0VbA31sddigo](https://maxmacstn.files.wordpress.com/2017/05/tumblr_inline_n3uva0vba31sddigo.png?w=736)](https://drive.google.com/file/d/0B4Hf2Sbm0Jx9eEJObmRKSGVTeHc/view?usp=sharing)

**\*นี่เป็นเพียงแค่โปรเจคนักศึกษา ปี 1 อาจจะมีข้อบกพร่องบ้างเล็กน้อย**

Reference : [https://maxmacstn.wordpress.com](https://maxmacstn.wordpress.com/2017/05/28/qid-%E0%B9%82%E0%B8%9B%E0%B8%A3%E0%B9%81%E0%B8%81%E0%B8%A3%E0%B8%A1%E0%B9%81%E0%B8%95%E0%B9%88%E0%B8%87%E0%B8%A3%E0%B8%B9%E0%B8%9B%E0%B8%87%E0%B9%88%E0%B8%B2%E0%B8%A2%E0%B9%86-%E0%B9%80%E0%B8%9E/?fbclid=IwAR1MXcd7ZgkIylWSX9PrKoFU3TUuzCnZR2KC6t_X5sp7590QMe3tA1PtYm0#more-113)
