Những tài liệu nào một nhà thiết kế web sử dụng Photoshop gửi cho nhà phát triển?

Tôi đã triển khai chủ yếu các ứng dụng web và máy tính để bàn và đây là lần đầu tiên tôi thực sự bắt đầu làm việc với một nhà thiết kế đồ họa trên một trang web dành cho công chúng. Trong trường hợp này, nhà thiết kế đồ họa không làm HTML + CSS mà sử dụng Photoshop.

Loại vật liệu nào thường được cung cấp như là kết quả cuối cùng để thiết kế được thực hiện?

Ví dụ, tôi có nên lấy thứ gì đó không chỉ là các tệp PSD không? Làm thế nào về các trạng thái khác nhau (như di chuột liên kết, trạng thái hoạt động, vv) hoặc thiết kế đáp ứng? Tôi đang mong đợi quá chi tiết kỹ thuật?

Bất kỳ trợ giúp đánh giá cao.

Một mock-up thường được bàn giao cho nhà phát triển để biết phải làm gì. Điều này có thể thay đổi từ tệp PSD sang chỉ một hình ảnh phẳng, tùy thuộc vào quy trình làm việc. Theo kinh nghiệm của tôi, bàn giao mockup phẳng với tất cả các kích thước, kích thước phông chữ và màu sắc được sử dụng cộng với toàn bộ lát và hình ảnh được sử dụng. Về cơ bản là truyền tải được yêu cầu để hoàn thành dự án. Nhưng điều đó thực sự phụ thuộc vào quy trình làm việc. Nếu trang web được thực hiện chủ yếu bằng CSS, thì cần có thông tin khác (giá trị độ dốc, giá trị bóng đổ, cài đặt trước cắt xén hình ảnh).

Các trạng thái nút phải luôn được che. Tùy thuộc vào cách chúng sẽ được tạo ra (hoàn toàn là CSS hoặc lát), bạn nên cung cấp tất cả các màu, bán kính và kích thước hoặc chính các lát.

Thiết kế đáp ứng là một chút khác nhau. Thiết kế khung nhìn chỉ là sự khởi đầu. Điều mà nhà phát triển cũng cần biết là các yếu tố nên hoạt động như thế nào khi trang web dần bị "thu hẹp". Làm thế nào một người đàn ông sẽ hành xử nếu có ít tùy chọn được hiển thị? Những gì chỉ là một yếu tố danh sách trong chế độ xem web đầy đủ có thể thay đổi đáng kể màn hình trong chế độ xem trên thiết bị di động. Điều gì xảy ra với tất cả các yếu tố di chuột (không thể sử dụng chúng trong chế độ xem trên thiết bị di động)?

Câu trả lời của @ KMSTR là giải pháp 80%, nhưng nếu nhà thiết kế của bạn là một chuyên gia thực thụ, anh ấy / cô ấy sẽ cụ thể về các chi tiết nhỏ như khi hoạt hình chuyển tiếp sẽ xảy ra hoặc các phần tử DOM nên tải.

Nếu nhà thiết kế của bạn nằm trong top 20% đó, hãy hỏi một số luồng người dùng và khung lưới UX hoặc nếu họ đặc biệt tài năng, một nguyên mẫu được tạo trong After Effects hoặc Flash. Lý tưởng nhất là họ không để lại khía cạnh không xác định.

Tất cả phụ thuộc vào những gì bạn đã thỏa thuận với nhà thiết kế đồ họa.

Một số nhà thiết kế đồ họa không biết gì ngoài PhotoShop và sẽ bị mất nếu bạn yêu cầu bất kỳ thứ gì ngoài tệp PSD lớn.

Một số nhà thiết kế đồ họa rất thành thạo HTML, CSS và JS và có thể xây dựng toàn bộ mọi thứ cho bạn.

Và sau đó là tất cả mọi thứ ở giữa.

Tôi khuyên bạn nên nghiêng về phía sau, vì một nhà thiết kế web hiểu phương tiện sẽ tạo ra các thiết kế có tư duy tiến bộ hơn, phản ứng nhanh, không biết trình duyệt và linh hoạt hơn so với trước đây, nhưng trước đây có thể hoạt động quá lâu UI Developer đang hợp tác chặt chẽ với nhà thiết kế UI.

Bạn nên nói những gì mong đợi lên phía trước.

Tôi hoàn toàn có khả năng cung cấp các tệp psd, trang html / css hoặc thậm chí các trang jquery / php / mysql hoàn toàn động. Những gì được cung cấp phụ thuộc vào những gì được yêu cầu.

Nếu nhà phát triển chỉ muốn một psd thì đó là tất cả những gì tôi cung cấp và đó là công việc của họ để tạo các trang. Tôi sẽ không bao giờ gặp rắc rối khi xây dựng các trang nếu họ không muốn.

Tôi có một số khách hàng dựa vào tôi cho các trang đầy đủ chức năng có thể được đưa vào các trang web hiện có.

Tôi có một số khách hàng có một nhà phát triển từ chối sử dụng bất kỳ mã nào được gửi cho họ và khăng khăng tự mã hóa mọi thứ, vì vậy tôi cung cấp các tệp psd.

Không có câu trả lời chắc chắn cho câu hỏi của bạn. Đó là vấn đề được thỏa thuận trước khi bắt đầu công việc.

Bạn thực sự muốn một nhà thiết kế thành thạo HTML, CSS và Javascript. Nơi tôi làm việc, chúng tôi không bao giờ thấy một tập tin photoshop nào. Nhà thiết kế cung cấp cho chúng tôi một url đến trang, chúng tôi sao chép tất cả giao diện người dùng của mình và sau đó điền vào các khoảng trống để làm cho trang động.

Có một vài lý do tại sao điều này là thích hợp hơn:

1) Không có câu hỏi về những gì nhà thiết kế muốn - không có con số hoặc ghi chú phiên dịch, bạn sẽ thấy chính xác sản phẩm hoàn thiện sẽ trông như thế nào trước khi bạn chạm vào nó. Tất cả các giá trị CSS đều ở đó, mọi chức năng javascript hoặc hoạt hình.

2) Nó cắt giảm bất cứ lúc nào bạn cần dành để làm việc trên trang đó. Vâng, bạn vẫn phải tua lại nó và có thể thực hiện hàng núi công việc ở mặt sau, nhưng nó giúp bạn tiết kiệm một lượng thời gian đáng kể ở mặt trước.

Tất nhiên, không phải lúc nào bạn cũng kiểm soát được kiểu nhà thiết kế mà bạn làm việc cùng. Nhưng nếu bạn với một người chỉ làm photoshop, hãy chắc chắn rằng bạn thực sự có được tất cả các trạng thái nút và biết hoạt hình nào mà nhà thiết kế muốn. Hy vọng, nếu bạn làm việc trong môi trường như vậy, bạn có thể đi lên và nói chuyện với nhà thiết kế của bạn và yêu cầu làm rõ khi bạn cần.