UX Tips – Web tốt phải load nhanh dưới 2 giây!

Như thế nào là 1 trang web có UX tốt? Muốn trở thành UX Design thì các bạn lập trình viên cần lưu ý điều gì? Tất cả đã được giải đáp tại buổi phỏng vấn của TopDev với anh Trần Trọng Thanh – người đồng sáng lập của Nâu Studio xoay quanh những kinh nghiệm quý giá liên quan đến UX/UI.

Xem thêm: Việc làm ux designer lương cao

1/ Được biết Nâu Studio hoạt động thiên về Thiết kế, nên ắt hẳn công ty mình sẽ mạnh về UX/ UI Design – lĩnh vực còn chưa phát triển nhiều tại thị trường Việt Nam?

Vì được vấn đề đó nên mục tiêu và định hướng ban đầu khi thành lập công ty là muốn đào sâu về Front End và UX/UI. Tụi anh làm ra những sản phẩm cho khách hàng & mang tính duy nhất, không dùng đến template, bootstrap hay những CSS frameworks. Nâu Studio hầu hết đều code lại từ đầu, làm sao để giao diện, theme của mình hoàn toàn khác biệt. Tất nhiên bên mình cũng sử dụng những nguyên tắc, chuẩn mực UX cơ bản nhất để build như các best practices về vị trí đặt button, menu, kích thước font…

2/ Vậy 1 bạn lập trình Web muốn tìm hiểu về UX thì các bạn cần phải tập trung vào những điểm nào?

Thực ra đối với các lập trình viên, đầu tiên các bạn khoan quan tâm đến UX mà hãy rèn luyện kĩ năng lập trình của mình trước. Khi đã thuần thục rồi, thì lúc đó mới bắt đầu thoát ra hơn, suy nghĩ thêm những thứ liên quan đến trải nghiệm người dùng, những thứ không nằm trong bài vở mà thuộc về kinh nghiệm. Khi nói về UX, đòi hỏi các bạn phải làm nhiều, đồng thời phải có những tích lũy về kiến thức như đọc những bài viết, sách UX liên quan

Thực sự là ở Việt Nam mình cũng chưa có những trường lớp nào chuyên dạy UX 1 cách bài bản. Nếu có thì hầu hết vẫn dừng ở mức sử dụng công cụ, còn để thực sự hiểu UX thì mình cần có nền tảng liên quan đến principles. Trong đó anh thấy 1 cuốn sách rất hay mà các bạn nên đọc là Don’t Make Me Think, phù hợp với cả những bạn chưa biết gì về UX Design. Quyển này đặt ra những vấn đề tuy rất hiển nhiên nhưng chúng ta hầu như không để ý, hệ thống hóa lại các vấn đề đó thành những principles. Từ những kiến thức nền tảng đó, các bạn mới đọc đến những cuốn sách đi sâu vào thực tế.

Ngoài ra khi bắt tay vào làm giao diện thiết kế, việc bắt chước điều hoàn toàn bình thường. Hãy nghiên cứu những trang web được giải thưởng vì đây là những showcase rất hay để học hỏi.

3/ Khi tuyển dụng các bạn lập trình viên cho Nâu Studio, không biết anh có yêu cầu skill nào đặc biệt không?

Anh cũng thay đổi tiêu chuẩn tuyển dụng của mình 1,2 lần để đạt được mục đích tuyên dụng nhưng định hướng trước đây và hiện tại vẫn luôn nhấn mạnh vào thái độ của các bạn với công việc thông qua những trao đổi trực tiếp hay khi mình đưa ra những tình huống để các bạn xử lý. Từ đấy mình sẽ đánh giá được các bạn có thích công việc hay không, có nghiêm túc, có chuyên nghiệp hay không.

Anh lúc nào cũng muốn tìm 1 nhân sự, 1 người đi lâu dài với công ty nên tụi anh rất chú trọng đến định hướng về sự nghiệp của các bạn. Các bạn lập trình viên vào Nâu Studio phải xác định rõ ràng là các bạn ấy có thực sự thích Front End hay không, có thật sự thích những công việc mà anh sẽ giao cho các bạn làm hay chỉ vào làm cho đúng giờ, đúng ngày.

Điểm khác nữa là khả năng tư duy. Đây là điểm mà các bạn lập trình viên rất cần có để tiến xa hơn trong công việc. Đối với các bạn fresh, Nâu Studio có đưa ra 1 bài test về IQ trên platform online. Sẽ có điểm ngưỡng để anh đánh giá mức độ phù hợp với công việc vì tư duy logic là điều không thể thiếu ở các bạn lập trình viên. Khả năng giao tiếp, soft skills thì mình có thể định hướng và hướng dẫn sau.

4/ Nói về thái độ làm việc của lập trình viên, thì anh có thể chia sẻ thêm về văn hóa của Nâu Studio?

Như đã đề cập trên website, Nâu Studio tập trung vào trải nghiệm của người dùng và trải nghiệm của lập trình viên. Trải nghiệm của người dùng tức là những sản phẩm, những thành quả của Nâu Studio đưa ra đều rất chú ý đến UX và UI. Về phía các bạn lập trình viên thì anh thường nhắc nhở các bạn chú ý đến những chi tiết giúp tăng UX cho người dùng, chẳng hạn như button phải có hiệu ứng chạm để người dùng biết là họ đã chạm đúng. Hoặc như 1 link theo chuẩn Mobile-first thì phải có kích thước tối thiểu là 40 pixel vì nếu các bạn làm quá nhỏ, thì tay rất khó đụng tới được vùng chạm. Ngoài ra còn có những chi tiết về màu sắc, font chữ… phù hợp với thiết bị di động hay desktop. Đây là những bước đầu tiên mà các bạn cần chú ý, để sau này khi các bạn lên vị trí Senior, có thể truyền lại cho các bạn mới.

Ngoài ra, văn hóa của Nâu Studio là chia sẻ những gì mà các bạn tìm hiểu được thông qua kênh chat chung. Tụi anh cũng có riêng 1 ngày là Friday Sharing để 1 bạn đại diện đứng lên thuyết trình về chủ đề tự do, không nhất thiết đến kĩ thuật vì buổi thuyết trình có sự tham gia của cả Designer, HR, Admin, Manager, Dev…

Điểm nữa mà Nâu Studio cũng rất tự hào đó là khâu đào tạo mảng đào tạo nhân sự. Tụi anh xác định ngay từ đầu các bạn lập trình viên là những người sẽ đi lâu dài cùng mình, là những người làm những dự án lớn và phức tạp hơn mà tụi anh sẽ giao nên tụi anh đào tạo các bạn rất kĩ. Như hiện tại Nâu Studio tập trung vào Front End và Javascript nên các bạn sẽ được nắm vững các kiến thức nền, sau đó mới học tiếp những nội dung khác như ReactJS, NodeJS…

Nguyên tắc làm việc của Nâu Studio là rất chú trọng quy ước khi lập trình – đây cũng là trải nghiệm cho lập trình viên mà anh muốn nói đến. Nâu Studio có 1 bộ quy chuẩn cho việc viết code, cùng những công cụ để kiểm tra các bạn đã viết đúng hay chưa, từ đó mới có thể gò các bạn vào 1 nếp để viết cùng 1 style với nhau, cùng best practice với nhau. Điều này đặc biệt có lợi trong trường hợp phải thay người mới thì họ sẽ bắt đầu rất nhanh, hạn chế những khó khăn khi đọc code do thay đổi văn phong, quy ước.

5/ Quy trình này là của riêng Nâu Studio hay có thể áp dụng được ở những nơi khác?

Team nào cũng có thể áp dụng được nếu họ thấy phù hợp.. Anh đang tổng hợp lại các tài liệu và open source tại http://code.naustud.io/ và  sẽ chia sẻ bộ quy ước này rộng rãi đến cộng đồng trong thời gian tới . Bộ quy ước này cũng dựa trên những quy ước đến từ các công ty lớn như Javascript thì dựa trên quy ước của Airbnb, Google cũng như những công ty lớn khác…

6/ Thiết kế UX cho 1 website nước ngoài sẽ có những khác biệt gì so với thiết kế UX của 1 website cho người Việt Nam, chẳng hạn cho những user là người lớn tuổi?

Nói ví dụ về icon thì bọn anh đều có text đi kèm, dùng dạng label nhiều hơn. Còn về cách sắp đặt vị trí thì bên anh vẫn chưa thấy có gì quá khác biệt. Có thể là vì các sản phẩm của Nâu đa phần vẫn tập trung vào đối tượng người trẻ, biết về kĩ thuật nên mình cùng chỉ dựa trên những practices chung. Trong trường hợp có yêu cầu với các đối tượng đặc biệt thì bên anh sẽ tổ chức những buổi usability testing với những đối tượng người dùng thật để đánh giá phản ứng của họ với giao diện thử nghiệm . Dựa trên đó mình sẽ lưu ý lại và đưa ra những điều chỉnh phù hợp.

7/ Theo anh những điểm nào để đánh giá thành công về mặt UX của 1 website?

Theo tiêu chuẩn của Nâu Studio, website phải load nhanh dưới 2s. Tụi anh làm được điều này vì những công nghệ của NodeJS cũng đã tối ưu và rất nhanh. Ngoài ra, tụi anh cũng áp dụng các công cụ tự động hóa để tối ưu Front End từ lúc code cho đến lúc deploy.

Thứ 2 là website đó phải mobile-friendly như font chữ phải vừa mắt, kích cỡ nút và link phải phù hợp, giao diện tùy ứng (responsive UI) phải cung cấp được thông tin phù hợp nhất cho các user sử dụng di động. Các thống kê của 2017 xác nhận là người dùng đã vào web bằng thiết bị di động với màn hình chạm nhiều hơn trên máy tính (laptop, desktop), nên Mobile-first là điều bắt buộc. Tất cả các website mà Nâu Studio làm đều xuất phát từ Mobile, sau đó mới mở ra layout cho desktop. Cách tiếp cận code cũng như vậy như Code CSS cho Mobile trước tiên, sau đó mới điều chỉnh cho những giao diện lớn hơn.

Đa phần thì các framework, template của WordPress chẳng hạn thì vẫn theo Desktop trước. Với cách làm này, thì CSS ban đầu mình viết ra sẽ chỉ chạy được trên Desktop, lúc này nếu mở bằng điện thoại thì cả trang web sẽ bị scale xuống, chữ rất nhỏ. Ngược lại, CSS đầu tiên viết ra sẽ dành cho Mobile thì mọi thứ sẽ dễ điều chỉnh hơn về sau.

Cách làm này đối với thế giới thì không mới nhưng ở Việt Nam thì còn khá mới.

8/ Định hướng sắp tới của Nâu Studio?

Trước đây Nâu tập trung vào outsource, làm services cho khách hàng. Nhưng sắp tới công ty đang tập trung vào sản phẩm phần mềm về quản lý nhân sự, được build theo hướng Software as a Service và sẽ được ra mắt vào cuối tháng 7. Unique Selling Point trong phần mềm này là phương pháp quản lý KPI mới: Objective – Key Results chia công việc thành những objectives và update tiến trình để đi từ 0 đến 100%. Mỗi mục tiêu sẽ được chia nhỏ theo từng cấp bậc: người quản lý, trưởng phòng ban, các thành viên…. Từ đó mình sẽ có được những cảnh báo và điều chỉnh kịp thời, tương tự như những gì Google đang làm để đưa 1 bộ máy lớn đi lên.

Nguồn: TopDev via Techtalk