27 Bộ dụng cụ bắt buộc phải có dành cho nhà thiết kế web

Bộ dụng cụ bắt đầu là thời gian tuyệt vời cho các nhà thiết kế web và chúng đặc biệt hữu ích cho những người thường tạo ra các mô hình giả cho dự án hàng ngày. Nếu bạn là một nhà thiết kế kiêm lập trình viên, hãy nghĩ về nó như các đoạn mã của bạn

Vì vậy, những gì trong một bộ khởi động? Chúng tôi nghĩ rằng nó khác nhau - tùy thuộc vào những gì mỗi nhà thiết kế thường xuyên làm việc với. Dành cho Thiết kế GUI, giữ một bản sao của các thành phần biểu mẫu (nút, hộp kiểm, tab, menu thả xuống, v.v.) giúp tăng tốc quá trình tạo màn hình và bố cục; mặt khác, các mẫu trình duyệt (IE, Firefox Safari) với vùng an toàn web giữ những người thiết kế web nhắc nhở làm thế nào / nơi họ nên ưu tiên nội dung của họ. Các nhà thiết kế có kinh nghiệm thường sẽ tùy chỉnh và giữ một phiên bản cá nhân của bộ khởi động, một số có thể có một vài!

Trong bài viết hôm nay, chúng tôi cố gắng chỉ cho bạn một số bộ khởi động thiết kế tốt nhất mà chúng tôi đã biết. Bạn có thể tải xuống (miễn phí) và sử dụng chúng ngay lập tức hoặc tùy chỉnh bản sao của chính bạn sẽ có ích trong tương lai, tùy bạn chọn. Danh sách đầy đủ sau khi nhảy.

GUI, thành phần biểu mẫu và thành phần web

Từ các thành phần của biểu mẫu như hộp kiểm, trường nhập, văn bản cho đến các thành phần thiết kế web như nút, mũi tên, biểu tượng, huy hiệu và hơn thế nữa.

Bộ công cụ thiết kế của Yahoo

Có lẽ là một trong những bộ hoàn chỉnh nhất cho các nhà thiết kế. Các yếu tố GUI bao gồm lịch, lưới, menu, thiết bị di động (chung và iphone), điều hướng và phân trang, tab, điều khiển UI và hơn thế nữa! Có nhiều định dạng: OmniGraffle, Visio (XML), PDF, PNG và SVG.

Các yếu tố hình thức web

Với tất cả các tab, nút, danh sách thả xuống trong một tệp PSD duy nhất, chắc chắn sẽ giúp bạn khởi đầu trong thiết kế giao diện. Phép lịch sự của sniperyu.

Các yếu tố hình thức trình duyệt PSD

Các yếu tố hình thức trình duyệt PSD cho Mac Firefox 3 và một phiên bản khác cho Vista IE7.

Da tối màu

Kiểu dáng đẹp.

Biểu tượng Famfamfam

Cho dù bạn đang thiết kế cho web hay ứng dụng, bạn không nên bỏ lỡ những nút nhỏ tuyệt vời này của Famfamfam.

Phím tắt đến: Bộ sưu tập Silk, Mini và Flag.

ID DeivantART của Peter

Thiết kế thẻ ID dễ dàng với mẫu PSD này.

Gói sáng tạo Deluxive

Được phân phối miễn phí bởi Deluxive, gói PSD sáng tạo này bao gồm huy hiệu, khung lưới, nút, nhãn dán và hơn thế nữa.

Hình đại diện và SIG

Hình đại diện và mẫu chữ ký Vista trong PSD.

Ngọc lam PSD

Các yếu tố Vista.

Mẫu màn hình trình duyệt

Nếu bạn đang thiết kế trang web trong tệp Photoshop PSD, điều quan trọng là phải xem xét từng trình duyệt và màn hình hiển thị. Các PSD sau với phiên bản khác nhau của khu vực an toàn web Firefox, IE và Safari sẽ có ích.

Khu vực an toàn cho trình duyệt

Khu vực an toàn web cho Safari, IE và Firefox trong các hệ điều hành khác nhau, tất cả đều ở tệp PSD có thể tải xuống.

Phím tắt để: Mac OS X - Safari, Firefox. Windows Vista - IE, Firefox, Windows XP - IE, Firefox

Mẫu lưới Photoshop 960px

Mẫu lưới PSD có chiều rộng 960px để ngăn bạn sáng tác với các cạnh của màn hình có thể / có thể không thực sự là nơi bạn lên kế hoạch cho chúng.

(Thêm) Mẫu trình duyệt

Nếu bạn đang tìm kiếm nhiều mẫu trình duyệt (PSD) hơn nữa, bộ sưu tập của webdesignerstoolkit sẽ là thứ bạn đang tìm kiếm. Những người này có các mẫu cho Opera, Camino và các trình duyệt cổ điển như iCan, Netscape và Mozilla.

Các yếu tố trình duyệt web

Các phần tử biểu mẫu HTML tiêu chuẩn miễn phí hoặc cửa sổ trình duyệt cho Windows và Mac OSX.

Phím tắt để: Mac OS X - Safari, Firefox. Windows Vista - IE, Firefox, Windows XP - IE, Firefox

Màn hình trình duyệt và các thành phần trang web

Gói Vector miễn phí độc quyền từ VectorTuts. Đó là một bộ tài sản trang web vector hữu ích mà bạn có thể sử dụng để mô phỏng các dự án khách hàng của mình, trình bày công việc của bạn hoặc có được một hình ảnh nhanh trong khi đặt ra các trang web.

Bộ khởi động truyền thông

Nếu bạn đang tìm cách khởi động thiết kế trong PSD với hướng dẫn PSD cơ bản và cơ bản, thì bộ khởi động của Qu Truyền thông có lẽ là thứ bạn đang tìm kiếm. Nó đi kèm với các mẫu màu, vùng an toàn web của trình duyệt và các thành phần biểu mẫu cơ bản tất cả trong một PSD.

Con trỏ

Một bản chụp màn hình thông thường (màn hình in) sẽ không bao gồm con trỏ trong đầu ra. Nếu bạn phụ thuộc vào con trỏ để giúp chỉ ra và mô tả hình ảnh tốt hơn, các gói PSD sau đây có thể giúp.

Than chì đánh bóng

2 bộ con trỏ chuột khác nhau được sử dụng bởi HDADA.

Gói con trỏ Photoshop

Hữu ích cho những người tạo Hướng dẫn Photoshop.

Thiết kế sản phẩm

GUI iPhone PSD 3.0

Hình ảnh dưới đây cung cấp cho bạn một ý tưởng rõ ràng về tập tin PSD này bao gồm những gì. Cực kỳ hữu ích để giả lập bất kỳ giao diện phát triển iPhone. Được tạo bởi teehanlax.