Thiết kế website cho nhiếp ảnh gia với Photoshop
Trong hướng dẫn Photoshop này, bạn sẽ tìm hiểu làm thế nào để làm cho một trang web PSD thiết kế đẹp đó là theo chủ đề và hoàn hảo cho một danh mục đầu tư web mà tập trung vào hình ảnh. Đó là một hướng dẫn khá đơn giản nhằm mục đích minh họa một số kỹ thuật tuyệt vời để thích ứng vào công việc thiết kế web hiện tại của bạn.
Bước 1: Thiết lập các tài liệu:
Tạo một layer mới trong Photoshop (Ctrl / Cmd + N) với kích thước 1200 x 910px.
Thiết lập các tài liệu:
Bước 2: Kết hợp các Grid System 960
Chúng tôi sẽ dựa vào bố trí của chúng tôi trên hệ thống lưới 960 - 16 cột. Bạn có thể tải về các mẫu PSD miễn phí từ trang web này. Một khi bạn đã hoàn tất tải về các mẫu PSD, mở PSD trong Photoshop và kéo nó vào nền của chúng tôi. Hãy nhớ để giữ cho lớp lưới này là lớp trên cùng trong Layers Panel, vì điều này sẽ phục vụ như hướng dẫn của chúng tôi để sắp xếp.
Bước 3: Thực hiện của nền Layout
Tạm thời ẩn layer lưới của chúng tôi và tạo ra một layer mới bên dưới nó. Trong Tools Panel, thiết lập màu Foreground của bạn đến một màu nâu-cam (# bc7821) và màu nền cho một màu nâu sẫm (# 362a21).
Chọn Gradient Tool (G) và thiết lập tùy chọn của bạn để Radial Gradient. Tạo ra một gradient tại các trung tâm của khung hình.
Gradient có vẻ hơi đơn giản, vì vậy chúng ta hãy thêm một số kết cấu với nó. Vào Filter> Convert cho Smart Filter. Bằng cách này, chúng tôi có thể thay đổi các bộ lọc áp dụng cho lớp này về sau.
Bây giờ chúng ta hãy thêm một số tiếng ồn để màu này bằng cách chọn Filter> Noise> Add Noise.
Hãy bổ sung thêm ánh sáng cho các khu vực hàng đầu của nền của chúng tôi. Mở công cụ Brush Tool (B) và thiết lập các tùy chọn Master Diameter khoảng 700px; cũng thiết lập màu Foreground thành màu trắng.
Tạo một layer mới trên đầu trang của gradient của chúng tôi và nhấp chọn vào lưới một lần để áp dụng các nét cọ.
Thay đổi chế độ hòa trộn của layer này là Overlay và chỉnh Opacity của nó đến 34%.
Mở Rust Texture đề nghị trong danh sách nguồn Tutorial (hoặc duyệt đến phần Thiết kế Hướng dẫn, học thiết kế một cái gì đó tương tự) trong Photoshop. Kéo hình ảnh lên nền của chúng tôi và thay đổi kích thước bằng cách sử dụng lệnh Free Transform (Ctrl / Cmd + T) để nó là nhỏ hơn so với nền nhẹ.
Sử dụng một vòng tròn bình thường, bàn chải lông, hơi xóa hai bên và các khu vực phía dưới bằng cách sử dụng công cụ Eraser Tool (E). Ngoài ra, bạn có thể sử dụng một lớp mặt nạ nếu bạn không muốn thay đổi vĩnh viễn.
Thay đổi chế độ hòa trộn kết cấu gỉ của Overlay và Opacity của nó đến 16%.
Tiếp theo, mở trầy xước kim loại Texture trong Photoshop, và cũng kéo texture này lên vải của chúng tôi và hơi xóa khỏi hai bên và phía dưới. Thiết lập chế độ hòa trộn của layer này thành Multiply và điều chỉnh Opacity của nó đến 15%.
Bước 4: Thêm vào tên trang web
Bỏ ẩn lớp lưới của chúng tôi. Chọn Horizontal Type Tool (T) và thiết lập các tùy chọn Font để ITC Avant Garde CE (hoặc phông chữ ưa thích của bạn). Ngoài ra thiết lập màu chữ sang màu nâu (# 523.117). Sau đó, gõ "JohnDoe Photography" (hoặc bất kỳ tên trang web mà bạn muốn) tại trung tâm của bố trí.
Nhân đôi layer text và sau đó thiết lập màu sắc của lớp văn bản của nhân bản màu trắng (#ffffff), thay đổi chế độ hòa trộn là Overlay và chỉnh Opacity của nó đến 32%. Di chuyển nó xuống 1px sử dụng Move Tool (V) kết hợp với các phím mũi tên xuống của bạn; điều này sẽ tạo ra một số loại hiệu ứng khắc.
Bước 5: Tạo Menu Navigation
Tạo một layer mới. Sử dụng Horizontal Type Tool (T) (tùy chọn cài đặt hiển thị dưới đây) để gõ ra văn bản hướng của bạn bên dưới tên trang web của bạn. Hãy chắc chắn rằng nó được làm trung tâm trên vải.
Bây giờ chúng ta thiết kế các trạng thái hover của từng khoản mục trên menu. Chọn Rounded Rectangle Tool (U). Thiết lập tùy chọn của công cụ Shape Layers và Radius là 30px. Vẽ một hình chữ nhật tròn trên một layer mới bên dưới các liên kết chuyển hướng mục ("Home").
Tiếp theo, áp dụng Color Overlay và Inner Shadow layer hình chữ nhật tròn của (double-click vào hình thu nhỏ của nó trong Layers Panel để truy cập vào Layer Style cửa sổ hộp thoại).
Đặt màu cho một màu vàng (# f9a81f).
Inner Shadow
Thiết lập màu sắc của bóng tối bên trong màu đen (# 000000).
Ngoài ra, thiết lập Opacity của layer hình chữ nhật của hình tròn khoảng 30% cho thấy nền của chúng tôi thông qua nó một chút.
Hãy làm cho hình chữ nhật tròn trông khắc hơn. Đặt một lựa chọn xung quanh hình chữ nhật tròn bằng cách nhấn Ctrl / Cmd và sau đó nhấn vào hình chữ nhật được làm tròn từ Layers Panel.
Trên một layer mới, vào Edit> Stroke.
Thay đổi chế độ hòa trộn của layer sang Overlay và chỉnh Opacity của nó đến 18%. Xoá bỏ khỏi đột quỵ trái và đỉnh bằng cách sử dụng công cụ Eraser Tool (E) được thiết lập với một nhỏ, mũi có lông vũ.
Bước 6: Thêm Slideshow Mục
Rẽ lớp lưới của chúng tôi trở lại. Sử dụng Rectangular Marquee Tool (M), vẽ một hình chữ nhật bên dưới lựa chọn hướng của chúng tôi và sau đó điền (Shift + F5) lựa chọn với màu đen (# 000000). Hãy chắc chắn rằng hình chữ nhật là 14 cột lưới rộng và tập trung vào cách bố trí của chúng tôi.
Thay đổi này layer hình chữ nhật của Blend Mode sang Soft Light để cho một số các chương trình nền thông qua nó.
Thời gian để đặt một hình ảnh bên trong slideshow của chúng tôi. Mở một bức ảnh (chẳng hạn như hình ảnh chứng khoán Sunset đề cập trong danh sách Tài Tutorial) trong Photoshop và kéo nó vào cách bố trí của chúng tôi. Quy mô nó xuống một cách thích hợp với Free Transform.
Ẩn layer của hình ảnh tạm thời và sau đó vẽ một hình chữ nhật lựa chọn trong khu vực slideshow với Rectangular Marquee Tool (M).
Hãy để chúng tôi che bức ảnh bằng cách nhấn vào nút Add vector mask từ layer Panel, mà nên tạo ra một mặt nạ với khu vực được lựa chọn của bạn. Bây giờ bạn có thể thôi ẩn các bức ảnh lớp một lần nữa. Bạn nên lưu ý rằng, nếu được thực hiện một cách chính xác, bất kỳ bộ phận của hình ảnh mà đặt bên ngoài khu vực đeo mặt nạ sẽ được ẩn.
Bước 7: Thực hiện các Controls Slideshow
Tạo một nhóm layer mới bên dưới lớp trình chiếu và đặt tên cho nó là "mũi tên" (đối với tổ chức). Tạo một layer mới bên trong nhóm layer mới tạo này.
Chọn công cụ Ellipse Tool (U) và vẽ một vòng tròn ở phía bên trái của các slideshow.
Tiếp theo, thêm một Outer Glow và Gradient Overlay trên đường tròn.
Outer Glow
Thiết lập màu sắc ánh sáng bên ngoài của màu đen (# 000000).
Gradient Overlay
Có độ dốc đi từ một màu nâu sẫm (# 271.303) để một màu nâu hơi ít đậm (# 3a2102).
Đây là những gì kiểm soát slideshow trái của chúng tôi trông giống như bây giờ.
Chúng tôi sẽ cần phải loại bỏ cái bóng không cần thiết của các vòng tròn. Để làm được điều này, chúng ta cần phải san bằng hình này bằng cách vào Layer> Rasterize> Shape. Sau khi nó phẳng, chọn khu vực bên dưới slideshow sử dụng Rectangular Marquee Tool (M) và sau đó nhấn Delete để loại bỏ những vùng không mong muốn bên dưới vùng chọn chữ nhật.
Bây giờ chúng ta tạo ra các mũi tên cho các nút của chúng tôi. Trên một layer mới, chọn Rounded Rectangle Tool (U), và sau đó thiết lập các tùy chọn của nó để nó thiết lập cho Shape Layers và Radius tại 30px. Có một giá trị cao cho các tùy chọn Radius làm cho mỗi đầu nhìn tròn.
Vẽ một hình dạng đường chéo đại diện cho phần bên trái của mũi tên. Thay đổi màu sắc của hình này với một màu cam tối và câm lặng (# b56d1b) bằng cách cho nó một lớp phong cách Color Overlay.
Để tạo phía dưới cùng của mũi tên, sao chép hình dạng này và đi đến vào Edit> Transform Path> Flip Horizontal.
Chọn hai lớp tạo nên các mũi tên trong Layers Panel và sau đó vào Edit> Transform> Rotate; xoay mũi tên -90o vì vậy mà nó trỏ đến bên trái.
Hợp nhất hai lớp bằng cách chọn chúng trong Layers Panel và sau đó nhấn Ctrl / Cmd + E. Duplicate layer sáp nhập.
Cung cấp cho các lớp trùng lặp một màu đen (# 000000) layer style Color Overlay để thay đổi màu sắc của nó, và cũng di chuyển nó 1px bên trái bằng cách sử dụng Move Tool (V); điều này sẽ tạo ra một cái nhìn khác.
Bây giờ chúng ta sẽ tạo ra các mũi tên bên phải. Chọn "mũi tên" nhóm lớp của chúng tôi trong Layers Panel, lặp lại nhóm, và sau đó lật hướng của nó bằng cách vào Edit> Transform> Flip Horizontal. Di chuyển điều khiển slideshow nhân đôi về phía bên phải.
Bây giờ chúng ta cần phải có một cái gì đó như thế này:
Bước 8: Tạo các ảnh nhỏ Thumbnails
Xoay lớp lưới trở lại. Sử dụng Rectangular Marquee Tool (M), vẽ một vùng chọn cột 4 và nửa rộng dưới slideshow. Điền nó với màu đen (# 000000). Thay đổi chế độ hòa trộn là Soft Light.
Mở một bức ảnh (chẳng hạn như hình ảnh chứng khoán hướng dương), đặt nó trên vải của chúng tôi, và sau đó thay đổi kích thước khoảng 80% kích thước ban đầu của nó.
Ẩn layer của hướng dương và tạm thời, sử dụng Rectangular Marquee Tool (M), vẽ một vùng chọn nhỏ bên trong hình chữ nhật đầu tiên của chúng tôi. Bỏ ẩn các Sunflower ảnh và nhấn vào biểu tượng Add layer mask trên Layers Panel. Điều này sẽ làm cho nó để chỉ các khu vực được lựa chọn trong những chương trình hướng dương.
Bây giờ chúng ta tạo ra các nhãn cho hình ảnh thu nhỏ của chúng tôi. Sử dụng Rectangular Marquee Tool (M), tạo ra một lựa chọn ở dưới cùng của bức ảnh và điền nó với màu nâu sẫm của chúng tôi (# 261.103). Thay đổi Opacity của layer này xuống 85% để cho các phần của hình ảnh đằng sau nó hiển thị.
Sử dụng Horizontal Type Tool (T), thêm một nhãn cho nó (chẳng hạn như "THIÊN NHIÊN"). Tôi sử dụng font chữ Helvetica với một màu sắc văn bản màu vàng (# ffbf47).
Thêm một số văn bản dưới đây thumbnail của chúng tôi; này sẽ phục vụ như một số loại mô tả cho hình ảnh thu nhỏ đặc biệt này.
Lặp lại quá trình tương tự để thêm 2 hình ảnh thu nhỏ hơn (bạn có thể sử dụng các cậu bé Baby và hình ảnh cổ Bokeh gợi ý trong danh sách Tài Tutorial, hoặc sử dụng một số hình ảnh của riêng bạn).
Bước 9: Làm cho Footer
Là bước cuối cùng trong quá trình này, chúng ta sẽ tạo ra khu vực chân trang. Tạo một layer mới. Chọn công cụ Pencil Tool (B) và thiết lập màu sắc của nó với một màu nâu sẫm (# 2c1303). Vẽ một bộ phận rộng 14-cột dưới ba hình thu nhỏ mà sẽ là chia của chúng tôi giữa các nội dung chính và các khu vực footer.
Mẹo: Giữ phím Shift đảm bảo chúng tôi tạo ra một đường thẳng.
Nhân đôi layer dòng bạn vừa tạo và thay đổi màu sắc của nó là màu trắng (#ffffff) sử dụng một layer style Color Overlay. Di chuyển xuống 1px trùng lặp. Thay đổi chế độ hòa trộn là Overlay và giảm Opacity của nó đến 18% để tạo ra một số loại hiệu ứng khác.
Cuối cùng, sử dụng Horizontal Type Tool (T) để thêm văn bản Footer của bạn (bạn có thể bao gồm, ví dụ, một số thông tin về bản quyền).
Tóm tắt hướng dẫn
Chúng tôi đã tạo thành công một thiết kế trang web nhiếp ảnh mockup thanh lịch! Chúng tôi sử dụng các kỹ thuật khác nhau và các phương pháp được phổ biến trong phát triển bố cục trang web, bao gồm cả việc sử dụng các công cụ lựa chọn, công cụ hình dạng, áp dụng kết cấu grunge và bộ lọc, tinh chỉnh chế độ hoà trộn của lớp, và như vậy. Tôi hy vọng bạn tìm thấy hướng dẫn này hữu ích.
Bước 1: Thiết lập các tài liệu:
Tạo một layer mới trong Photoshop (Ctrl / Cmd + N) với kích thước 1200 x 910px.
Thiết lập các tài liệu:
Bước 2: Kết hợp các Grid System 960
Chúng tôi sẽ dựa vào bố trí của chúng tôi trên hệ thống lưới 960 - 16 cột. Bạn có thể tải về các mẫu PSD miễn phí từ trang web này. Một khi bạn đã hoàn tất tải về các mẫu PSD, mở PSD trong Photoshop và kéo nó vào nền của chúng tôi. Hãy nhớ để giữ cho lớp lưới này là lớp trên cùng trong Layers Panel, vì điều này sẽ phục vụ như hướng dẫn của chúng tôi để sắp xếp.
Bước 3: Thực hiện của nền Layout
Tạm thời ẩn layer lưới của chúng tôi và tạo ra một layer mới bên dưới nó. Trong Tools Panel, thiết lập màu Foreground của bạn đến một màu nâu-cam (# bc7821) và màu nền cho một màu nâu sẫm (# 362a21).
Chọn Gradient Tool (G) và thiết lập tùy chọn của bạn để Radial Gradient. Tạo ra một gradient tại các trung tâm của khung hình.
Gradient có vẻ hơi đơn giản, vì vậy chúng ta hãy thêm một số kết cấu với nó. Vào Filter> Convert cho Smart Filter. Bằng cách này, chúng tôi có thể thay đổi các bộ lọc áp dụng cho lớp này về sau.
Bây giờ chúng ta hãy thêm một số tiếng ồn để màu này bằng cách chọn Filter> Noise> Add Noise.
Hãy bổ sung thêm ánh sáng cho các khu vực hàng đầu của nền của chúng tôi. Mở công cụ Brush Tool (B) và thiết lập các tùy chọn Master Diameter khoảng 700px; cũng thiết lập màu Foreground thành màu trắng.
Tạo một layer mới trên đầu trang của gradient của chúng tôi và nhấp chọn vào lưới một lần để áp dụng các nét cọ.
Thay đổi chế độ hòa trộn của layer này là Overlay và chỉnh Opacity của nó đến 34%.
Mở Rust Texture đề nghị trong danh sách nguồn Tutorial (hoặc duyệt đến phần Thiết kế Hướng dẫn, học thiết kế một cái gì đó tương tự) trong Photoshop. Kéo hình ảnh lên nền của chúng tôi và thay đổi kích thước bằng cách sử dụng lệnh Free Transform (Ctrl / Cmd + T) để nó là nhỏ hơn so với nền nhẹ.
Sử dụng một vòng tròn bình thường, bàn chải lông, hơi xóa hai bên và các khu vực phía dưới bằng cách sử dụng công cụ Eraser Tool (E). Ngoài ra, bạn có thể sử dụng một lớp mặt nạ nếu bạn không muốn thay đổi vĩnh viễn.
Thay đổi chế độ hòa trộn kết cấu gỉ của Overlay và Opacity của nó đến 16%.
Tiếp theo, mở trầy xước kim loại Texture trong Photoshop, và cũng kéo texture này lên vải của chúng tôi và hơi xóa khỏi hai bên và phía dưới. Thiết lập chế độ hòa trộn của layer này thành Multiply và điều chỉnh Opacity của nó đến 15%.
Bước 4: Thêm vào tên trang web
Bỏ ẩn lớp lưới của chúng tôi. Chọn Horizontal Type Tool (T) và thiết lập các tùy chọn Font để ITC Avant Garde CE (hoặc phông chữ ưa thích của bạn). Ngoài ra thiết lập màu chữ sang màu nâu (# 523.117). Sau đó, gõ "JohnDoe Photography" (hoặc bất kỳ tên trang web mà bạn muốn) tại trung tâm của bố trí.
Nhân đôi layer text và sau đó thiết lập màu sắc của lớp văn bản của nhân bản màu trắng (#ffffff), thay đổi chế độ hòa trộn là Overlay và chỉnh Opacity của nó đến 32%. Di chuyển nó xuống 1px sử dụng Move Tool (V) kết hợp với các phím mũi tên xuống của bạn; điều này sẽ tạo ra một số loại hiệu ứng khắc.
Bước 5: Tạo Menu Navigation
Tạo một layer mới. Sử dụng Horizontal Type Tool (T) (tùy chọn cài đặt hiển thị dưới đây) để gõ ra văn bản hướng của bạn bên dưới tên trang web của bạn. Hãy chắc chắn rằng nó được làm trung tâm trên vải.
Bây giờ chúng ta thiết kế các trạng thái hover của từng khoản mục trên menu. Chọn Rounded Rectangle Tool (U). Thiết lập tùy chọn của công cụ Shape Layers và Radius là 30px. Vẽ một hình chữ nhật tròn trên một layer mới bên dưới các liên kết chuyển hướng mục ("Home").
Tiếp theo, áp dụng Color Overlay và Inner Shadow layer hình chữ nhật tròn của (double-click vào hình thu nhỏ của nó trong Layers Panel để truy cập vào Layer Style cửa sổ hộp thoại).
Đặt màu cho một màu vàng (# f9a81f).
Inner Shadow
Thiết lập màu sắc của bóng tối bên trong màu đen (# 000000).
Ngoài ra, thiết lập Opacity của layer hình chữ nhật của hình tròn khoảng 30% cho thấy nền của chúng tôi thông qua nó một chút.
Hãy làm cho hình chữ nhật tròn trông khắc hơn. Đặt một lựa chọn xung quanh hình chữ nhật tròn bằng cách nhấn Ctrl / Cmd và sau đó nhấn vào hình chữ nhật được làm tròn từ Layers Panel.
Trên một layer mới, vào Edit> Stroke.
Thay đổi chế độ hòa trộn của layer sang Overlay và chỉnh Opacity của nó đến 18%. Xoá bỏ khỏi đột quỵ trái và đỉnh bằng cách sử dụng công cụ Eraser Tool (E) được thiết lập với một nhỏ, mũi có lông vũ.
Bước 6: Thêm Slideshow Mục
Rẽ lớp lưới của chúng tôi trở lại. Sử dụng Rectangular Marquee Tool (M), vẽ một hình chữ nhật bên dưới lựa chọn hướng của chúng tôi và sau đó điền (Shift + F5) lựa chọn với màu đen (# 000000). Hãy chắc chắn rằng hình chữ nhật là 14 cột lưới rộng và tập trung vào cách bố trí của chúng tôi.
Thay đổi này layer hình chữ nhật của Blend Mode sang Soft Light để cho một số các chương trình nền thông qua nó.
Thời gian để đặt một hình ảnh bên trong slideshow của chúng tôi. Mở một bức ảnh (chẳng hạn như hình ảnh chứng khoán Sunset đề cập trong danh sách Tài Tutorial) trong Photoshop và kéo nó vào cách bố trí của chúng tôi. Quy mô nó xuống một cách thích hợp với Free Transform.
Ẩn layer của hình ảnh tạm thời và sau đó vẽ một hình chữ nhật lựa chọn trong khu vực slideshow với Rectangular Marquee Tool (M).
Hãy để chúng tôi che bức ảnh bằng cách nhấn vào nút Add vector mask từ layer Panel, mà nên tạo ra một mặt nạ với khu vực được lựa chọn của bạn. Bây giờ bạn có thể thôi ẩn các bức ảnh lớp một lần nữa. Bạn nên lưu ý rằng, nếu được thực hiện một cách chính xác, bất kỳ bộ phận của hình ảnh mà đặt bên ngoài khu vực đeo mặt nạ sẽ được ẩn.
Bước 7: Thực hiện các Controls Slideshow
Tạo một nhóm layer mới bên dưới lớp trình chiếu và đặt tên cho nó là "mũi tên" (đối với tổ chức). Tạo một layer mới bên trong nhóm layer mới tạo này.
Chọn công cụ Ellipse Tool (U) và vẽ một vòng tròn ở phía bên trái của các slideshow.
Tiếp theo, thêm một Outer Glow và Gradient Overlay trên đường tròn.
Outer Glow
Thiết lập màu sắc ánh sáng bên ngoài của màu đen (# 000000).
Gradient Overlay
Có độ dốc đi từ một màu nâu sẫm (# 271.303) để một màu nâu hơi ít đậm (# 3a2102).
Đây là những gì kiểm soát slideshow trái của chúng tôi trông giống như bây giờ.
Chúng tôi sẽ cần phải loại bỏ cái bóng không cần thiết của các vòng tròn. Để làm được điều này, chúng ta cần phải san bằng hình này bằng cách vào Layer> Rasterize> Shape. Sau khi nó phẳng, chọn khu vực bên dưới slideshow sử dụng Rectangular Marquee Tool (M) và sau đó nhấn Delete để loại bỏ những vùng không mong muốn bên dưới vùng chọn chữ nhật.
Bây giờ chúng ta tạo ra các mũi tên cho các nút của chúng tôi. Trên một layer mới, chọn Rounded Rectangle Tool (U), và sau đó thiết lập các tùy chọn của nó để nó thiết lập cho Shape Layers và Radius tại 30px. Có một giá trị cao cho các tùy chọn Radius làm cho mỗi đầu nhìn tròn.
Vẽ một hình dạng đường chéo đại diện cho phần bên trái của mũi tên. Thay đổi màu sắc của hình này với một màu cam tối và câm lặng (# b56d1b) bằng cách cho nó một lớp phong cách Color Overlay.
Để tạo phía dưới cùng của mũi tên, sao chép hình dạng này và đi đến vào Edit> Transform Path> Flip Horizontal.
Chọn hai lớp tạo nên các mũi tên trong Layers Panel và sau đó vào Edit> Transform> Rotate; xoay mũi tên -90o vì vậy mà nó trỏ đến bên trái.
Hợp nhất hai lớp bằng cách chọn chúng trong Layers Panel và sau đó nhấn Ctrl / Cmd + E. Duplicate layer sáp nhập.
Cung cấp cho các lớp trùng lặp một màu đen (# 000000) layer style Color Overlay để thay đổi màu sắc của nó, và cũng di chuyển nó 1px bên trái bằng cách sử dụng Move Tool (V); điều này sẽ tạo ra một cái nhìn khác.
Bây giờ chúng ta sẽ tạo ra các mũi tên bên phải. Chọn "mũi tên" nhóm lớp của chúng tôi trong Layers Panel, lặp lại nhóm, và sau đó lật hướng của nó bằng cách vào Edit> Transform> Flip Horizontal. Di chuyển điều khiển slideshow nhân đôi về phía bên phải.
Bây giờ chúng ta cần phải có một cái gì đó như thế này:
Bước 8: Tạo các ảnh nhỏ Thumbnails
Xoay lớp lưới trở lại. Sử dụng Rectangular Marquee Tool (M), vẽ một vùng chọn cột 4 và nửa rộng dưới slideshow. Điền nó với màu đen (# 000000). Thay đổi chế độ hòa trộn là Soft Light.
Mở một bức ảnh (chẳng hạn như hình ảnh chứng khoán hướng dương), đặt nó trên vải của chúng tôi, và sau đó thay đổi kích thước khoảng 80% kích thước ban đầu của nó.
Ẩn layer của hướng dương và tạm thời, sử dụng Rectangular Marquee Tool (M), vẽ một vùng chọn nhỏ bên trong hình chữ nhật đầu tiên của chúng tôi. Bỏ ẩn các Sunflower ảnh và nhấn vào biểu tượng Add layer mask trên Layers Panel. Điều này sẽ làm cho nó để chỉ các khu vực được lựa chọn trong những chương trình hướng dương.
Bây giờ chúng ta tạo ra các nhãn cho hình ảnh thu nhỏ của chúng tôi. Sử dụng Rectangular Marquee Tool (M), tạo ra một lựa chọn ở dưới cùng của bức ảnh và điền nó với màu nâu sẫm của chúng tôi (# 261.103). Thay đổi Opacity của layer này xuống 85% để cho các phần của hình ảnh đằng sau nó hiển thị.
Sử dụng Horizontal Type Tool (T), thêm một nhãn cho nó (chẳng hạn như "THIÊN NHIÊN"). Tôi sử dụng font chữ Helvetica với một màu sắc văn bản màu vàng (# ffbf47).
Thêm một số văn bản dưới đây thumbnail của chúng tôi; này sẽ phục vụ như một số loại mô tả cho hình ảnh thu nhỏ đặc biệt này.
Lặp lại quá trình tương tự để thêm 2 hình ảnh thu nhỏ hơn (bạn có thể sử dụng các cậu bé Baby và hình ảnh cổ Bokeh gợi ý trong danh sách Tài Tutorial, hoặc sử dụng một số hình ảnh của riêng bạn).
Bước 9: Làm cho Footer
Là bước cuối cùng trong quá trình này, chúng ta sẽ tạo ra khu vực chân trang. Tạo một layer mới. Chọn công cụ Pencil Tool (B) và thiết lập màu sắc của nó với một màu nâu sẫm (# 2c1303). Vẽ một bộ phận rộng 14-cột dưới ba hình thu nhỏ mà sẽ là chia của chúng tôi giữa các nội dung chính và các khu vực footer.
Mẹo: Giữ phím Shift đảm bảo chúng tôi tạo ra một đường thẳng.
Nhân đôi layer dòng bạn vừa tạo và thay đổi màu sắc của nó là màu trắng (#ffffff) sử dụng một layer style Color Overlay. Di chuyển xuống 1px trùng lặp. Thay đổi chế độ hòa trộn là Overlay và giảm Opacity của nó đến 18% để tạo ra một số loại hiệu ứng khác.
Cuối cùng, sử dụng Horizontal Type Tool (T) để thêm văn bản Footer của bạn (bạn có thể bao gồm, ví dụ, một số thông tin về bản quyền).
Tóm tắt hướng dẫn
Chúng tôi đã tạo thành công một thiết kế trang web nhiếp ảnh mockup thanh lịch! Chúng tôi sử dụng các kỹ thuật khác nhau và các phương pháp được phổ biến trong phát triển bố cục trang web, bao gồm cả việc sử dụng các công cụ lựa chọn, công cụ hình dạng, áp dụng kết cấu grunge và bộ lọc, tinh chỉnh chế độ hoà trộn của lớp, và như vậy. Tôi hy vọng bạn tìm thấy hướng dẫn này hữu ích.
CLICK ĐỂ XEM ƯU ĐÃI VÀ HỌC
PHÍ Ở DƯỚI
<<<< Xem thêm các khóa học >>>>
Tag: học thiết kế đồ họa
ở hà nội, học thiết kế đồ họa tại hà nội, học thiết kế đồ họa photoshop, học
photoshop tại hà nội, học lập trình php tại hà nội, học wordpress tại hà nội,
học html css tại hà nội, khóa học photoshop tại hà nội, khóa học thiết kế đồ
họa tại hà nội, khóa học lập trình php tại hà nội. Khóa học thiết kế đồ họa
ngắn hạn
Mọi thông tin bạn có thể liên hệ:
Đào tạo lập trình và thiết kế đồ họa
Hotline: 0968.853.958 hoặc hỗ trợ Mr.
trung: 0947.499.221
Không có nhận xét nào:
Đăng nhận xét