Phần 1. Ý tưởng thiết kế giao diện
như đã nói trên, trình duyệt hay HĐH thì đều có giao diện mang một cấu
trúc, một hệ thống riêng (vd IE với firefox thì tab nằm dưới, sử dụng
mẫu các button, check box từ windows... còn Safari với Opera thì có các
button và checkbox riêng...) nhưng tất cả đều có vài điểm chung
Thứ nhất:
thay đổi giao diện ko khó như bạn nghĩ và cũng ko vi phạm bản quyền hay
dính j` tới pháp luật cả. (ở đây ko xét Safari bởi vì thay đổi giao
diện Safari 3.0 rất khó, dính nhiều tới code và theo mong muốn của
apple là ko muốn bị thay đổi). Ko cần một kĩ năng lập trình, bạn hoàn
toàn có thể thay đổi giao diện của bất kì phần mềm nào nói chung, kể cả
HĐH, và ở đây là trình duyệt nói riêng
Thứ hai. Giao
diện của một chương trình được lưu trữ riêng với file exe. Với Chrome
thì đó là một file dll. Với Firefox thì lại file nén... Vì thế, chúng
ta chỉ cần thay đổi file riêng lẻ đó, ko đá động gì tới file exe chính.
Thông thường, cách thay đổi giao diện thường là dựa trên những mẫu giao
diện, từ đó thiết kế lên. Cái cách làm là trích xuất những hình ảnh,
thông số của kiểu theme mặc định của phần mềm, sau đó dùng Photoshop
hay cái j` đó chỉnh sửa những hình ảnh, rồi đưa vào file dll gốc lại.
Cái ý tưởng là vậy. Trích hình từ file gốc ~> chỉnh sửa ~> đưa lại vào file gốc.
Vậy, cả phần 1 này, bạn chỉ cần nắm một cái: thiết kế theme cho phần mềm là xây dựng một theme mới từ những hình ảnh có sẵn
====================================
Phần 2. Cách thiết kế giao diện trên một phần mềm cụ thể
Sau khi nắm được cái ý tưởng thiết kế theme, bi giờ cái mục đích của
chúng ta là tìm kiếm những file gốc để trích hình như đã nói trên.
Những file này thay đổi tùy theo từng phần mềm. Đó là lí do có phần 2
này. Phần 2 này sẽ giúp bạn thay đổi theme với một phần mềm cụ thể. Cụ
thể ở đây được đề cập là Firefox, IE và Chrome. Bên cạnh đó, cuối bài
viết mình cũng sẽ nói sơ về việc thiết kế các phần mềm khác như WinRAR
hay iTunes
1. Thiết kế giao diện Firefox
Nếu như dùng Firefox lâu và hay đổi skin, bạn đã biết là firefox sử
dụng các file chứa skin là .jar. Công việc đổi skin là mở cửa sổ add-on
lên và kéo file .jar chứa skin vào.
Vậy để chỉnh sửa giao diện firefox, chúng ta sẽ chỉnh sửa file .jar này.
Trong file .jar này là cái j`, thật chất, đây là một dạng file nén ZIP
nhưng được đổi định dạng thành .jar. Trong file nén này chứa các hình
ảnh của skin và các file text chứa các thông số...
Bây giờ,
nói mãi cũng chán, chúng ta sẽ thực hành. Như hồi nãy đã nói trên,
chúng ta thiết kế skin từ một cái mẫu. Vì vậy, bạn download file .jar
sau về để thực hành trên nó. Đây là cái skin của Firefox 3.7 for 3.5
(mình làm ). Nếu bạn ko thích có thể lên mạng (DeviantArt) để tìm một cái skin .jar phù hợp
(tổng dung lượng 1MB file skin của firefox rất nhẹ dù chứa cả trăm hình)
Sau khi down về, có file Dvkndn.jar, giải nén bằng WinRAR vào một thư mục nào đó
Đây là hình ảnh bên trong thư mục vừa giải nén xong
Đầu tiên, chúng ta sẽ lưu dấu ấn cá nhân tại 2 file Contents và install.rdf
Bạn mở file install.rdf bằng notepad, chú ý và thay đổi các thông tin sau
tương tự cũng làm thế với file Contents.rdf
Dù bạn thay đổi thế nào, cần phải có tên tác giả gốc trong cái skin đó vì bạn thiết kế từ skin của họ lên.
Sau khi đã có vài dấu ấn cá nhân, công việc tiếp theo của bạn chỉ là thay đổi hình ảnh trong đó mà thôi.
Thay đổi như thế nào? Mở lên bằng Photoshop và chỉnh sửa, xong lưu đè lại
Vd bạn muốn sửa nút back, vào Browser và chỉnh sửa file back-forward.png
Còn muốn chỉnh sửa chỗ khác, xin thưa, chỉ có một cách là mò riết mới
quen. Ví dụ bạn muốn đổi biểu tượng stop thì đi tìm hình nào có biểu
tượng đó mà sửa. Nếu bạn không biết hình đó thể hiện biểu tượng nào thì
cứ sửa, xong lưu lại và áp dụng sẽ thấy
Ở bài viết này, mình
chỉ đề cập đến mức độ sửa hình ảnh và file text, như thế đã đủ một skin
Pờ rồ rồi, nếu muốn cao hơn nữa thì bạn chỉ việc mở các file css và sửa
tiếp
Sau khi sửa xong, bạn trở lại thư mục ban đầu, chọn tất
cả các file và thư mục (chứ ko chọn thư mục chứa tất cả file đó) và nén
lại thành file ZIP
Sau đó đổi tên file .zip thành file .jar (để hiển thị phần mở rộng, vào
folder Option và bỏ dấu tick chỗ Hide Extension for Know file Types
Vậy là bạn đã có một skin cho Firefox rồi đó, công việc tiếp theo là kéo vào cửa sổ Addon và chia sẽ cho bạn bè
như đã nói trên, trình duyệt hay HĐH thì đều có giao diện mang một cấu
trúc, một hệ thống riêng (vd IE với firefox thì tab nằm dưới, sử dụng
mẫu các button, check box từ windows... còn Safari với Opera thì có các
button và checkbox riêng...) nhưng tất cả đều có vài điểm chung
Thứ nhất:
thay đổi giao diện ko khó như bạn nghĩ và cũng ko vi phạm bản quyền hay
dính j` tới pháp luật cả. (ở đây ko xét Safari bởi vì thay đổi giao
diện Safari 3.0 rất khó, dính nhiều tới code và theo mong muốn của
apple là ko muốn bị thay đổi). Ko cần một kĩ năng lập trình, bạn hoàn
toàn có thể thay đổi giao diện của bất kì phần mềm nào nói chung, kể cả
HĐH, và ở đây là trình duyệt nói riêng
Thứ hai. Giao
diện của một chương trình được lưu trữ riêng với file exe. Với Chrome
thì đó là một file dll. Với Firefox thì lại file nén... Vì thế, chúng
ta chỉ cần thay đổi file riêng lẻ đó, ko đá động gì tới file exe chính.
Thông thường, cách thay đổi giao diện thường là dựa trên những mẫu giao
diện, từ đó thiết kế lên. Cái cách làm là trích xuất những hình ảnh,
thông số của kiểu theme mặc định của phần mềm, sau đó dùng Photoshop
hay cái j` đó chỉnh sửa những hình ảnh, rồi đưa vào file dll gốc lại.
Cái ý tưởng là vậy. Trích hình từ file gốc ~> chỉnh sửa ~> đưa lại vào file gốc.
Vậy, cả phần 1 này, bạn chỉ cần nắm một cái: thiết kế theme cho phần mềm là xây dựng một theme mới từ những hình ảnh có sẵn
====================================
Phần 2. Cách thiết kế giao diện trên một phần mềm cụ thể
Sau khi nắm được cái ý tưởng thiết kế theme, bi giờ cái mục đích của
chúng ta là tìm kiếm những file gốc để trích hình như đã nói trên.
Những file này thay đổi tùy theo từng phần mềm. Đó là lí do có phần 2
này. Phần 2 này sẽ giúp bạn thay đổi theme với một phần mềm cụ thể. Cụ
thể ở đây được đề cập là Firefox, IE và Chrome. Bên cạnh đó, cuối bài
viết mình cũng sẽ nói sơ về việc thiết kế các phần mềm khác như WinRAR
hay iTunes
1. Thiết kế giao diện Firefox
Nếu như dùng Firefox lâu và hay đổi skin, bạn đã biết là firefox sử
dụng các file chứa skin là .jar. Công việc đổi skin là mở cửa sổ add-on
lên và kéo file .jar chứa skin vào.
Vậy để chỉnh sửa giao diện firefox, chúng ta sẽ chỉnh sửa file .jar này.
Trong file .jar này là cái j`, thật chất, đây là một dạng file nén ZIP
nhưng được đổi định dạng thành .jar. Trong file nén này chứa các hình
ảnh của skin và các file text chứa các thông số...
Bây giờ,
nói mãi cũng chán, chúng ta sẽ thực hành. Như hồi nãy đã nói trên,
chúng ta thiết kế skin từ một cái mẫu. Vì vậy, bạn download file .jar
sau về để thực hành trên nó. Đây là cái skin của Firefox 3.7 for 3.5
(mình làm ). Nếu bạn ko thích có thể lên mạng (DeviantArt) để tìm một cái skin .jar phù hợp
|
http://www.mediafire.com/?juzz1zybzz4 |
Sau khi down về, có file Dvkndn.jar, giải nén bằng WinRAR vào một thư mục nào đó
Đây là hình ảnh bên trong thư mục vừa giải nén xong
Đầu tiên, chúng ta sẽ lưu dấu ấn cá nhân tại 2 file Contents và install.rdf
Bạn mở file install.rdf bằng notepad, chú ý và thay đổi các thông tin sau
tương tự cũng làm thế với file Contents.rdf
Dù bạn thay đổi thế nào, cần phải có tên tác giả gốc trong cái skin đó vì bạn thiết kế từ skin của họ lên.
Sau khi đã có vài dấu ấn cá nhân, công việc tiếp theo của bạn chỉ là thay đổi hình ảnh trong đó mà thôi.
Thay đổi như thế nào? Mở lên bằng Photoshop và chỉnh sửa, xong lưu đè lại
Vd bạn muốn sửa nút back, vào Browser và chỉnh sửa file back-forward.png
Còn muốn chỉnh sửa chỗ khác, xin thưa, chỉ có một cách là mò riết mới
quen. Ví dụ bạn muốn đổi biểu tượng stop thì đi tìm hình nào có biểu
tượng đó mà sửa. Nếu bạn không biết hình đó thể hiện biểu tượng nào thì
cứ sửa, xong lưu lại và áp dụng sẽ thấy
Ở bài viết này, mình
chỉ đề cập đến mức độ sửa hình ảnh và file text, như thế đã đủ một skin
Pờ rồ rồi, nếu muốn cao hơn nữa thì bạn chỉ việc mở các file css và sửa
tiếp
Sau khi sửa xong, bạn trở lại thư mục ban đầu, chọn tất
cả các file và thư mục (chứ ko chọn thư mục chứa tất cả file đó) và nén
lại thành file ZIP
Sau đó đổi tên file .zip thành file .jar (để hiển thị phần mở rộng, vào
folder Option và bỏ dấu tick chỗ Hide Extension for Know file Types
Vậy là bạn đã có một skin cho Firefox rồi đó, công việc tiếp theo là kéo vào cửa sổ Addon và chia sẽ cho bạn bè