Concept UI

Concept UI of Windows Vista application designed using Microsoft Blend & Photoshop.

Concept UI : JumpTab for Windows Vista

Windows Explorer has drag & drop for files & folder. You can drag & drop some files or some folders in another folder by just dragging onto the folder you want to move the files to & drop it. But what if you want to drag it in a folder, inside a folder? Sure you can use the sidebar tree view but what else….?

I present JumpTab, the next version of Drag & drop in folders, for Windows Vista.

This is the usual method of dragging & dropping files in windows. As you can see, I selected some files & dragged them over to another folder. If I leave the mouse it will drop the files in that folder, but I have two other folders inside the primary folder. I cannot navigate directly to them, unless I am using JumpTab.

Holder turned on

Just keeping your mouse over the folder for a second or half a second opens a glass panel in which you see all the folders which are inside the primary folders. You don’t see the files inside the primary folder nor does it opens the original folder. It just shows a new holder displaying the folders inside. This jump tab is called Holder. Now, you can drag files to any of the folder inside either images or video or you can just mouseover the folder “Image” & it will further expand that folder in the holder. To go back or forward just click on the arrows. You don’t need to leave the Holder neither it will dismantle your “drag pile”

Holder also holds the items you are trying to drag. Like in this case I selected some images & videos & I want to put videos into video folder & images into images folder. What do I do? I simply leave all the files below the word “Holder” & from there I can select which file to drag to any particular folder. Just click outside to remove the Holder from screen.

Holder turned on

Right now I m trying to make a Mock Video in flash to better represent it, but then again, how is the concept…?

Concept User Interface for Windows Mobile Center

Windows Vista comes with Windows Mobile Device Center which support only for Windows Mobile Devices. I thought that this should be changed, so I made this concept User Interface for my own application which I think should be bundled with Vista.

Presenting Windows Mobile Center, the solution to all your mobile phone & PDA needs. Everything you are about to see is made on a system running Windows Vista Ultimate with Photoshop CS3 & Axialis IconWorkshop 6. I have not made a single icon in this mock UI because everything is already included in Windows Vista. It is very easy for developers to make the back end of this application.

When you first start Windows Mobile Center this is how it looks like. A simple welcome screen telling you what Windows Mobile center is for & what can it do for you. Just click on "Select Device" to select the device you want to manage.

Main Window

You now come to the second screen where you are asked to select the kind of device you have, whether it is a Mobile Phone or Pocket PC or PDA or UPMS. Just click on the type of device you have & click on "Next" or click on automatically Detect to search for all compatible devices.

Select Device

After selecting "Mobile Phone", I am given a list of all the mobile phone Windows Mobile center can sync. This database is plug-in based & new phones can be added via simple Windows Update. Here for the article I selected K750i because like I said, that is what I have in my hands right now so easier to make this UI for me. You are given information for your phone & a photo which makes it easy to visually identify the phone from the list. You are also given two checkboxes stating whether you want Windows Mobile Center to automatically try to connect using the best & fastest available connection or whether you want to select a connection type manually such as Bluetooth or WiFi or IrDA or a Data Cable. For this article I have selected to connect automatically. Now click on connect.

K750i Selected

Windows Mobile Center now automatically tries to find the best & fastest possible connection available. It searches & finds Bluetooth connection.

Searching for a connection

Bluetooth connection found

Once the connection is established it displays the status of the phone such as Phone’s name, battery left, connection type, free memory in memory card or phone itself, IMEI Number, firmware etc. It also tells you whether the phone is synced with Windows Mobile Center or not. Since this is the first time, it is not synced & it gives you an option whether to sync right now or not. Without syncing you cannot see the saved Phonebook, SMS, and Mail etc. You can sync the whole phone anytime using the green Sync button at the topmost toolbar alongside Configuration Options & Help button. Or in this case for the first time you can also sync using the options given below the notification.

You can also get advanced information using this window. Like clicking on Bluetooth Icon gives info in a new palette like which COM Port it is connected through, which Bluetooth device it is using etc. Same goes with battery

Phone Status

Once the phone is synced, you can start working on it the way you like. Some basic phone tasks are available in the right click context menu or the following toolbar button. You can mouse over the toolbar buttons to get information regarding what that button does. Let us go through all sections one by one.

Contacts Section. : After you sync the phone with the computer, Windows Mobile Center automatically copies all the contact to Windows Contacts folder through which these are also available in Windows Mail, Windows Calendar & other such Windows application like Live Messenger etc. Those contacts which are not in Phone but are there in Windows contacts are also synced to the phone.

The contacts are available in a list view depending in whether you have selected to show Phone contacts or SIM contacts. You can search for a particular contact using the search bar provided at the toolbar. You can simply right click on the column to show more info as required such as other phone number, fax, address etc. To copy a contact from Phone to SIM, either drag & drop it or simply copy paste using the keyboard or right click menu.

The toolbar provides access to some basic tasks available for contact list, like refreshing the contact list or adding a new contact to the contact list, editing an existing contact, deleting a contact or simply sending a message to your contact using the computer. You can also select whether the message is a SMS or E-Mail.

Contact List

Suppose you want to send SMS to someone. Just click on the contact & click on the new Message toolbar button. You will be given a simple window to write your SMS which will be then messaged using your Mobile Phone. You either enter a number manually or select from contact list. If you enter an E-mail ID, the message will go as an E-Mail through your phone & GPRS/EDGE connection using the settings for E-Mail set in your phone. This is how the Message Window looks like.

SMS Window

The call logs section shows the recent call logs. It shows all calls, missed calls, answered calls or dialed calls as selected in the left hand pane. You can again perform basic tasks such as refresh the list or add an unknown number to your phone or delete the entire recent logs or send a message to a recent number. You can also search for a particular caller in the call logs.

Call Logs

The Messages section provides you a view at the SMS you have in your phone. It shows your phone Inbox, the saved messages, drafts, sent messages & Outbox. From here you can simply click on any message & either forward it to another number, or reply to that sender or delete the SMS or refresh the SMS list. You can also select to write a complete new SMS using the new message button in the toolbar.

Messages

The Files section gives you option to browse the phone’s memory or the memory card in the phone. Although the memory card is also available in Windows Explorer as a removable drive. The explorer is just like Windows Explorer & you can navigate or sort. You select the type you want to view the folders as, or simply right click in the Explorer area & select to view as large or small icons for folders. If you have selected to show thumbnail previews of files, then it will show the images as thumbnail by simply downloading them to computer in the background.

Using the toolbar, you can simply refresh the file list or go one up level, create a new folder, delete a file or download the file to a location in the computer or upload a file to the location in Phone. You can also install JAVA application using this Files view because K750i supports installation of JAVA Applications. You can also search for a particular file in the Phone or Card memory.Single clicking over a file or folder gives its information in the File Properties pane such as file size, location, type etc.

File Browser

The Organizer Notes Part is complete. If your mobile phone or device supports notes, then you can sync them automatically with your Windows Notes Gadget or Outlook Notes. To access notes, click on the notes icon in the toolbar which will show you all the notes in your phone. Pressing the refresh button will sync the notes from your computer to the phone & vice versa. Here are the 3 views in which you can see your notes. I prefer the detail view though but since it is up to the user he can chose to look anyway he wants by clicking on the view type icon in Notes toolbar.

Thumbnail View

Thumbnail View

Details View

Details View

Text ViewText View

Noate

 

Noate is concept devices, made specifically to perform only one task, replace the long used copy & paper everywhere.

On first look, Noate will look much like a Tablet PC but it’s not. A Tablet PC can do various tasks, it can even play music & video however a Noate, can only take text input via a Stylus. It is is not supposed to play music or video, it’s not supposed to connect to the Internet, for that there are other devices & Noate is made not to compete with them, but to accompany them.

Noate is just half inch thick, & 10 X 8 inch long tablet, much like a paper or conventional notebook we have in school, or offices. It consists of a non reflective, scratch resistant, OLED screen, which acts as the display & the input area, on which the user writes with a light Pen, similar to the method of text input in Tablet PC or PDA for input, Noate, supports 16.7 millions colors so you can also read PDF with images. The key feature is simplicity, just a notebook, that’s all.  

Noate has 1 GB of inbuilt flash memory on which everything is stored, additional memory can be added via USB pen drives, & Memory cards, it supports normal MMC cards. Connectivity is possible by a USB port, as well as Bluetooth 2.0  

Noate is not supposed to be standalone; it assumes that you have a PC or Mac at your home, where you can copy all the data & process further. Suppose you are in a college & you took notes for whole day, when you reach home, simply copy the notes to your computer & do whatever you want to it.  

By default, Noate disables handwriting recognition, because it makes the writing process slow, you simply write on it & it will save it as such as, without any processing, the handwriting recognition is performed later by the application bundled with Noate which is available for all major operating systems. By default, Noate saves the files in PDF Format, because that’s how you can save your scribbling easily, it can be converted to ODF format & if the MS office is installed it can even convert to MS Onenote format, with the help of the Noate application. You can also convert your MS office documents or images as PDF with the bundled Noate application installed in your PC. 

The battery in Noate lasts for 20 hrs. It’s a simple battery used in mobile phones etc, & you can even replace with 3 AAA batteries, if required. Since the power usage of Noate is very low, the battery is quite small in size & dimension, adding to the overall weight of Noate which is only 150 grams, much of which is possible due to the OLED screen, instead or LCD panel. You can turn off Noate or put in sleep, by pressing the buttons on the side.  

Noate has no operating system, instead it has a firmware, which is very simple, to make & manage. The CPU of Noate which also acts as the GPU, is custom made, which is sufficient to draw everything on the screen even when scrolling through the pages quickly.  

The interface of Noate is also very simple, just a few icons on top, for New, Open etc, & two arrows at the bottom for forward & backward page. When you write on Noate & one page is filled you simply click on the forward arrow which switches to the next page & you can continue to write. No matter what you write, one page or multiple pages, it’s saved as PDF, you can either write your own name for the file, in which case the input text is on the fly converted to ASCII text, because scribbling cannot be used as file name, or you can set to automatically, name the file, according to the Time & date stamp. Remember, Noate assumes that you will further process the file on your computer  

Since Noate is a simple device, it’s cheap to produce, which results in very low cost.

GSX Concept PC

I always wanted to make my own designer PC which can be used anywhere & can be complimented for being thin, small & efficient. Presenting GSX Concept PC.

The GSX has an optical drive in front panel, one shut down & one restart button, & the big black bar below the shutdown & restart button is the infrared port for Windows Media center remote that this PC will be running. It will have customized laptop component, such as…..

Core 2 Duo CPU, Radeon HD 3650 graphics card with 512 MB DDR3 RAM with HDMI, 4 GB DDR2 800 MHz RAM, 320 GB SATA 2 2.5″ Hard disk, onboard gigabit LAN, 5.1 Channel HD Audio, inbuilt Bluetooth & 802.11 a/b/g/n, USB 2.0 Ports, Fire wire ports & 1 fire wire mini port & the other usual stuff we expect in a all in one Computer.

Due to using laptop components, the GSX can reduce its CPU & Graphics card clock speed on the fly, & also disable the non-used sections of peripherals which will further reduce the power consumption.  The monitor is HDMI based 19″ LCD, the GSX is made to be a lifestyle PC, it can’t be a serious gaming PC, but still it has something like a Radeon HD 3650 DirectX10 graphics card which is good enough for gaming & supports full decoding of HD Videos. The monitor cord goes from inside the pivot. There is also a front OLED screen on the CPU below the Optical drive; this is used to see system info such as temperature, music being played in Windows Media Player. It’s based on Windows Sideshow so even if the Computer is in sleep mode, consuming really low power, you can still get some info such as schedule etc.

The PC is completely detachable; you can simply unscrew the thumbscrews, which will detach the LCD from the Pivot, & also the pivot from the CPU body, then you can take them all easily anywhere. Since the CPU uses laptop components, you can simply remove the top panel, as they are screwed by 6 bolts & upgrade a few things such as hard disk, RAM & graphics card.

The GSX takes air from the right side, there is a 80mm fan intake fan, circulates & the other fan on the left side which acts as exhaust pushes it outside the chassis. There are 2 USB, 1 Fire wire, 1 fire wire mini & Audio Jacks on the right side of the chassis, with 6 More USB ports at the rear along with one Gigabit Ethernet port & another fire wire port. There are no legacy ports such as Parallel, Serial & PS/2 ports. The power supply is inside the GSX itself, it’s a 400W power supply. However, GSX also provides you option to use another external power supply in case you need more, that comes in the form of an external power brick.

GSX Provides you option to upgrade components yourself, customize it, there is nothing in front of it, and it’s all clean. It is recommended to use a Bluetooth or Wireless keyboard & mouse with GSX to reduce the wire clutter even further. The recommended OS for GSX PC is Windows Vista, as it provides features which I had in mind when designing GSX PC.

Below are a few more renders in White & green color, resembling the color scheme of XBOX 360. All the models & renders are made in 3Ds Max 9 & Photoshop CS2.