Có khá nhiều lĩnh vực liên quan đến thiết kế trong ngành CNTT. Phổ biến nhất trong số họ là các nhà thiết kế, ẩn sau những từ viết tắt UX và UI. Chà, một số người thậm chí còn tìm cách đưa các nhà phát triển front-end vào làm nhà thiết kế. Chúng ta hãy cố gắng tìm hiểu xem ai là nhà thiết kế trong thế giới CNTT, sự khác biệt giữa UI và UX và mối quan hệ mà các kỹ sư front-end phải thiết kế.
Nhà thiết kế
Phát triển giao diện ứng dụng, trang web hay trò chơi là một quá trình khá phức tạp và đòi hỏi phải ứng dụng kiến thức từ các lĩnh vực khác nhau: kỹ thuật, tâm lý học và thiết kế. Các nhà thiết kế giao diện người dùng (bằng tiếng Anh - User Interface hoặc UI) tập trung vào cách hiển thị chức năng của trang web (tìm kiếm, tab, menu) và các chi tiết về tương tác giữa máy khách và giao diện. Mục tiêu của nhà thiết kế giao diện người dùng là thiết kế sản phẩm hiện đại có thể chấp nhận được về mặt thẩm mỹ . UX là viết tắt của User Experience, có nghĩa là “trải nghiệm người dùng”. Nhà thiết kế UX tập trung hơn vào khả năng sử dụng và sự hiểu biết về giao diện của người dùng tiềm năng. Một chuyên gia như vậy thường sẽ tiến hành nghiên cứu và khảo sát để tạo cơ sở cho việc tạo ra ý tưởng thiết kế, đồng thời kiểm tra các ý tưởng trong và sau khi phát triển. Nó thường tập trung vào cấu trúc, nội dung, điều hướng và cách người dùng tương tác với các yếu tố này.
Nó tạo ra sơ đồ trang web, nguyên mẫu, là cấu trúc cơ bản khi tạo phần mềm. Mục tiêu công việc của nhà thiết kế UX là giúp người dùng có được thông tin từ trang web một cách nhanh chóng và dễ dàng những gì họ đến đây để làm . Tuy nhiên, ngày nay người ta rất thường thấy hai chuyên ngành này được viết bằng dấu gạch chéo. Nghĩa là, nhiệm vụ của cả hai hướng đều được thực hiện bởi một chuyên gia. Một nhà thiết kế UX/UI thiết kế sự tương tác của người dùng với giao diện, quyết định chính xác những gì anh ta cần làm và chịu trách nhiệm về giao diện này sẽ trông như thế nào.
Những điều nhà thiết kế UX/UI cần biết
Trình soạn thảo đồ họa . Các công cụ phổ biến nhất trên thị trường là Adobe Photoshop, Adobe Illustrator, cũng như Sketch, Figma. Chọn một trình chỉnh sửa thuận tiện cho bạn và trước tiên hãy thử vẽ ảnh chụp màn hình của trang web hoặc ứng dụng, hiện đại hóa chúng một chút.
Công cụ tạo mẫu (Mockplus, Axure) . Công cụ tạo mẫu là mối liên kết giữa ý tưởng và việc thực hiện nó. Không quan trọng bạn sử dụng công cụ nào. Bạn có thể thử một vài và quyết định một cái phù hợp với phong cách và sở thích của bạn.
Tâm lý người dùng. Đã ở giai đoạn thiết kế, bạn nên suy nghĩ xem liệu việc sử dụng giao diện này có thuận tiện cho bạn hoặc người khác hay không. Hãy đặt mình vào vị trí của khách hàng, xây dựng mối liên hệ bền chặt với họ và chú ý đến nhu cầu của họ. Suy cho cùng, một sản phẩm sẽ thành công nếu có nhu cầu về nó.
Bạn cũng sẽ cần kiến thức về lý thuyết màu sắc . Chúng tôi biết một số điều từ thời thơ ấu, đặc biệt là những người đã theo học trường nghệ thuật. Tuy nhiên, có những chi tiết cụ thể nhất định liên quan đến công việc của các nhà thiết kế. Kiến thức cơ bản có thể được lấy từ sách hoặc bài viết trên Internet.
Tùy thuộc vào đặc thù công việc, bạn có thể cần hiểu biết về HTML và CSS hoặc (một số) ngôn ngữ lập trình (bạn có thể tìm thấy các liên kết đến các tài nguyên bên dưới, trong phần “Những điều một Front-end Developer nên biết”).
Nhà phát triển front-end
Nhiệm vụ chính của nhà phát triển front-end là phát triển phần giao diện máy khách. Tức là một chuyên gia như vậy sẽ “hồi sinh” những gì các nhà thiết kế đã thiết kế. Anh ta chịu trách nhiệm về hoạt động và vận hành giao diện và ít hơn về nội dung hình ảnh. Một nhà phát triển front-end thường cần tìm giải pháp tốt cho giao diện người dùng trong giai đoạn phát triển của nó, vì vậy anh ta thường cộng tác với một nhà thiết kế UX/UI. Mã do nhà phát triển giao diện người dùng viết sẽ chạy trong trình duyệt của người dùng (như họ nói, "ở phía máy khách"). Ngoài ra, một trong những nhiệm vụ quan trọng nhất là đảm bảo rằng trang web hoặc ứng dụng web trông giống nhau trên tất cả các nền tảng và trình duyệt.
Những điều một nhà phát triển Front-end nên biết
Theo quy định, giao diện người dùng dựa trên ba trụ cột: ngôn ngữ đánh dấu trang HTML, biểu định kiểu CSS và ngôn ngữ lập trình JavaScript. Ngoài ra, nhà phát triển front-end phải hiểu nguyên tắc hoạt động của giao thức HTTP, máy chủ và trình duyệt cũng như tính năng hiển thị giao diện trên các thiết bị khác nhau hiện có trên thị trường. Các công cụ và phương pháp tạo giao diện web không ngừng phát triển và thay đổi nên nhà phát triển phải liên tục theo dõi việc này.
HTML và CSS (bố cục)
Đây là cách bố trí, chính là những viên gạch mà từ đó địa điểm được xây dựng. Ngôn ngữ đánh dấu HTML quy định tổ chức, nội dung của trang web và tất cả các tương tác giữa chúng. Nó cho phép bạn chỉ định phần trên cùng của trang, phần dưới cùng, các khối bên với nội dung, tiêu đề, hiển thị văn bản và các phần tử đa phương tiện. Các biểu định kiểu CSS được sử dụng để trang trí các phần tử HTML. Chúng xác định chính xác cách hiển thị từng thành phần đồ họa nằm trên trang. Sử dụng các phiên bản mới nhất của HTML5 và CSS3, bạn có thể đặt các thành phần video và âm thanh trên một trang, tạo hình ảnh và hoạt ảnh 2D, thậm chí viết các trò chơi đơn giản. Không cần phải cố gắng nhớ tất cả các thẻ và kiểu cùng một lúc. Sẽ rất hữu ích nếu bạn tìm hiểu những điều cơ bản và áp dụng chúng vào hành động ngay lập tức. Một trang web rất tốt nơi bạn có thể tìm hiểu những điều cơ bản về HTML và CSS là W3School. Nhưng chỉ khi bạn có ít nhất kiến thức cơ bản về tiếng Anh.
Ngoài ra, nhà phát triển front-end phải hiểu sự phát triển đa trình duyệt và đa nền tảng, bố cục thích ứng và đáp ứng.
Khởi động
Nó là một framework cho HTML, CSS và JavaScript. Nghĩa là, một số mẫu nhất định, giống như từ một hàm tạo, bạn có thể tập hợp các trang web nhanh hơn nhiều so với việc không có chúng. Nhưng tất nhiên, bạn cần phải tự mình tùy chỉnh nó cho phù hợp với nhu cầu của mình. Nếu bạn biết tiếng Anh, chúng tôi khuyên bạn nên sử dụng trang web getbootstrap và w3schools tương tự .
JavaScript
Javascript là cốt lõi của phát triển front-end. Đây là ngôn ngữ lập trình giao diện đầu tiên và phổ biến nhất. Nó có thể thêm rất nhiều tính năng cho trang web. Ở cấp độ cơ bản, ngôn ngữ này cho phép bạn thêm các yếu tố tương tác vào một trang. Nó được sử dụng để tạo bản đồ cập nhật theo thời gian thực, trò chơi và phim trực tuyến tương tác. Trong các khóa học JavaRush cao cấp, chúng tôi học một chút về JavaScript. Bạn cũng có thể nghiên cứu nó tại cùng W3School hoặc đọc về nó bằng tiếng Nga trên trang web javascript.ru .
jQuery
jQuery là một thư viện Javascript chứa các plugin và tiện ích mở rộng có thể giúp việc phát triển trở nên dễ dàng và nhanh chóng hơn. Thay vì viết mã từ đầu, thư viện cho phép bạn thêm các thành phần làm sẵn, sau đó có thể tùy chỉnh cho một dự án cụ thể. Bạn có thể sử dụng các chức năng của biểu mẫu tìm kiếm tự động điền, sắp xếp lại và thay đổi kích thước lưới cũng như đặt đồng hồ đếm ngược. Khóa học jQuery thực hành tại w3school
Khung Javascript
Có nhiều loại khung khác nhau, nhưng bạn có thể chọn loại khung thuận tiện cho bạn sử dụng. Nổi tiếng nhất là Angular, Backbone, Ember và React. Chúng đại diện cho một cấu trúc mã được tạo sẵn. Chúng giúp tăng tốc độ phát triển. Và kết hợp với các thư viện, họ có thể giảm thiểu việc phát triển trang web hoặc ứng dụng từ đầu. Review 5 framework và thư viện JavaScript phổ biến nhất năm 2017
Hệ thống kiểm soát phiên bản Git
Hệ thống kiểm soát phiên bản có thể theo dõi những thay đổi được thực hiện đối với mã theo thời gian. Chúng cũng cho phép bạn quay lại phiên bản trước của dự án. Git là hệ thống kiểm soát phiên bản được sử dụng rộng rãi nhất. Biết cách làm việc với Git là một kỹ năng quan trọng đối với mọi nhà phát triển. Hướng dẫn Git bằng tiếng Nga
Kết luận ngắn gọn
UI là viết tắt của User Interface, có nghĩa là “giao diện người dùng”. Nghĩa là, Nhà thiết kế giao diện người dùng chịu trách nhiệm chính về cách sản phẩm được trình bày cho người dùng. Anh ấy phát triển các nút, biểu tượng, chọn phông chữ và chuẩn bị bố cục. UX là viết tắt của Trải nghiệm người dùng. Vì vậy, một nhà thiết kế UX thiết kế thiết kế của một trang web, một ứng dụng - hoặc bất cứ thứ gì - để người dùng cảm thấy thoải mái và hiểu được nội dung là gì, đồng thời anh ta có thể nhận được những gì mình cần từ trang web mà không cần nỗ lực nhiều. Rất thường xuyên, cả hai loại công việc đều được thực hiện bởi một dàn nhạc: nhà thiết kế UI/UX. Nhà phát triển Front-end làm sinh động công việc của các nhà thiết kế bằng cách đưa động lực vào đó: các nút bắt đầu được nhấn và hình ảnh bắt đầu thay đổi. Anh ta phải biết các ngôn ngữ lập trình, dày dặn kinh nghiệm về framework, bộ tiền xử lý và thư viện.
GO TO FULL VERSION