📸 How to Capture screen website แบบเก๋ๆ

         🙏สวัสดีครับ การเขียน 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 ไม่ต้องโหลดโปรแกรมใดๆ ใช้งานได้ทันที สะดวกมากมาย ที่สำคัญ ฟรี จ้าาา มาถึงตรงนี้แล้วคงสงสัยว่าหน้าตามาจะออกมาเป็นยังไง ไปดูกันเลยยย

           หน้าตาดู Professional ขึ้นมาเลยทันที 😎 อันนี้คือเลือกสีพื้นหลังมา ใส่เงาแล้ว Download รูปออกมาแล้ว ใช้เวลาประมาณ 45-60 วินาที ซึ่งจริงๆแล้วเราสามารถ Customize ส่วนต่างๆได้เช่น ขนาดของ Canvas, การแสดง URL, ประเภทของไฟล์, Scale ของภาพ

หน้าตาของเจ้า Screenshotr จะประกอบด้วย 3 ส่วนหลักๆคือ ส่วนของ Preview รูป, แถบด้านซ้ายสำหรับการปรับค่าต่างๆ, แถบข้างบนสำหรับการใส่ URL และ Upload รูปภาพ

🌈 วิธีการใช้งาน

1. ให้ใส่ URL เข้าไปที่แถบ URL ข้างบนและกดปุ่ม GO สีเขียวด้านขวาบน
   • Capture website ตรงๆ ใส่ URL ได้เลย
   • ใช้รูปที่ Capture ให้กดปุ่ม Upload Image ถัดจากปุ่ม GO มุมขวาบน
2. หลังจากใส่ที่มาของภาพหน้าจอแล้ว ปรับค่าที่แถบด้านซ้ายต่อได้เลย
   • 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 ที่มากกว่า ดังนั้นขนาดไฟล์จะใหญ่กว่า
     • ทั้งนี้ขึ้นกับจุดประสงค์การใช้งานรูปภาพ
3. กด Download มุมซ้ายล่างเพื่อ Save ภาพออกมา

---

           จบไปแล้วสำหรับวิธีใช้งาน มีแค่ 3 ขั้นตอนง่ายๆ ก็ได้ภาพออกมาแบบสวยงาม ยังมีเครื่องมือที่ช่วยอำนวยความสะดวกอีกมากมาย ไว้มีโอกาสนะมา(แนะนำ)ขายของให้ใหม่อีก แล้วพบกันใหม่ สวัสดี 😘🥳🥳