[UPDATE] First look at my first app, tell me what you think...

Hi guys,

Ok these are screen shots of my first app, when its finished il pop it in the utilitybank along with the code seeing as its going to be freeware anyway. Id like to get your thoughts on the design as it my first shot at making an application pretty as well as functional.

This is going to be my first proper complete app so any thoughts on it would be much appreciated. As to what it does.....

Well basicly its used for storing notes, passwords what have you. I have a brutal memory so im the main influence for this app, i intend to use it daily. Basicly features will be.

• Easy to use
• Catergorised Notes
• Password Protected
• Encrypted Database
• RTB formated Notes
• Import from RTB files
• Merge Notes

So This is the splash/Login Window:
http://img37.picoodle.com/img/img37/...hm_dc02c88.jpg

This one is the browser window, notes can be viewed here but not edited:
http://img29.picoodle.com/img/img29/...em_e13d663.jpg

This one is the design window, here you can edit upload or create new notes, there is no delete yet as im working on a way to implement it. Also where it says welcome to SafeNote, this will be changed to match the text in the Note name
http://img30.picoodle.com/img/img30/...em_d6b2739.jpg

A note on the toolbox, i havent found icons i like but basicly the contents of the toolbox will be similar to wordpad, basicly text formating options.

One thing I would suggest. Create an "About" form. That way they can get information about updating the program, who created it and also the encryption algorithm (for those security buffs).

Good idea, thanks!

Interesting Splash page but the UI really turns me off. Why didn't you go with a standard Windows look? Users are used to seeing a specific type of look and instead of going that route, you seem to have gone somewhere else, unfamiliar.

I also think it's counter intuitive that I can't edit notes when I view them. Seems kind of silly to separate them.

And why separate functions for "Import a RichTextFile" and "Import An Old Note" Wouldn't they basically be the same thing?

Quote:

---

Originally Posted by Hack

And why separate functions for "Import a RichTextFile" and "Import An Old Note" Wouldn't they basically be the same thing?

---

Exactly, you could open up your "Open File Dialog", and have the filter set for both, then, depending on the file extension, import each the proper way.

I'm assuming there is a difference or you wouldn't have made two functions.

Thanks for the responses everyone, il deal with them each seperatly:

The Splash:
Is everyone happy with this or is it to overpowering? The idea was combine a Login page with the splash to reduce redundency. Are there to many grapphics etc?

The UI:
Although i agree the UI is a change i would consider it a drastic change, really all im missing is the bar at the top, i have an exit button. The reason i dont have the other two (maximise and minimise) is i did not want them in the app. Ive seen other note programs that were too fussy using the standard style. What changes would you implement to make it easier to use? What do you find awkward about the UI?

Seperate Edit Window:
Although in reality there are two seperate windows, when using the program ive set them up so it doesnt look like that, when you hit the design mode label it looks like the "design" controls are added to the same window. The concept here was to keep the UI tidy. To edit you simply click the label and the controls appear. The note you are currently viewing stays put so the transition seems flawless to the user. Basicly its like hidding the design controls when they are not needed. Do you still feel this is redundant? Would you have the edit controls in place all the time?

The Import and Old Note Buttons:
They actually perform seperate functions, the Import button imports an RTF or text file from your pc so you can add it to the database. The old note button takes an existing note from the database and allows you to edit it, on that subject i have changed the button text to add existing as i feel this is better. What are your views on this?

Thanks again for your responses i look forward to reading your answers to my questions! I feel this sort of feedback is invaluble as it will help me to refine my style of UI design!

The splash screen is very professional-looking. Good job. Although I would get rid of 'Click here' and make 'Forgot your password?' the link.

I'd like to see a screenie of the browser window with some notes in it before I pass judgement on that.

@pengate: Thanks, i was thinking about that, il change it tonight, also il populated the boxes and repost screen shots later.

Ok im going to take a slightly different UI approch because at the moment it feels a bit cluttered (the design view). Il post the changes and see what you think, il also populate the various boxes to show the app as it would be in use. Any more feedback would be much appreciated, i would much like to hear from Kasracer on specific points that you feel could be tweaked. Thanks guys!

Ok here is the new design veiw with alot of text in it, what do ya think

http://img34.picoodle.com/img/img34/...em_65fceb9.jpg

Ok no replys, i can only assume that my app looked so bad people didnt want to affend...
So i went back to the drawing board and made some custom images, i tried to keep in the context of what kasracer said, keeping in line with default windows programs. Ive tried to come up with something that strikes a balance between functional and familer. Please let me know what you think..

http://img29.picoodle.com/img/img29/...nm_49fd49e.jpg

PS: the border at the side is custom made by myself, as are the HR rules. I think they resemble the vista norm somewhat, if anyone whats them let me know.

PPS: its still a work in progress so thats why it is missing some options..

To be honest I like both, so why not give the option to choose the interface they want?

I like both too, the only gripe i have with the non vista one is that the colors are a bit... well they make my eyes hurt when working on it for long periods, which cant be good! :). Having said that it would be nice to have a choice of skins.

I like the newer one better but I would suggest making it easier to select a node. Currently drop down boxes are a pain. I'd go with a tree view so you can categorize them there.

Ive never used a treeview before, im currently reading up on it now, il implement one into the app to see how it looks overall. Il also add the finshing touches to the window to give you guys a final view. Any more tips or views are much appreciated.

Ok, ive implemented the tree view, having some hiccups with the database though, im new to database programming so...

Anyhow, i have to stop adding features or il never get done, i think il just create a beta version first and worry about features later.

I like the style. It's very nice. Well done :D

Ok, this is my final screenie regarding this app, im going to start a developers blog shortly so i will be posting to that regarding progress of this app, i think its nice to show progression and get feedback, everyone is welcome to post feedback on the blog if they wish, il put the link in my sig later.

Anyhoo... this is the finalised design for my app. Ive kept in as much of the feedback i can. It looks like a windows app now, there is no design/browser mode its all the one. The toolbox has also been replaced with a toolstrip. I am still looking for nice icons for it. The missgin icons are for formating, like you would see in wordpad. also im looking for icons for the tree view so that looks a little bland at the moment.

http://img28.picoodle.com/img/img28/...dm_3631aff.jpg

codedfire,

i am very interested in your side panel, am i able to get a copy of this please?

No problem, I will send over a copy to you. It is just a jpeg with controls on top.

Hey DeanMc, I do like the latest design, but I think it would be really cool if you custom draw the the treeview so it doesn't have the ugly white rectangle. Instead you would just see the scroll bar and 'floating text'.

I had attempted that back when I was first doing the application. The issue I found was the transparency was not great in GDI+ and the text didn't look right floating.

Ive since moved to WPF which has better support for both features. Il post a new screen shot when I get the layout finished.