Monday, August 13, 2007

Photoshop - "Disco" effect

       Starting from image from the figure 1 we will create the "disco" effect which was very popular on the posters and the video clips of the 80's.

       For start we will delete the background behind the character. In order to do this we will use the Magnetic Lasso Tool and we will select the contour of the character. Don't worry if the selection is not perfect ! It can be corrected afterwards using the instrument Polygonal Lasso Tool and one of the selection method "Add to selection" or "Substract from selection", depending on what you need. An example of imperfection can be noticed on figure 2. It will be corrected using "Add to selection" because the initial mask did not covered the entire contour of the device from the kid's hand.




After completing the selection run the command Clear from the Edit menu to delete the silhouette.Press the X key to invert the background color and the main color (supposed that this have the black and white values as default). After that, run the command Inverse from the Select Menu to invert the selection, followed by the Clear command from the Edit menu again to delete the background. At this moment we can cancel the selection (De-select command from the Select menu). The result is shown on the figure 3.
Duplicate the Background layer (right click on Background in the Layers Panel, then choose Duplicate Layer from the menu). This new layer will be named "Effect", which will be duplicated again using the same procedure, and the new layer will be named "Silhouette". This will contain the silhouette of the dancer and will always be on top of all the other layers.



       We must add to this layer a mask in order for just the silhouette to be visible. Select layer "Silhouette" from the Layers panel. Click once inside the white silhouette of the dancer with the Magic Wand Tool instrument. From the Layer menu choose the Add Layer Mask command -> Reveal Selection. The background can then be erased, using the following steps. Select the Background Layer from the Layers panel, then choose the command All from the Select menu, then the Clear command from the Edit menu and Deselect command from the Select menu. You will then have to see what is shown in the figure 4.



       The Background and Silhouette layers will remain unmodified. Between them we will add effects layers. Select the Effect layer and apply one by one the next filters: Filter ->Stylize->Find Edges, then Filter->Stylize->Glowing Edges with the parameters Edge width =9, Edge Brightness=13, Smoothness=6. You will get what you see in figure 5.



       This contour can he colored using the Paint Bucket instrument.
In this case use the yellow color. From the Filter menu choose the Blur command->Radial Blur with the parameters Amount =47, Blur Method =Zoom, Quality = Draft, getting what you see in figure 6.



       For the final step, the Effect layer will be duplicated several times and moved/scaled using the command Edit -> Transform -> Scale. You can also change the color of each copy (using the command Image -> Adjustments -> Color balance) to create a rainbow effect. After copying for 5 times the original, the result should look like in figure 7.





Open full post here

Learn about HTTP-only Cookies

       If you are a webmaster and you run any sort of website that uses cookies for your users to register you will want to read this. Read this and stay tuned for my next posts if you want to learn how to make your website as safe as possible.
       XSS vulnerabilities are often used by the hackers to steal the cookies of the legitimate users. A classic method is by accessing the variable "document.cookies" using some javascripts.
       Starting with Internet Explorer 6 sp1, Microsoft has implemented a method that prevents this kind of attack. This method uses the parameter "HttpOnly" to set a cookie in the headers just like this :

"Set-Cookie: NumeCookie:value; expires=Wednesday, 10-Oct-07 23:12:40 GMT; HttpOnly"

       The key work "HttpOnly" instructs the browser of the user to restrict the access of the cookie (document.cookie) with the client-side scripts.
I will show you a method with a script javascript that can access that hidden cookie by transmitting raw requests to the web page and reading the headers.
The following code is a PHP script that shows the difference between the 2 types of cookies and how can the HttpOnly cookies be read.

       =====================
<?php
// we set a normal cookie that can be found in "document.cookie"
header("Set-Cookie: CookieNormal=valueA; expires=Wednesday, 10-Oct-08 23:12:40 GMT");

// we set a hidden cookie
header("Set-Cookie: CookieHidden=valueB; expires=Wednesday, 10-Oct-08 23:12:40 GMT; HttpOnly");
?>

<script language="Javascript" type="text/javascript">


// function that extracts the hidden cookie from headers
function unHideCookie()
{
var xhr=new XMLHttpRequest(); // creating the object
xhr.open("HEAD",document.location,true); // we set a HEAD request to the same page
xhr.send(null); //transmiting the request
xhr.onreadystatechange=function()
{
if(xhr.readyState==4)
{
if(xhr.status==200) // if we get the correct answer
{
var hidden="";
var headers=xhr.getAllResponseHeaders().split(" "); // we read all the headers and save them on each element of the i variable
for(i=0;i0) // when we find a hidden cookie
{
var cookie=headers[i].substring(headers[i].indexOf(" ")+1,headers[i].indexOf(";")+1); // extracting "name=value;"
hidden=hidden+cookie+" "; // adding the extracted cookie
}
}
//using the saved cookies in the hidden variable
alert("Hidden Cookie: "+hidden);
}
}
}
}

alert("document.cookie: "+document.cookie); // displaying visible cookies
unHideCookie(); // displaying Hidden cookies

</script>

       =====================

       The Http-only method used to hide the cookies from the client-side scripts is used for the moment just by Internet Explorer and Mozilla but it will be implemented on other browsers as well in the near future.



Open full post here

Configuring the system without the annoying warning messages for Windows Vista and changing the size of the symbols on the desktop

       Configuring the system without the annoying warning messages

       After the installation, you want to make some modifications to the system. You are being annoyed by the fact that you get warning messages constantly and every action you make must be confirmed twice. You can temporarily close User Account Control in order to configure the system without the annoying warning messages. Reactivate the control in the same way you will deactivate it, following these steps. There are 2 options to close it: first is to double click on "User Accounts" and then on "Switch on or switch off user account control" in the Control Panel. Confirm the process by clicking on "Next". Then deactivate "Use user account control to contribute to the protection of the computer" and confirm that with "OK". All you need to do afterwards is to reboot your computer, procedure that can be initiated directly from the dialog window. You can also activate and deactivate that function within "msconfig". In order to do that, type "msconfig" in the search field from the start menu and press "Enter". Click on "Tools" tab. Select "Disable user account control" and click "Start". Restart your computer.

Quick Note: User Account Control increases the security of the system and prevents unauthorized installation of different software and any changes in the system. If you shut down this function, not even safe mode from Internet Explorer will not work.

       Changing the size of the fonts on the desktop

       Vista displays very large symbols on the desktop. Users that are used to have a crowded desktop full of icons of programs that they are working with rather enjoys small icons. The size of the icons can be easily changed. In order to do that, click on desktop. Hold down CTRL button and move the wheel of the mouse in any direction. Vista will change the displayed symbols dynamically.

Note: The process works even within Windows Explorer.



       5 applications that will make your Windows XP look like Vista

       For all those who cannot afford to install Vista on their computers or just want to wait or just can't drop on the old friend Windows XP, i have thought to offer you a few applications to "dress up" your XP to look like Vista:



1. Copernic Desktop Search
The search options of Windows Vista are fast and far more complex same as those offered by this application. The categories of files search: e-mails, files, music, images, contacts, Internet Favorites and History will allow you to find anything as fast as possible. Creating and saving of the searches is now very easy to make, and the function "while you type" is also extremely useful. Copernic Desktop Search examines Microsoft Word, Excel, PowerPoint, PDF files and also other kind of files like e-mail messages, video clip files and also image files. It can search specific types of documents or even words included in this documents. The application uses an index of the files from the computer in order to return almost instantaneously results, updating automatically when the system is not busy with other tasks. The last version of this application is installed automatically into the taskbar as a separate toolbar. For any inadequate options you have installed, right click on an empty portion from the taskbar, select Toolbars and choose Copernic Desktop Search.


2. Desktop Sidebar Vista
This application offers a sidebar that provides a calendar, a calculator, a quick link to the media player and also RSS feeds. Desktop Sidebar is built from different components and each of them can be separately configured. It offers similar options that can be improved with a files browser, a weather forecast, a news program and with an e-mail checker. It also integrates controls for Windows Media Player, the QuickLaunch taskbar and many others. You can also configure its layout and its design. It can also be displayed all the time or to be hidden when it is not utilised.







3. Vista Start Menu SE
This application represents an alternative for the standard Windows Start Menu offering a different layout, made to help us access more effectively our applications without having to access more menus. You can open a program or access a document without lifting your fingers from the keyboard. The zooming options helps a lot those who own large screens or just use high resolutions. It also supports navigating in the tabs.



4. Visual Task Tips
Folders, applications, web pages, all this windows from taskbar will now be displayed in thumbnail style when the mouse is positioned above them. This is an easy option and also a lot useful especially for those who use the mouse pretty often.



5. Folder Maker
This program is a batch tool that will allow you to create a large number of folders and files very easily. It has an option to count all this as well as prefix and suffix options that will allow you to personalize the names in order to categorize them more effectively.


Open full post here

Wednesday, July 18, 2007

Adoble Flex - introduction notes

      In my first post I've spoken about some of the differences between Html and Flash. I am going to spend some time presenting to those of you who have not heard about the Flex product, some of the capabilities of the Flex 2.
      The Flex products line provides with the next generation of Developers Tool to build and deploy RIAs (Rich Internet Applications)on the Flash platform. Flex is an umbrella term for all the technologies of the Flex Product line that help developers to be extremely productive in RI Applications development. Flex allows you to create expressive content with effective interfaces, and deploy applications threw a well distributed, high performance cross-platform, cross-browsers run time environment.
      The Flex product line contains:
      *Adobe Flex Builder 2
      *Adobe Flex SDK
      *Adobe Flex Data Services 2
      *Adobe Flex Charting 2
      Adobe Flex Builder 2 is a completely new integrated development environment also known as an IDE for the Flex Framework 2, which provides coding, debugging and design tools and takes advantage of the industry leading Eclipse Tool Framework. Flex Builder 2 can install as a Standalone product, or add functionality to an existing Eclipse 3.1 installation.


It can also be used alone to develop and deploy Flex applications or can be used in conjunction with Flex Data Services. Flex Builder has a built-in compiler to create swf files from MXML and Action Script code.
      The Adobe Flex SDK provides a skeleton of the application that developers can use to extend the Flex framework which consists of prebuilt components, and these prebuilt components can be extended, or developers can build their own components from scratch.

      A highly comprehensive component framework is included within the SDK to help facilitate this. There is also a rich class library based on Action Script 3 that embodies best practices for building RIAs. The Flex SDK also contains and XML based language called MXML that provides a great way to build and layout applications as well as an the scripting language called Action Scipt 3. A compiler is also included in the Flex SDK creating swf files from your MXML and Action Script 3.

      In order to start a Flex application, the web browser will request a swf file, which is then downloaded to the client. The developers able to compile a swf file by laying out their application in the MXML language and using Action Script 3 for any logic. Action Script 3 is a class-based language that is as close to Java as you can get without actually being Java. Once the compiled swf is downloaded to the client, the swf itself can then request additional resources from the server using either Http, Soap or an Adoble protocol known as The Action Messaging Format(AMF).
      The Adobe Flex Data Services 2 add enterprise messaging support and greatly enhanced data services architecture the Flex SDK. Data services also gives you the ability to share data among multiple clients and offer support for client to client data communication. You can also push data out of the Flex Client using Data Services which gives you the ability to create sophisticated applications that displays real-time data such as sports or stock data. Flex messaging allows whole new categories of applications like data push and collaborations based applications to be delivered to the browsers in a reliable and scalable way.
      The foundation of the Rich Internet Application is the Flash Player or the Flash Virtual Machine. Flash Player 9 has been for Flex and is the backbone of the Flash platform. Of course Flash player 9 is fully backwards compatible with all of the other versions of Flash player as well. Flash Player 9 supports Action Script 3 which is a completed object pointed scripting programming language. It is a new optimized Action Script Virtual machine(AVM2) uset to execute the new Action Script new code which is significantly faster than the earlier versions. It has full run time error reporting, unlike earlier versions that were failing. There is industry standard debugging that contain stronger compile-time checking and mini new elements have been added including E4X which treats XML as a native data type, regular expressions and a brand new event model based on W3CDom events standard.
      My conclusion is that if you consider moving on and leaving HTML behind, it worth's a lot looking at this program, especially if you want to develop a rich Internet application like an e-commerce website or a website that highly interacts with the users. It has great features included and i will detail some of them on my next posts. If you also like to you can visit the Adobe website for more details.


Open full post here