![](https://sysadmin.psu.ac.th/wp-content/uploads/2023/01/Artboard-1@2x-1024x492.png)
🙏สวัสดีครับ การเขียน Blog หรือการทำคู่มือที่เกี่ยวข้องกับระบบสารสนเทศ เพื่อให้ง่ายต่อการอ่านหรือใช้งานระบบ ปกติแล้วเราก็จะใช้ปุ่ม print screen เพื่อ capture หน้าจอแล้วก็ save as image ออกมาเลย หรือเอารูปที่ capture มา ไปใช้กับโปรแกรมอื่นก็ได้ เช่น Photoshop, Illustrator หรือ Mockup Generator เพื่อที่จะได้รูปประกอบที่สวยงามและเหมาะแก่การนำเสนอให้น่าสนใจมากขึ้น
เอาหละ จากที่เกริ่นมา เรามีเครื่องมือมานำเสนอทุกคน เครื่องมือที่จะไปช่วยเรา Capture หน้าจอออกมาแล้วนำมาใส่ในกรอบ Browser เก๋ๆให้เราเลย เราก็แค่ใส่ URL และกด Download ออกมาใช้งานได้เลย เครื่องมือที่ว่ามีชื่อว่า 🎊 “Screenshotr” 🎊 (คำว่า Screenshot + ตัวอักษร r)
Screenshotr เป็นเครื่องมือจัดการ Capture screen และ Mockup ออนไลน์ เปิด Browser ขึ้นไป พิมพ์ที่แถบ URL ไปว่า ฉันจะไปที่ screenshotr.app เข้าผ่านเว็บแบบนี้แสดงว่าาาาา น้องเป็น Online tool ไม่ต้องโหลดโปรแกรมใดๆ ใช้งานได้ทันที สะดวกมากมาย ที่สำคัญ ฟรี จ้าาา มาถึงตรงนี้แล้วคงสงสัยว่าหน้าตามาจะออกมาเป็นยังไง ไปดูกันเลยยย
![](https://sysadmin.psu.ac.th/wp-content/uploads/2023/01/APITestPic1-1024x676.png)
หน้าตาดู Professional ขึ้นมาเลยทันที 😎 อันนี้คือเลือกสีพื้นหลังมา ใส่เงาแล้ว Download รูปออกมาแล้ว ใช้เวลาประมาณ 45-60 วินาที ซึ่งจริงๆแล้วเราสามารถ Customize ส่วนต่างๆได้เช่น ขนาดของ Canvas, การแสดง URL, ประเภทของไฟล์, Scale ของภาพ
หน้าตาของเจ้า Screenshotr จะประกอบด้วย 3 ส่วนหลักๆคือ ส่วนของ Preview รูป, แถบด้านซ้ายสำหรับการปรับค่าต่างๆ, แถบข้างบนสำหรับการใส่ URL และ Upload รูปภาพ
![](https://sysadmin.psu.ac.th/wp-content/uploads/2023/01/screenshotrpic1-1024x618.png)
🌈 วิธีการใช้งาน
- ให้ใส่ URL เข้าไปที่แถบ URL ข้างบนและกดปุ่ม GO สีเขียวด้านขวาบน
- Capture website ตรงๆ ใส่ URL ได้เลย
- ใช้รูปที่ Capture ให้กดปุ่ม Upload Image ถัดจากปุ่ม GO มุมขวาบน
- หลังจากใส่ที่มาของภาพหน้าจอแล้ว ปรับค่าที่แถบด้านซ้ายต่อได้เลย
- Desktop / Mobile : เลือก Device ที่จะแสดงผล
- สามารถเลือก Device ของการแสดงผลได้หรือ Theme ของ browser
- Background : สีพื้นหลัง สามารถใช้เป็น Transparent (ใส) ก็ได้หรือสี Solid, Gradient หรือ Image ก็ได้
- Shadow : ไม่มี / เงาเล็กน้อย / เงาขนาดใหญ่
- Address Bar : ไม่แสดง / URL แบบเรียบๆ (มีแต่ text) / URL แบบมี Icon (favicon) ของเว็บด้วย
- Presets : ขนาดสำเร็จรูปที่เหมาะกับการใช้งานทั่วไป เลือกมาใช้ได้เลย
- Screenshot Resolution : ขนาดของหน้าจอที่จะ Capture
- Tip: เพื่อความอ่านง่ายดูง่าย Size ประมาณ 1280×720 – 1366×768 จะได้ขนาดอักษรที่พอดี
- Canvas Width x Height : ขนาดของรูปภาพที่จะได้ออกมาจากการ Download ออกมา
- Browser Width : ขนาดความกว้างของ Browser ใน Canvas (อิงตาม Aspect ratio)
- Browser Scale : ขนาดของแถบ Browser ข้างบน
- File Name : ชื่อไฟล์
- File Type : ประเภทของไฟล์ PNG / JPEG (รูปพื้นหลังใสต้อง PNG นะครับ อย่าลืม ไม่งั้นจะได้พื้นหลังขาวมา)
- Scale : ความหนาแน่นของ pixel ของรูป Standard เหมาะกับการใช้งานทั่วไป ส่วนของ Retina เหมาะกับการใช้งานกับจอของ apple device
- Retina จะให้ density ของ pixel ที่มากกว่า ดังนั้นขนาดไฟล์จะใหญ่กว่า
- ทั้งนี้ขึ้นกับจุดประสงค์การใช้งานรูปภาพ
- Desktop / Mobile : เลือก Device ที่จะแสดงผล
- กด Download มุมซ้ายล่างเพื่อ Save ภาพออกมา
จบไปแล้วสำหรับวิธีใช้งาน มีแค่ 3 ขั้นตอนง่ายๆ ก็ได้ภาพออกมาแบบสวยงาม ยังมีเครื่องมือที่ช่วยอำนวยความสะดวกอีกมากมาย ไว้มีโอกาสนะมา(แนะนำ)ขายของให้ใหม่อีก แล้วพบกันใหม่ สวัสดี 😘🥳🥳