Xu hướng thiết kế 2013

1. Giao diện phẳng (flat)
– đơn giản, dễ thực hiện
– dễ thấy trong UI của Win8 và các dòng sản phẩm của Microsoft. HTC cũng có xu hướng này.

2. Càng ít nút bấm càng tốt
– tăng diện tích nhìn cho user
– tránh rối, app buộc phải đưa những gì hay dùng nhất ra ngoài
– dùng nhiều hơn các cử chỉ (gestures) thay vì bấm nút (quẹt trái quẹt phải để xem chat list và channel list trong app FB)

3. Dùng các hoạt hoạ (animation) để gợi ý
– trực quan, dễ xem
– dễ thấy khi refresh feed của FB, hiệu ứng nảy lên khi hết list

4. Menu xổ xuống dạng hamburger
– icon hamburger đã thành một dạng chuẩn, hầu hết người dùng đều hiểu bấm vào đó là có menu xổ ra
– tương tự như context menu trên Windows

5. App native được chú trọng hơn Web

6. Khi không thể viết app native, hãy cố gắng để nó Responsive
– tận dụng tốt hơn không gian màn hình
– ẩn giấu những phần ko cần thiết khi hiển thị trên màn hình nhỏ

7. Làm cho trang web rộng hơn
– hầu hết màn hình ngày nay là dạng màn ảnh rộng (wide screen)
– tận dụng không gian tốt hơn, tránh khoảng trống quá nhiều trên các màn hình to, rộng
– tăng độ rộng lên 960px hay 1000px

8. Sử dụng cỡ font lớn hơn
– tăng khả năng đọc cho nội dung (nhất là premium content)
– hiển thị tốt hơn trên màn hình nhỏ

9. Màu xanh: #00A0D1

10. Đồ hoạ vector
– nét hơn
– các browser hỗ trợ tốt hơn, dễ tương thích với các độ phân giải và mật độ dpi khác nhau

From: http://theindustry.cc/2013/01/07/13-design-trends-for-2013/

Advertisements

FASTFOOD: 2013 sẽ là năm cất cánh cho web

Vì sao?

Một số công nghệ web đã trưởng thành và sẽ được triển khai trên nhiều trang web, mang lại nhiều ấn tượng cho user, giảm công sức cho lập trình viên khi phát triển và phân phối ứng dụng

CSS filters, mang sức mạnh đồ hoạ 3D

Cho phép thực hiện nhiều hiệu ứng đồ hoạ phức tạp (làm mờ, đổ bóng, bóp mép, đổi hình dạng của đối tượng, thay đổi mật độ màu, …) bằng các khai báo đơn giản.

Cho phép thực hiện các thao tác đồ hoạ phức tạp như đổ bóng vertex (như dùng GLSL, được ứng dụng phổ biến nhiều năm nay trong các xử lý đồ hoạ 3D)

Xem ví dụ tại CSS Filter

Lợi ích lớn cho các game nền web, các ứng dụng cần những hiệu ứng gây shock về đồ hoạ, xử lý ảnh

 

Google Chrome Apps

Google ko đối đầu trực tiếp với Windows, Mac, Linux, mà họ tạo ra Chrome,  cố gắng làm cho Chrome có mặt tại nhiều nơi, nhiều thiết bị như TV, laptop, điện thoại

Với Chrome, Google mang lại cho các lập trình viên khả năng viết chương trình bằng JS HTML CSS (là đơn giản hơn nhiều so với việc viết bằng C# Java PHP), chạy chương trình trong Chrome.

  • Phát triển nhanh chóng, thuận tiện
  • Rất dễ phân phối (vì có WebStore)
  • Có nhiều khả năng tương tác phần cứng (cổng serial, usb, bluetooth, webcam, mic, loa, âm thanh, …)
  • Vẽ thêm “cánh” (tương tác, tính năng) cho  ”hổ” (các trang web sẵn có)

Hiện tại, viết extension/app cho Chrome là dễ nhất, nhanh nhất và thuận tiện nhất (so với việc viết cho Firefox, IE, Opera)


ECMAScript 6, cải tiến Javascript

ECMAScript 6 (ES6), là cải tiến của JavaScript, sửa các vấn đề “chíu khọ” trong ngôn ngữ JavaScript, cung cấp tính năng mới thuận tiện hơn, dễ bảo trì mã nguồn hơn.

  • thêm class, kế thừa, mixins (lai ghép, tương tự như đa kế thừa trong C++)
  • Hệ thống tải/nạp module (giúp tổ chức mã nguồn gọn gàng, nhanh, dễ quản lý hơn)
  • proxies
  • cải tiến việc gọi hàm bất đồng bộ (asynchronous), vứt bỏ sự rối rắm của các hàm callback

Web Components

Web Components cho ta khả năng thêm tag mới cho trình duyệt, tương tự như những tag gốc sẵn có. VD:

  • Tạo ra thẻ mới (VD mydiv)
  • Tạo style và tính năng cho thẻ đó
  • người dùng khác chỉ cần khai báo thẻ, tương tự như thẻ gốc (div)

Web Components sẽ thay đổi cách viết, sử dụng và phân phối các thư viện JavaScript hiện có theo hướng dễ dàng hơn nhiều.

Tương lai

Các tính năng mới, API mới sẽ được (tự động) đưa vào trình duyệt mới ngày càng nhanh hơn

  • Vì phần lớn các trình duyệt sẽ tự động cập nhật phiên bản mới
  • Với Chrome, cứ 4 tháng là sẽ có một bản mới sẽ được đưa tới 350 triệu người dùng
  • Thị phần của các trình duyệt Webkit đủ lớn, để các trình duyệt khác (như IE, Opera, Firefox) phải chạy theo và đưa tính năng tương đương vào.

powershell script to open web address URL with default browser

After install a website, we used to open the start page in web browser.

There are at least (not 2) 4 ways to open web address URL with default browser in Powershell.

1. Run a exe file with parameter is our url.

How to get exe filepath of default browser? define and use this function (thanks to Ravikanth Chaganti):

Function GET-DefaultBrowserPath {
#Get the default Browser path
New-PSDrive -Name HKCR -PSProvider registry -Root Hkey_Classes_Root | Out-Null
$browserPath = ((Get-ItemProperty ‘HKCR:\http\shell\open\command’).'(default)’).Split(‘”‘)[1]
return $browserPath
}

call

Get-DefaultBrowserPath

in my computer Powershell console will return D:\Program Files (x86)\Mozilla Firefox\firefox.exe

2. Simple way:

call

start ‘http://www.gurucore.com’

in Powershell.

Thanks Dac Thach, I tested your solutions and it works on Windows 2008 + Powershell 1.0

3. One another is we use Invoke-Expression

to lend the Windows’ CMD hand (like you open Windows Run / cmd / then type start)

 

Invoke-Expression “cmd.exe /C start http://gurucore.com
Invoke-Expression “cmd.exe /C start http://some-thing.com.net/~en/my-site/gurucore.com#thach
Invoke-Expression “cmd.exe /C start /b http://gurucore.com?ab=abb’&’thach=2+g~

4. Use .NET static function

[Diagnostics.Process]::Start(‘http://gurucore.com?a=-b&c=~d#abc’,’arguments‘)

Take care of accessibility for web

This article is in my FASTFOOD series:

You Are Not The Default

Millions of people around the world have disabilities that hinges them from information.

If you care about a web truly accessible to people w/disabilities, follow @googleaccess team, on the forefront of alt access modes. They are active!

 

Use this site/tool to check your website

 

Read articles

http://www.1stwebdesigner.com/design/web-accessibility-guide-beginners/

http://www.google.com/accessibility/