• fans
  • 1036 reader
  • followers
Vertical Scrolling: Photoshop layout
  • Tutorial Details
  • Độ khó: Căn bản
  • Thời gian: 42 phút
  • File size: 220 MB
  • Yêu cầu: Photoshop căn bản

Sau khi đã hoàn thành về series photoshop căn bản thì chúng ta sẽ bước qua những video hướng dẫn mới, với kỹ thuật cao hơn, không chỉ có thiết kế và còn cả lập trình nữa. Thông qua series này, mình sẽ hướng dẫn các bạn làm một website từ đầu tới cuối với phong cách Vertical Scrolling.

Trong bài đầu tiên thì chúng ta sẽ sử dụng photoshop để layout một website giả lập với tên là “Izwebz survey” nhằm khảo sát ý kiến người dùng. Ngoài các thao tác căn bản như đã học trong các bài trước, chúng ta sẽ tìm hiểu thêm về cách tạo texture cho website.
Phía dưới là hình demo website sau khi đã được tao ra với công cụ photoshop.

Demo izwebz survey

- Chú ý mã màu: Đỏ:e74c4a; Xanh:30adbf; Background:f7f7ef;

- Tham khảo thêm các cách khác tạo texture: Webdesign.tutsplus.com

Trong bài thứ 2 của series này thì chúng ta sẽ bắt tay vào chuyển từ photoshop sang HTML & CSS. Tuy nhiên, chúng ra sẽ sử dụng HTML5 và CSS3. Cái này mình sẽ nói rõ trong bài tiếp theo.

Giờ thì hãy thưởng thức thôi nào.

Võ Minh Mẫn Website facebook twitter user_email

Nghề chính là chém gió, quăng bom và ném lựu đạn. Nghề phụ là cắt cỏ, chém chuối, cưa cây......

  • Quy Tran

    Bài thứ nhất “Dùng photoshop để tạo ra layout giả lập” này em tìm hoài không thấy link nhĩ

  • http://www.facebook.com/dplee.it Hòađp Lee

    Anh ơi, có hướng dẫn làm web horizonal layout không anh! ^^

    • http://www.facebook.com/vo.minh.man Võ Minh Mẫn

      Cái đó thì chắc em phải tự tu duy rồi :)

  • luffysama

    Bạn ơi Link die rùi nè, upload lại giúp mình được không :D

    • http://minhman.me Võ Minh Mẫn

      Youtube có bản HD đó bạn download về đỡ, để mình upload lại MF nhé.
      Thanks!

  • http://www.izwebz.com/video-tutorials/vertical-scrolling-photoshop-layout/ kameka

    anh black thuyết minh ngoài lề nhiều quá. kiểu dạy thêm kiếm tiền câu giờ, nói chung là viết văn lủng củng ,thừa nhiều, cần xem sét

    • demon_light

      ngon thì lên làm tus dạy xem??? — sau nói gì thì nhẹ nhàng cho dễ nge một chút!
      Công anh Minh Mẫn bỏ ra làm cái tus này ko nhiều thì cũng là ít. Nên Thaks ! anh đã hướng dẫn mới phải !!!

  • lanhvt88

    Thank for sharing :D

  • http://gamesieuhot.com gamesieuhot

    đang học web mà pts ni thì gà hic
    logo site mình làm cũng chưa xong
    http://gamesieuhot.com
    thank anh

  • gaga

    cám ơn anh rất nhiều

  • ChuBin

    tutorial nay hay wa..! thank anh nhiều :D:D

  • Ngô yến

    Thanks anh Minh Mẫn nhiều

  • http://xemboi.seo1k.net xem boi

    mình thấy anh Mẫn làm như vậy là được chỉ cần hướng dẫn như vậy là đủ vì làm video rất tốn thời gian mà anh.

  • http://forum.szone.vn Lê Hoàng Nhất Kha

    lâu lắm rồi mới thấy izweb có tut mới thật là thích quá đi :x

  • Daniel Nguyen

    Cho hỏi là width của cái layout trong PTS là bao nhiêu px vậy?

    • http://minhman.me Võ Minh Mẫn

      Mình để width là 1280px đó bạn.

  • http://tuoitretamdao.net Thanh rossi

    Cái sọc xanh ngang dọc để làm gì thế a ơi

  • http://anhemcorp.com dragonvnit

    Muốn thanks các bác thật nhiều, tiếc là không có nút like :x cảm ơn admin nha’

  • Trang

    Site này bạn có hướng dẫn làm trên WordPress ko? Mình rất thích WordPress.

  • http://minhman.me Võ Minh Mẫn

    Đã update lại link nhé.
    Về quê vừa lên.

  • Nhật Nam

    Ngồi hóng phần 2 HTML5

  • Võ Xuân Anh

    Anh Mẫn ơi. Sao em download mà nó đòi key ha anh.
    Anh cho em key được không.????

  • http://butchi.blog.com mrkyt

    Cảm ơn Võ Minh Mẫn về những tutorial, song cần trau chuốt và nâng cao chất lượng sản phẩm hơn nữa.

Newbie

Các series nên xem trên izwebz cho newbie

Khi vào izwebz chắc nhiều bạn cho rằng các bài viết trên izwebz đều không có hệ thống gì cả? Thực chất, các bài biết đều đi theo một series của riêng nó, ví dụ như PHP, HTML & CSS, PSD2HTML, Photoshop, illustrator,… Trong bài viết này, mình sẽ tổng hợp lại các series bài viết cần thiết cho một newbie.

Izwebz facebook group

Social connect

Recent Comments

Archives