The making of TSW WebCoder 2013 part 3 – Design of the dialogs
March 6, 2012
As I mentioned in a previous blog post, I'm rethinking almost every aspect of WebCoder with this new version, and since I have to make all the application dialogs from scratch, I try to give a lot of thought to what might be changed to create an even better dialog. A great example of this is the dialog for managing the templates of WebCoder. Here's what it looks like in WebCoder 2010:
Nothing wrong with it, but as it turned out, there were actually quite a few things that I wanted to changed for 2012:
- The Icon view is not very good for templates with long names
- The toolbar buttons are a bit small
- The entire dialog is a bit small as well, in case of many templates
- When adding or editing a template, a new dialog would pop up
- There is no way to see what a template contains without selecting to edit it
A lot of these things simply made more sense years ago, when the average resolution was way lower, but today, most developers will have a resolution that justifies using a bit more space when needed. I have used this principle for several of the dialogs, but it's especially visible with the templates dialog, as you will see from this screenshot:
Besides the obvious size difference, I added categories to the templates along with a preview part directly in the dialog. You will also notice that there are now the possibility for placeholders in the templates, for instance to control where the cursor will appear when you use the template.
In case you want to add or edit a template, the dialog will look like this - no new window necessary:
As you can see, I've also gathered some more templates, ready-to-use for you. If you have any suggestions for templates, please do let me know!
I hope you like what you see. Let me know what you think of this new approach to the dialogs of WebCoder :)
Disclaimer: WebCoder 2012 is still far from being done. These blog posts are merely to show you what this new version will be like and to give you an impression of the development process. I hope to have the final version of WebCoder 2012 ready in the third quarter of 2012, but nothing is certain yet!
Looking forward to see this in action. From the screenshoots above it looks very promissing :-)
I like it a lot! Always found the “old” way a little confusing with the small icons – But the new look is very promising. Hope you are doing something like this with the FTP servers and database servers.
Now I’m just hoping that when you create a new file, that you will have the possibility to select what template you wanted to use, so I don’t have to select it in another menu afterwards – Because then I tempt to forget to use the templates, and write it from scratch/copy’n’paste.
Hi guys,
Thank you for the nice words :)
Pelle, the Database dialog has already been created in the same style, and my plan is to do it for FTP as well. I’m struggling a bit with the fact that there are way more editable options for an FTP server, but hopefully I can come up with something :)
I find your comment about forgetting to use the templates interesting, but what are you suggesting? That the “New” options leads to the template dialog or something like it, instead of just immediately creating a new file, or a secondary option, like “New from template”?
Great to see that! I really look forward to your new version, as it’s great to edit css files (because of the color preview)!
Please add instant Php Preview, Smarty Support, and make a preview of the #color in the left linenumber column, that would be great!
THANKS
One feature I relly love in an other editor:
Special Characters to Code > Selectet Text
> Entire Document
Code to Special Characters > Selected Text
> Entire Document
This converts & to , © to © and so on.
Would really love if you would implement that, too.
And a Dark User Interface Theme would be great.
I know, wishes over wishes :) Sorry for that :)
Hi Ulf,
Don’t apologize – your input is more than welcome! However, would it be possible for you to make a thread in the WebCoder 2012 forum with your suggestions and comments, perhaps with a bit more details? This way I have all the suggestions in one place and other users can show their support and comment on your posts easier. Thanks! :)
Hi,
That’s probably not the right place to post this but it refers to the Webcoder. I’m not really satisfied with the FTP-function of Webcoder 2010 and want to tell the problems I have, to make it better in Webcoder 2012.
I don’t have a good internet connection with many disconnects. For example (that happens very often): I want to save the file. The file is beeing uploaded but it’s received empty by my server. First that’s really annoying and if TSW is crashing at this moment the file is lost. Furthermore TSW is freezing at any time when a file is beeing transmitted to or from my FTP-server. When the connection was refused, the progress is taking so much time, that my windows asks me everytime whether TSW may have crashed. When I’m connected via UMTS that happens approximately 50% of all tries.
Greetings from Berlin
Sven
Hi Kasper, of course, thanks. I’ll start a thread with my suggestions and feature “requests” :)
Hi Sven,
The FTP part will be re-written for WebCoder 2012 and I will look into your query on stability. I haven’t personally tried using WebCoder on a slow connection, so I haven’t experienced the things you mention, but hopefully I will be able to make it better for the next version :)
Thanks Ulf, looking forward to hearing all your suggestions :)
About the “New file”: Yes something like that. A dialog where you can give the file a name, and maybe a simple dropdown of the templates, maybe sorted out if you are creating a .php file, it gives you the PHP templates.