Cách tạo Mockup màn hình trong Photoshop
Nhiều nhà thiết kế và nghệ sĩ sử dụng mô hình để hiển thị tác phẩm của họ. Trong hướng dẫn giả lập màn hình này, bạn sẽ học cách tạo mô phỏng từ đầu bằng cách sử dụng các đối tượng và mặt nạ thông minh trong Photoshop. Nó dễ dàng hơn bạn nghĩ. Hãy bắt tay ngay vào.
Mục Lục
Mockup là gì và chúng hoạt động như thế nào?
Mô hình quảng cáo là hình ảnh được định dạng theo cách để bạn thay thế một phần hình ảnh bằng thiết kế của riêng bạn. Chúng thường được sử dụng cho các thiết kế màn hình, thiết kế bao bì hoặc quần áo.
Bạn sẽ tìm thấy nhiều mô hình PSD miễn phí trực tuyến mà bạn có thể sử dụng. Các mô hình này được cung cấp với một bức ảnh hoặc thậm chí một cảnh do máy tính tạo ra và được hoàn thành bằng một lớp đối tượng thông minh, đó là cách thiết kế của bạn có thể được áp dụng cho mô hình đó.
Đối tượng thông minh điều khiển phối cảnh thiết kế của bạn để một thiết kế phẳng có thể được uốn cong trên bất kỳ bề mặt nào trong ảnh, chẳng hạn như màn hình điện thoại hoặc áo phông. Bạn có thể tải xuống các mô hình làm sẵn với lớp đối tượng thông minh được đặt trên thiết kế, tất cả những gì bạn cần làm là thêm thiết kế của mình và đối tượng thông minh sẽ thực hiện phần còn lại cho bạn.
Rất đơn giản để tạo của riêng bạn và bao gồm một lớp đối tượng thông minh hoạt động với ảnh của bạn và nâng cao thiết kế của bạn. Hãy bắt đầu với hướng dẫn.
1. Chuẩn bị ảnh của bạn
Bạn cần bắt đầu với ảnh chụp màn hình chất lượng cao. Nếu bạn xem qua các trang web chụp ảnh có sẵn, bạn sẽ nhận thấy rằng hình ảnh của màn hình có ít sự phân tâm xung quanh đối tượng.
Hãy xem xét giao diện của thiết kế cuối cùng của bạn sẽ xuất hiện trên màn hình và đảm bảo phần còn lại của bức ảnh theo một chủ đề tương tự. Nếu thiết kế của bạn là nữ tính và nhẹ nhàng, hãy tạo kiểu cho bức ảnh bằng một bình hoa nhỏ hoặc vải hoa. Nếu thiết kế của bạn dành cho quảng cáo cà phê, hãy đặt một cốc cà phê bên cạnh màn hình trong ảnh.
Nhìn chung, hãy đảm bảo có một phông nền sạch sẽ xung quanh chủ thể chính trong ảnh của bạn (sẽ là một loại màn hình nào đó).
Bạn có thể sử dụng ảnh của riêng mình hoặc các trang web tìm kiếm như Unsplash hoặc Pixabay cho những gì bạn cần. Nếu nó yêu cầu chỉnh sửa, bây giờ là lúc để làm điều đó.
2. Tạo một đối tượng thông minh
Để tạo mô hình của bạn, hãy bắt đầu bằng cách mở ảnh màn hình của bạn trong Photoshop. Sau đó, chúng ta cần tạo một đối tượng thông minh. Để làm điều này, hãy sử dụng Công cụ hình chữ nhật (U) và vẽ một hình chữ nhật thô trên màn hình của hình ảnh. Chọn màu tô cho hình chữ nhật của bạn và xóa nét vẽ.
Trên Bảng điều khiển Lớp, nhấp chuột phải vào lớp có hình chữ nhật của bạn và nhấp vào Chuyển đổi sang đối tượng thông minh. Từ đây, chúng ta có thể chuyển đổi đối tượng thông minh. Để bật Công cụ chuyển đổi nhấn [Cmd + T] trên Mac và [Ctrl + T] trên Windows.
Khi bật Công cụ chuyển đổi, giữ Cmd (Mac) hoặc Điều khiển (Windows) nút xuống và di con trỏ của bạn trên một góc của hình chữ nhật cho đến khi nó biến thành một mũi tên màu trắng. Sử dụng mũi tên này, nhấp và kéo từng góc của hình chữ nhật đến các góc của màn hình trong ảnh.
Sau khi hình chữ nhật được xếp thẳng hàng, hãy nhấp đúp vào bất kỳ đâu để áp dụng hiệu ứng. Điều này hiện đã tạo ra một đối tượng thông minh, đó là nơi thiết kế của bạn sẽ đi đến.
3. Thêm Mặt nạ nếu cần thiết
Nếu bạn có thêm các cản trở trong hình ảnh của mình, chẳng hạn như màn hình máy tính xách tay che khuất màn hình máy tính trong hình ảnh của chúng tôi, bạn có thể sử dụng mặt nạ lớp để làm việc với đối tượng thông minh của mình.
Tạo đối tượng thông minh che các vật cản bằng cách sử dụng các bước trong phần trước. Sau đó, trên Bảng điều khiển lớp, hãy nhấp vào Tạo mặt nạ lớp. Sử dụng công cụ lựa chọn (L), chọn mọi thứ trong ảnh, ngoại trừ màn hình nơi chứa mô hình của bạn.
Khi mọi thứ khác được chọn, hãy nhấn vào Xóa bỏ phím trên bàn phím. Hình thu nhỏ Layer Mask trong Bảng điều khiển Lớp của bạn sẽ hiển thị một hình dạng màu trắng ở vị trí màn hình và mọi thứ khác sẽ có màu đen và bị che đi.
4. Thêm kiểu dáng của bạn
Khi bạn đã tạo một đối tượng thông minh, đã đến lúc thêm thiết kế của bạn vào mô hình của bạn.
Mở thiết kế dự định của bạn trong Photoshop và chọn tất cả bằng cách nhấn [Cmd + A] trên Mac hoặc [Ctrl + A] trên Windows. Sao chép lựa chọn và quay lại cửa sổ với thiết kế mô hình của bạn. Tìm lớp chứa đối tượng thông minh của bạn và nhấp đúp vào hộp đối tượng thông minh trong Bảng điều khiển lớp. Thao tác này sẽ mở đối tượng thông minh trong một cửa sổ mới.
Bây giờ, bạn có thể dán thiết kế đã sao chép trước đó của mình. Chuyển đổi kích thước để nó bao phủ toàn bộ hình chữ nhật. Khi kích thước được thiết lập, hãy lưu hình ảnh bằng cách nhấn [Cmd + S] trên Mac hoặc [Ctrl + S] trên Windows. Thoát ra khỏi cửa sổ sau khi nó được lưu.
Quay lại cửa sổ chính; bạn sẽ thấy thiết kế mô hình của mình đã hoàn thành với màn hình mới.
5. Biến nó thành hiện thực
Bạn có thể để nguyên mô hình của mình, nhưng để đưa thiết kế của bạn lên một tầm cao mới, bạn có thể thêm ánh sáng chói hoặc phản xạ thực tế vào màn hình máy tính, phía trên đối tượng thông minh của bạn.
Để xem ánh sáng chói tự nhiên, hãy sử dụng Hiển thị trên lớp đối tượng thông minh. Nhìn vào cách ánh sáng rơi trên màn hình trong bức ảnh gốc. Khi bạn bật chế độ hiển thị, độ chói tự nhiên của màn hình sẽ biến mất và trông hơi phẳng.
Chọn hình thu nhỏ Layer Mask trên lớp dự định của bạn, nhấp chuột phải vào nó và chọn Thêm mặt nạ vào lựa chọn. Sau đó, thêm một lớp mới và nhấp vào dốc dụng cụ. Chúng tôi sẽ sử dụng gradient tuyến tính màu đen và trắng, đặt màu trắng ở nơi ánh sáng chiếu vào màn hình của bạn.
Với gradient của bạn tại chỗ, hãy thay đổi chế độ hòa trộn của lớp thành nhân. Điều này mang lại hiệu ứng phân cực của độ chói màn hình, làm cho mô hình của bạn trông thực tế hơn.
Bây giờ bạn đã có một mockup hoàn chỉnh mà bạn có thể lưu dưới dạng PSD để sử dụng cho nhiều thiết kế trong tương lai. Tất cả những gì bạn cần làm là thay đổi hình ảnh trong lớp đối tượng thông minh.
Tạo Mockups màn hình của riêng bạn trong Photoshop
Sử dụng ảnh và thiết kế giả lập của riêng bạn giúp tác phẩm của bạn toàn vẹn hơn và sẽ tách bạn khỏi các nghệ sĩ khác. Nó thêm dấu ấn cá nhân vào thiết kế của bạn và cho phép bạn kiểm soát nhiều hơn đối với kết quả cuối cùng. Tham khảo lại hướng dẫn đơn giản này để tạo mô hình màn hình của riêng bạn từ đầu.
Đọc tiếp
Giới thiệu về tác giả
