A Multidisciplinary Designer

Currently Based in Danang

Home » Journals » #01 Hành trình xây dựng Portfolio cá nhân

#01 Hành trình xây dựng Portfolio cá nhân

“Good things always take time” – câu nói này luôn đúng, đặc biệt khi mình có thể hoàn thành phiên bản cuối cùng của portfolio. Từ lúc làm marketing agency, mình luôn mong muốn có một website portfolio riêng – nơi mà mình thể hiện bản thân nhiều hơn và là không gian cá nhân để lưu trữ lại những trải nghiệm quý giá.

Điều đặc biệt là những gì mình học được trong 3+ năm xây dựng portfolio vượt xa cái gọi là “có một website đẹp”. Đó là hành trình hiểu rõ hơn về design, về code (kiến thức đã được update từ 0 lên 0.5 trong thang 100 :p), về bản thân, và quan trọng hơn là về sự kiên trì, tính nhẫn nại khi bắt tay vào làm một việc gì mà mình yêu thích.

WordPress + Elementor = "Ức chế" Ughhh..

Tới bây giờ thì mặc dù đã có rất rất rất nhiều các nền tảng hỗ trợ dựng website mà không cần biết code, đẹp rụng rời với tá lả hiệu ứng sử dụng GSAP, Threejs,… Nhưng trời tính không bằng “Tiền tính”, chi phí để nuôi và duy trì website cho các nền tảng này khá cao nên mình vẫn quyết định trung thành với WordPress và Elementor.

Để bắt đầu, mình vội vàng mua template premium với giá 20$ (đã được áp mã giảm) từ Themeforest, nghĩ rằng chỉ cần import và tùy chỉnh đôi chút là sẽ có ngay cho mình bản website hoàn thiện đúng ý.

Lúc này mọi chuyện mới bắt đầu? Thực tết mọi thứ đều sai:

  1. Demo đẹp, nhưng nội dung mình muốn lại hoàn toàn khác

  2. Animation chỉ ở mức cơ bản, không đủ wow

  3. Responsive design thì bị lệch và mình cũng không biết vì sao? Lúc đấy chỉ test theo bản năng vì mình “đóng vai là người xem portfolio trên điện thoại”.

Mình lúc đó không biết CSS là gì, CSS box model, viewport, container hay margin-padding là các concept ra sao. Những thứ mà các web designer, developer sẽ coi là “basic”, với mình thì lại là một thế giới mới.

Lần đầu làm chuyện ấy – Tải template về dựng web nhưng fail lòi :v

Đúc kết lại ở phần này

  • Học cách setup WordPress + Elementor cơ bản

  • Phân biệt giữa theme, plugin, widget

  • Tầm quan trọng của responsive design

  • Các khái niệm CSS cơ bản (mặc dù vẫn mơ hồ): margin, padding, vh/vw, container..

  • Và điều quan trọng phải nhắc lại 3 lần đó là “KHÔNG VỘI VÀNG”

Tìm kiếm phong cách

Sau một thời gian cảm thấy không hài lòng, tôi quyết định mua một premium theme tên gọi là Laurit vì nó phù hợp hơn với vision của tôi: minimalist nhưng vẫn đủ chuyên nghiệp, gọn gàng nhưng không tẻ nhạt.

Lần này, tôi đã học được cách làm quen nhanh hơn với một theme mới. Nhưng sau vài tháng sử dụng, tôi lại cảm thấy nó vẫn chưa “đủ” với mình. 

Laurit Theme – Mọi người có thể check Demo tại Themeforest

Sau khi tham khảo nhiều portfolio khác mà mình yêu thích trên các website khác thì mình quyết định xây dựng một layout mới hoàn toàn dựa trên core của Laurit theme có sẵn. 

Khoảng đó, mình quyết định thêm nhiều plugin animation vào website để làm nó trở nên “wow” hơn:

-> Kết quả? Một thảm họa. Website thường xuyên gặp lỗi:

  1. Animation không hoạt động 

  2. Trang tải chậm 

  3. Một số widget của Elementor hoàn toàn bị ẩn

  4. Các plugin có sự xung đột với nhau

Lúc này mình gần như bất lực vì quá nhiều lỗi mà mình lại không biết nên bắt đầu từ đầu. Cảm giác cái vòng luẩn quẩn đập đi xây lại quá nhiều khiến mình nản dần. Và rồi sau nhiều lần thử tìm cách cứu vãn cái website không thể nào tệ hơn thì mình quyết định quay trở lại với theme mặc định của Laurit. 

Khi chuyên môn giúp ta nhìn "rõ" hơn

Một trong những điểm chuyển biến lớn nhất xảy ra khi mình chuyển từ marketing sang làm Product Design. Công việc mới này mang lại cho mình những cái nhìn chung và tổng quát đối với những gì mà mình đang làm mỗi ngày. 

  1. Làm việc với Dev mỗi ngày -> Thúc đẩy cho bản thân trang bị một chút kiến thức về code
  2. Mình bắt đầu hiểu “vì sao cái này load chậm”, “vì sao responsive lại bị vậy”

  3. Nếu trong marketing, mình cần phải thấy nó đẹp, nó “chạm” được đến người xem, thì trong UIUX, mình phải suy nghĩ: “cái này có scale được không?”, “cái này có consistent không?”, “cái này có accessibility không?”

  4. Responsive design không phải là một tùy chọn, mà là yêu cầu bắt buộc, và phải luôn luôn test mọi design mà mình dựng lên.

Kết quả: Việc xây dựng portfolio sau này trở nên dễ thở hơn rất nhiều. Mình không còn lòng vòng trong việc “tại sao nó trông lạ lùng”, mà mình có thể xác định được vấn đề và tìm ra giải pháp một cách tốt hơn. 

05 tháng, 03 layous, 01 final version

Năm nay, sau 5 tháng kiên trì và thử nghiệm 3 kiểu layout khác nhau, tôi cuối cùng đã cho ra được một final version mình cảm thấy khá hài lòng.

Điều khác biệt lần này không phải vì design “wow”, mà vì nó:

  1. Đáp ứng đúng mục đích của một portfolio

  2. Có performance tốt hơn so với những cái cũ

  3. Responsive hiệu quả hơn trên các thiết bị khác

  4. Phản ánh được brand/personality của tôi

  5. Dễ điều chỉnh và setup

Làm Portfolio với mình cũng coi như là xây dựng một sản phẩm, luôn cần phải cải thiện nó theo thời gian. Kết hợp với những ý ở trên thì dưới đây có lẽ là những gạch đầu dòng bổ sung mà mình đúc kết được sau khoảng thời gian khá dài xây dựng Portfolio: 

  1. Hãy luôn kiên trì, nhẫn nại. Kết quả sẽ không thể thấy được ngay tức khắc, nhưng khi thấy được rồi, bạn sẽ thấy nó đáng giá
  2. Learn the fundamentals: Trước khi làm một cái gì, hãy bắt đầu bằng việc tìm hiểu những thứ cơ bản nhất. 
  3.  Lựa chọn Platform nào không quan trọng bằng việc bạn phải thật sự biết mình cần gì
  4. Tự đặt câu hỏi trước khi đưa ra quyết định: “Cái này đang đang phục vụ cho mục đích gì?
  5. Portfolio như lầ một “living document” và bạn sẽ luôn cải thiện nó theo thời gian. 

Get in touch

Website designed by Linggchi and built with Elementor

A Multidisciplinary Designer

Currently Based in Danang