• fans
  • 1036 reader
  • followers
Có 3 bài viết trong series Manbics LayoutHiển thị

Sử dụng Photoshop để dựng giao diện cho trang web là kỹ thuật không thể thiếu của bất cứ web designer nào. Trong bài này NickB sẽ hướng dẫn các bạn sử dụng Photshop CS5 để dựng giao diện một trang web của công ty giả tưởng Manbics.

Bài này có mức độ khó là trung bình bởi và yêu cầu bạn phải nắm vững cơ bản các công cụ của Photoshop thì mới làm theo kịp. Trong quá trình làm theo video, NickB sẽ hướng dẫn bạn rất nhiều thủ thuật sử dụng Photoshop như Layer Group, Tạo đường Guide bằng hộp thoại, Align Layer Group v.v..

Tuy nhiên bài này sẽ không có file PSD gốc bởi vì như lời của tác giả “Tôi ko muốn bật mí nhiều về loạt bài này, có thể khi kết thúc mọi nguời sẽ hiểu, cũng muốn mọi nguời có chút bất ngờ :D. Tôi ko định up file psd vì thực ra nó ko cần thiết, tôi cố gắng làm từng buớc, để mọi nguời đều có thể tự làm lại, điều quan trọng ko phải là làm lại giống 100% mà nắm đuợc kỹ thuật hoặc cái mục đích, ý tuởng làm! Mọi nguời làm theo tut có kết quả giống là điều bình thường cái vấn đề của học qua tut là bạn đặt câu hỏi tại sao, và tự trả lời được nó, cũng giống như trong tut tôi sử dụng màu rồi đọc mã mà các bạn ko biết nó ở đâu ra :) và tại sao tôi lại dùng màu đó.

Thời lượng: 32 phút
Download định dạng .mp4 chất lượng cao :Mediafire
Dung lượng: 91 MB/ phần

Kết quả
  • http://www.tlvietnam.com xsthantien

    Rất hay và hữu ích. Mình sẽ tiếp tục thực hành và thăm web thường xuyên.

  • yahooomico

    Thanks NickB.Bài viết rất hữu ích.
    Mr.Dam comment không có học chút nào.Mong anh xóa comment của y đi để mọi người không phải đọc mấy dòng chữ ấy

    • http://webtruyen.net/truyen_tranh_sex/ truyen sex

      cám ơn izwebz.com.hiiiiiiiiiiiii

    • http://webtruyen.net/truyen_nguoi_lon/ truyen nguoi lon

      Rất hay và hữu ích. Mình sẽ tiếp tục thực hành và thăm web thường xuyên.

  • ngocbtk

    á thấy rồi :D thanks anh

  • ngocbtk

    Anh ơi giờ muốn down video đó thì làm sao…. down về để xem nữa anh à, chứ em không có internet….

  • mrYu

    Cảm ơn NickB.

    Sao đã lâu rồi mà chưa có phần 2 .. chờ dài cổ rồi :D

  • sĩ tài

    Tut rất hay, thanks NickB, phong cách làm PS của bạn cũng đáng ngưỡng mộ, quay tut mà nói lưu loát + thao tác nhanh (sử dụng phím tắt, rê chuột), ko vấp (chọn màu) như vậy thì lần đầu mình thấy đấy ^^.

    Mong bạn có nhiều Tut hay hơn nữa để chia sẻ !

  • Beth

    Video rất hay, gọn gàng, ít tốn time, rất ủng hộ các pro của Izwebz sử dụng English trong Tut, người học vừa luyện nghe vừa học được sự chuyên nghiệp.

    Mình thấy NickB nói cũng đơn giản dễ hiểu, sao các bạn phản đối nhiều quá, ai cảm thấy nhanh thì stop hoặc tua lại để xem, chứ làm video online mà cứ ê a thì chán lắm. Người ta có lòng hướng dẫn k công cho các bạn mà nói kiểu vậy nghe buồn quá :)

    P/S: Các anh trên Iz có cách gì chèn thêm thao tác bàn phím lên màn hình k nhỉ (mình nhớ có soft làm chuyện này – trên các trang luyện gõ bàn phím á), tại vì mình thấy có 1 số thao tác các bạn dùng phím tắt nhưng quên đọc, bọn mình hơi khó bắt kịp. Thanks so much :)

  • minh

    mình thấy làm cái này nói tiếng anh hay mà. Nâng cao kỹ năng tiếng anh nữa. Sau này đi làm dùng tiếng anh thường xuyên thôi.

  • [ K ]ai

    Anh có cái hình nền desktop đẹp quá.Anh share cho em với.mail em:buikhanhlinh90@gmail.com

  • Silence

    Thanks MrV2m for sharing this awesome tutorial!!

  • TramAnh

    Hay quá!
    nhưng e mới học photoshop nên thấy hơi nhanh quá.
    Rất mong anh sẽ post tiếp mấy bài hướng dẫn thiết kế layout này nữa.
    Thanks anh nhìu lắm!!!!!!!!!!!!

  • lethanhtung

    anh nickB oi sao anh noi nhanh the. Anh có thể nói chậm lại được không?^_^

  • Jenny Pham

    Àh em còn thắc mắc 1 điểm, sao video 32phut’ độ phân giải 1280×1024 chất lượng hình ảnh cũng tốt mà chỉ 91Mb ? Mấy anh có kinh nghiệm j bày em với, em thấy nhiều video trước nhiều cái hơi mờ mà lại nặng nề, em thấy từ h nên làm chất lượng như vày mà lại nhẹ, như vậy coi mới sướng :D

    • http://www.izwebz.com Demon Warlock

      Cái này do cách nén video thôi. Ngày trước máy còn cùi nên nén dưới dạng .mp4 mất mấy tiếng, nên toàn nén dưới dạng .avi. Giờ máy tốt hơn rồi nên sẽ chuyển sang .mp4.

  • Leovinse

    Tôi nghĩ mọi người đều hiểu được trình độ của anh ấy ở đâu, mức độ nào, tại sao anh ấy lại có mặt tại đây, và tôi cũng ko thấy anh ấy trả lời comment nào… Tôi ko hiểu anh ấy nghĩ j , nhưng tôi vẫn chờ đợi điều j đó từ anh ấy, tôi nghĩ anh ấy thể hiện bằng thực tế sẽ tốt hơn vạn lời nói.

    Tôi vẫn thích câu của NS Quốc Trung ” Đôi khi sexy không cần phải nhìn”, ở đây cũng vậy “Nghệ thuật không cần phải nói, diễn giải mà phải cảm nhận”

    Nói nhiều quá thì làm sao cảm nhận đây !

  • http://www.izwebz.com Trần Bình Tam

    Tuts rất pro, nhưng bro làm ơn nói tiếng Anh or tiếng Việt luôn, đừng nửa nạc nửa mỡ như vậy nghe khó chịu quá. Nghe thì hiểu chứ không có gì khó khăn, nhưng bro hãy học theo cách anh DW ấy, anh DW muôn năm. Thanks bro đã có 1 tuts photoshop rất hay và chuyên nghiệp.

    • Leovinse

      Xin mọi người đừng đem cái tôi của mình đặt lên quá cao, đừng phán xét phiến diện 1 ai, nghệ thuật là ko biên giới, không ngôn ngữ, tôi có giới thiệu 1 anh bạn trên deviantart xem qua tut mặc dù tôi nghĩ anh ấy ko hiểu 1 chút tiếng việt nào, anh chỉ im lặm và nói với tôi 1 từ “awesome”. Điều đó có nói lên với bạn điều j, thực sự anh ta ko quan tâm đến NickB nói j, anh ta chỉ cần xem, cảm nhận NickB đang làm j bằng ngôn ngữ Photoshop. Để bước ra với thế giới tôi nghĩ các bạn phải vượt qua chính mình chứ không phải là người khác.

    • le quy

      rất ủng hộ bạn MrV2m, tutorial rất bổ ích, và mình thấy bạn dùng english cho từ ngữ chuyên ngành IT là rất cần thiết, là IT muốn mở mang kiến thức thì các bạn phải tự rèn luyện vốn ngoại ngữ của mình, còn ai không nghe được mấy từ english của MrV2m nữa thì đành tìm tutorial khác mà xem nhé.

      • Jenny Pham

        Đây không phải là MrV2M bạn à, đây là NickB “New tutorial artist” của Izwebz, lần sau nhớ chú ý 1 chút =)). Mà em cũng nghĩ anh DW nên sửa cái author lại cho mọi người khỏi nhầm lẫn :D ủng hộ anh !

        • http://www.izwebz.com Demon Warlock

          yeah! sẽ đổi lại tên Author của bài này :D

    • nest

      Lập trình thì không ai để ý, cứ thiết kế ra là bà con cứ rộ cả lên, nghi lắm nha …
      tiếc là mình hok có khướu nói lắm, chứ cũng thích làm video lắm. Cũng thích viết bài, mà sợ viết về code chắc hok ai thèm đọc mất, mất khí thế lắm.Nhưng công nhận là video trực quan thật, mình cũng thích nó. Nhân tiện mình có đề nghị với mọi người là các bạn hãy đưa lên yêu cầu về chủ đề về code PHP mà các bạn thấy đuối quá chưa hiểu để anh em cùng tìm hiểu và đàm đạo cho izwebz bấn hết lên nhỉ. (không biết nói đến code có bị mấy bạn chém hok nữa)

      • http://www.izwebz.com Demon Warlock

        Nếu bạn muốn viết về PHP thì bạn cứ viết gì cũng được đó mà. Izwebz cũng không phải là chưa có video nào về PHP mà? tôi nhớ không nhầm thì cũng trên dưới 30 video về PHP. Nếu bạn nghĩ những Video đó chưa đúng tầm và chưa chuyên nghiệp, tôi luôn hoan nghênh những ai muốn chia sẻ với cộng đồng.

        Tôi và mọi người luôn chờ sự đóng góp của bạn.

    • Linh

      Mình cũng cảm thấy khó chịu với cái kiểu nói như thế này. Đoạn đầu nghe đã biết ngay người Việt và đã thấy chán rồi.
      Thật sự tút hay, nhưng noí thì chán. Chả muốn xem nốt nữa.
      Rất cảm ơn cho sự nhiệt tình, Nhưng tôi vẫn là người Việt Nam, mà người Việt Nam thì ghét sự khoe khoang nửa mùa.

      • http://teenhv.info 2TbP

        Bạn đang xem phim hay bạn đang học ?
        Những video tutorials đối với mình hay là những kiến thức có được có trong video như thế nào, nói thật mình cũng để ý NickB nói gì trong video đặc biệt rất thích cách làm của NickB, rất chuyên nghiệp !

  • Duc Nguyen

    Tên miền .com là ngon nhất, nhưng lại gặp các vấn đề pháp lí tại việt nam, phiền thật

    tham khảo tại : http://thongbaotenmien.vn/jsp/qna.jsp

  • kick ass

    Kiểu nào em cũng chơi hết, mỗi thứ học 1 ít, gom lại cũng dc một cục chứ chẳng ít

  • Leovinse

    Em chỉ chờ ngày 20 thôi :D !

  • http://con-ga-nen-chua.co Tên bạn

    Trân thành cảm ơn NickB.
    Là người còn non yếu về kỹ thuật đồ họa. Tôi thấy tutorial rất chuyên nghiệp nhưng tôi lại không lĩnh hội được nhiều kiến thức từ nó. Nếu có thể bạn nên xử dụng nhiều hơn ngôn ngữ tiếng Việt vì số lượng người Việt tham gia iz là rất lớn. Người làm web ở Việt Nam kỹ năng nghe tiếng Anh còn kém.

    Có bạn nói anh DW có cách nói không đẹp nhưng tôi thì lại thấy đó là cách truyền đạt hiệu quả nhất. Ở trường thầy giáo cô giáo dạy mọi thứ kể cả lập trình. Nói rất nghiêm túc ít pha trò nhưng chúng ta có hiểu được, nhớ được là bao nhiêu. Lên đây anh Dw nắn gân lại mới có tí chữ trong đầu. Anh em nào góp ý thì nhẹ lời thôi nhé các ông thầy trên iz đã cho chúng ta quá nhiểu rồi đừng làm họ buồn.

  • http://www.izwebz.com Demon Warlock

    22 comments mà không comment nào về kỹ thuật sử dụng trong Video hoặc câu hỏi mang tính xây dựng? Chắc dừng phần tranh luận lại ở đây nhỉ và tập trung vào video nhé các bô lão.

  • http://dinhcoi.info kenichifc

    thanks for tutorial. Love it, simple and effective :D

  • kimsangyoo

    Bác có thể cho em xin file PSD để nghiên cứu thêm được không? Em thích nhất cái nút bar nhìn hơi bóng bẩy, nhưng trong video em nhìn không rõ lắm ! Em đang cần file PSD của bác để nghiên cứu về phần đó… Nếu bác không muốn public thì send mail cho em nha : tuan_anh6674@yahoo.com

  • thanh

    Theo mình nghe NickB nói vậy cũng hay mà, có tí tiếng anh với tiếng việt thì xem đỡ bùn ngủ:D. Với đôi khi tiếng việt diễn tả một số thứ nó hơi dài dòng nên dùng tiếng anh sẽ gọn hơn:D đâu có gì phải quan trọng hóa vấn đề:D

    • Congcontra

      Chào bạn! Trước tiên mình nhận xét bạn là một người sống theo mốt, chạy đua theo mốt. Thấy người ta làm thì mình cứ làm theo chả cần bận tâm nhiều, mình nói như vậy có đúng không, đừng giận mình vì những lời thiệt tình này nha đây là ý kiến khách quan của mình thôi. Chắc hẳn các bạn có nghe tới cụm từ “Gìn giữ sự trong sáng cho Tiếng Việt” chứ, trên báo đài và các phương tiện thông tin đại chúng đều đang nói ầm cả lên, thông cảm cho ai chưa từng nghe qua! Bạn biết đất nước Trung Quốc chứ tôi ngưỡng mộ họ vì họ có niềm tự hào dân tộc rất sâu sắc trong các sự kiện lớn mà nhiều nước cùng tham gia như Olympic vừa tổ chức chẳng hạn. Họ sử dụng ngôn ngữ mẹ đẻ của mình trong buổi khai mạc cũng như bế mạc, còn trên bảng tên doanh nghiệp hay công ty đa quốc gia đều dùng chữ Trung Quốc to nhất, nổi bật nhất. Còn người Việt Nam mình cứ chạy theo phương tây để làm cho oai, mình nói vậy nếu có gì không hay xin mọi người bỏ qua! Giống như tiểu thuyết “Số đỏ” của Vũ Trọng Phụng vậy đó, ai đã đọc qua thì sẽ rõ!

      • Congcontra

        Trên đây là ý kiến dành cho bạn Gavin Giraffe đấy mình post nhầm!

      • http://nhat.0fees.net/relax Trần Ngọc Nhật

        Tôi rất chấp nhận cái quan điểm của bạn Congcontra bạn đã có một ý kiến rất hay cho vấn đề này . Hiện nay có nhiều người thích sống phục thuộc hơn là đọc lập “Tiếng mất rồi đến mất nước là như chơi” vì tiếng nói riêng đại diện cho dân tộc có chủ quyền độc lập . Hôm trước tôi có nói anh DW là nói hơi có chút không đẹp nhưng tôi lại đề cao cái nói của anh ấy vì anh ấy luôn sử dụng tiếng việt để nói với người việt.

      • thanh

        Bạn có thể đọc qua 1 câu nói của mình để biết mình là người ntn thì bạn cũng hay thật. Nhưng mình muốn nói với bạn là mình kô chạy theo mốt gì cả:)) Mình cũng tôn trọng tiếng Việt, nếu bạn so sánh giữa 1 tut pts với olympic bắc kinh thì mình thấy nó khập khiễng quá, bạn thấy Oympic tầm cỡ ntn? và ở đây, video này chỉ là video chia sẽ kinh nghiệm làm pts giữa những người anh, em, bạn bè với nhau. Đôi khi người viết tut cũng đã quen sử dụng tiếng Anh nên việc sửa lại tiếng Việt cũng khó khăn hơn. Vậy thôi, thông cảm tí cũng đâu có chết ai! Sở thích mỗi người thôi.

      • mrsku

        Hiz sao bợn này làm quá lên thế nhĩ nếu ko thích thì ko xem thế thôi, ng ta đã có lòng rồi bạn ngồi đây mà bắt bẻ ko đc ích lợi gì. Nếu muốn giữ gìn tiếng việt thì ra nói mấy đứa teen teen hiện nay kìa viết lách đọc muốn điên mới ra đc 1 chử haha.
        Mà hình như anh ấy sống ở nước ngoài thì phải…nói tiếng anh quen miệng nên thế

        • Listens

          Nói tiếng anh dở vậy tôi nghĩ chắc không vậy đâu đừng có mà nhầm tưởng :D nói tiếng anh mà như tiếng việt tôi cũng nói được như thế.

  • http://cotsong.vn Gavin Giraffe

    Great ! Mình ủng hộ bạn sử dụng tiếng Anh trong tutorial. Mình không đồng ý với bạn Congocontra.Bạn sử dụng được ngôn ngữ quốc tế trong khi bạn sống và làm việc ở vn có nghĩa là trình độ của bạn cũng ở mức quốc tế.Hãy tiếp tục như thế nha nếu ko có pha tiếng việt trong video thi càng hay nữa.Sinh viên vn hội nhập kém hơn những nước khác là do yếu ngoại ngữ đó bạn.Nếu Demon cũng dùng tiếng anh thì hay quá.1 vote cho video của Demon dùng English.

  • Congocontra

    Sao anh không bản địa hóa nhỉ? Nếu thích em có thể lên hàng tỉ site nói tiếng anh mà học hỏi cần gì phải vào izwebz, hay anh đã quên tiếng mẹ đẻ rồi chăng? Em nói ra điều này không có chút chỉ chít hay phê bình gì cả mà em muốn mình là người Việt Nam mình phải tự hào khi nói tiếng mẹ đẻ của mình chứ! Nhiều gã khổng lồ trên internet đã và đang thực hiện bản địa hóa khắp nới trên thế giới, như Google, Yahoo, Mozilla và cả Microsoft nữa vân vân còn rất nhiều. Nhưng hơi buồn vì người nước ngoài đang cố gắng nói tiếng mẹ đẻ của mình thì mình lại không thích chỉ thích tiếng nước ngoài thôi. Như anh Demon Warlock nói tiếng Việt rất hay lại vô cùng thân thiện, rất cám ơn anh rất nhiều nhiều! Qua những ý kiến của em mong rằng góp chút công sức xây dụng một môi trường học hỏi dễ dàng, tiện lợi nhất cho người Việt như em vậy!

    • http://nhat.0fees.net/relax Trần Ngọc Nhật

      Thế giới này có nhiều khi có những con người muốn người khác ngưỡng mộ mình mà bạn không hiểu tâm lý người ta rồi :(( “Một cây làm chẳng nên non” bạn ạ :D

  • Duc Nguyen

    Cám ơn nickB đã share, nhưng mình có chút góp ý : bạn thao tác nhanh quá có những chỗ bạn làm chưa hiểu sao lại được như vậy, những người pro pts thì không nói gì, còn những newbie thì sẽ không biết bước đó làm như thế nào… ( mình chỉ nói trường hợp newbie thôi nha)

    Hy vọng bạn sẽ có nhiều đóng góp thêm cho izwebz, xin cảm ơn !

    • bimzzz

      Chà,theo t các bạn nên tập trung vào trọng tâm của video,đó là học photoshop.
      Còn nói thực thì photoshop,css,.. đều là của bọn nước ngoài cả,a e nào thích truyền thống thì tự làm 1 một phần mềm “made in vn” ,hay tự tạo một ngôn ngữ “bảng xếp chồng” khác nhé,hoàn toàn ủng hộ.T cũng đang chờ một OS tiếng việt để sử dụng máy tính dễ dàng và đơn giản đây.
      @Nick B: Tut a rất hay,nhưng theo em thấy anh nên nói t/viêt nhiều hơn nữa,đặc biết là chỗ khó khó,cho các bạn dễ hiểu.Mà em nghĩ màn chào hỏi= t/việt hay hơn.mấy câu click ok,click ok nghe cũng hay.^^

      • Listens

        Viết nó thì ok mấy ông học toán tin viết ok mà nhưng khổ nỗi người việt lại thích xài hàng ngoại thế mới cùi chứ

  • thanhbim

    hihi,hay qua’.ung ho anh NIcKB qa troi lun

  • http://butchivn.com mrkyt

    Thế này mới gọi là thiết kế chứ web chứ. Chờ mãi, cuối cùng Izwebz đã có 1 designer :)

    • http://butchivn.com mrkyt

      Rút lại comment vừa rồi nha mọi người ^^ Híc.

  • Dinh Rỏm

    hj!! hay quá .. nhưng mè anh nói hơi nhanh…thao tác của anh nhanh quá làm em hoa cả mắt lun!! hjhj

  • http://duongpho.net MrV2m

    Chà chà! Khoái anh chàng NickB này roài nha. Tut hay đấy! Vậy là izwebz của mình có thêm 1 tay đồ họa đỉnh nữa roài nha.

    • Kim Danh

      Anh MrV2m uj? Sao tut bài photoshop của anh lại đứng lại rùi, em thấy lâu quá là lâu mà anh chưa ra phần kế tiếp. Rất mong là anh sẽ ra tut sớm nha. Em cám ơn anh.

      • http://duongpho.net MrV2m

        Thứ 2 tuần sau có, hứa danh dự luôn. ^^~

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