ยินดีต้อนรับ กรุณา สมัครสมาชิก หรือเข้าสู่ระบบ

Home » webboard » PHOTOSHOP ILLUSTRATOR
เข้าชม : 941

การสร้างเว็บรูปแบบ photorealistic -- CSS / XHTML ใช้ได้

โพสต์เมื่อ: วันพฤหัสบดี 26 พฤษภาคม 2554  01:31 น.

photo-realistic-layoutในกวดวิชานี้ฉันจะแสดงวิธีการสร้างเว็บไซต์อย่างง่ายภาพเหมือนจริงในเวลาเพียงไม่กี่ขั้นตอน
ฉันรู้ว่ามันยากที่จะเชื่อว่าเว็บไซต์นี้สามารถแปลงสภาพเป็นเว็บไซต์จริง
สมาชิกวีไอพีจะสามารถดาวน์โหลดแบบ PSD และยัง CSS / code xhtml

ขนาดภาพตัวอย่างแบบเต็มรูปแบบ


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

127

เปิดภาพใน Photoshop จากนั้นไปที่เมนูแก้ไข> กําหนดรูปแบบ เลือกชื่อสำหรับรูปแบบนี้และคลิก OK
สร้างเอกสารใหม่ที่มีขนาดดังต่อไปนี้ : 960 ความกว้างและความสูง 900 พิกเซล
เลือก Paint Bucket Tool , และในแถบตัวเลือกเลือกสร้างรูปแบบที่คุณเพียงแค่

220

คลิ๊กกว่ารูปแบบของคุณกับ Paint Bucket Tool . คุณจะมีบางอย่างเช่นนี้

319

ตั้งค่าสีพื้นหน้าไปยัง # 49290a และมี โค้งสี่เหลี่ยมผืนผ้าเครื่องมือ สร้างรูปทรงและวางไว้ในเค้าโครงของกลาง

413

เพิ่มรูปแบบชั้นต่อไปนี้

57

67

คุณจะต้องเพิ่มรูปร่างอื่น ๆ เหนือรูปร่างสีน้ำตาลนี้ ขณะนี้โปรดใช้สีขาว

77

โปรดใช้รูปแบบชั้นเดียวกับที่คุณได้ใช้เวลาสองสามวินาทีที่ผ่านมา

57

67

ซึ่งเป็นผล

87

ทางด้านขวาล่างของรูปแบบฉันจะเพิ่มภาพสต็อกบางคนที่มีกระถางต้นไม้และโซฟา

97

ภายใต้โซฟาชั้นกับฉันจะสร้างรูปทรงกลมที่มี Ellipse Tool

107

ฉันจะไปที่ Filter> Blur> Gaussian เบลอแล้วผมจะใช้การตั้งค่าต่อไปนี้

1111

ด้วยวิธีนี้คุณจะมีเงาจริงภายใต้โซฟา

128

ที่ด้านซ้ายของรูปแบบที่ผมจะสร้างกล่องบางคนที่มี สี่เหลี่ยมผืนผ้าเครื่องมือ

137

รูปทรงมีลักษณะดังต่อไปนี้ชั้น

147

157

ฉันจะเพิ่มข้อความและภาพ

166

ทางด้านขวาของฉันจะเพิ่มบางป้าย

177

ฉันจะสร้างเส้นประระหว่างการโพสต์

187

เมื่อต้องการสร้างเส้นประคุณจำเป็นต้องใช้ เครื่องมือชนิดแนวนอน และใช้ตัวอักษรต่อไปนี้และการตั้งค่า

196

ขั้นตอนสุดท้ายของฉันคือการสร้างโลโก้และข้อความบางปุ่ม

206

นี้เป็นรูปสุดท้ายของฉัน ฉันหวังว่าคุณจะชอบมัน ที่คุณสามารถดูมันทำง่ายมากและต้องใช้เพียงบางภาพหุ้นที่ดี

2111

คุณสามารถดาวน์โหลดเค้าโครง PSD และ CSS / เค้าโครง xhtml ส่วนการเขียนโปรแกรมสำหรับรูปแบบนี้สร้างโดยเทคนิคเดียวกันฉันได้ใช้สำหรับการกวดวิชา :  การออกแบบและรหัสรูปแบบโดยไม่ต้องใช้เครื่องมือชิ้น (กวดวิชาเฉพาะสำหรับสมาชิกวีไอพี)
คุณต้องการดาวน์โหลด VIP ทรัพยากรของเราทั้งหมดนี้รวมทั้งรูปแบบ PSD?

 
Download Demo

ที่มา http://www.grafpedia.com/tutorials/create-photorealistic-web-layout

layout


คุณต้องสมัครสมาชิก ถึงจะโพสกระทู้ได้

ปิดรับสมัครสมาชิกแล้ว


คำยอดฮิต :- 0