2 custom applications.
polycounter lvl 18
Hey guys, a friend of mine ,Rikard,made this program that I asked him to do, it makes screenshots of your selection and you add comments to it, very easy and quick.
Good for making tutorials: www.gameartist.nl/tutorials/01
Good for gathering reference: www.gameartist.nl/tutorials/old
This program is not finished at all, so any comments/requests are welcome.
Download both quickPather and quickSnatcher at: www.gameartist.nl/quickSnatchPatch.rar
quickSnatch usage: Start it up. Press CTRL-F2 to select folder. Ctrl-f12 to make selection. F11 to save the screenshot.
The output of quickSnatcher is an .XML file. To turn it into HTML use quickPatcher.
Usage: Start quickPatcher up.Browse for the XML.Hit 'GO'.
Bug: It asks 4 times for a folder to save to.
Bug/missing feature: Splash screen
Bug/missing feature: cropping input windows not implemented yet.
Big/missing feature: HTML images not resized yet.
EDIT:
New feature added to quickPatcher.
renderhjs asked for a new feature. Generating bbs code. Very quickly done, so it may be a bit buggy. Result is in my post below.
Tutorial on how to use it(yes, made by these apps): http://www.gameartist.nl/tutorials/usage/
Good for making tutorials: www.gameartist.nl/tutorials/01
Good for gathering reference: www.gameartist.nl/tutorials/old
This program is not finished at all, so any comments/requests are welcome.
Download both quickPather and quickSnatcher at: www.gameartist.nl/quickSnatchPatch.rar
quickSnatch usage: Start it up. Press CTRL-F2 to select folder. Ctrl-f12 to make selection. F11 to save the screenshot.
The output of quickSnatcher is an .XML file. To turn it into HTML use quickPatcher.
Usage: Start quickPatcher up.Browse for the XML.Hit 'GO'.
Bug: It asks 4 times for a folder to save to.
Bug/missing feature: Splash screen
Bug/missing feature: cropping input windows not implemented yet.
Big/missing feature: HTML images not resized yet.
EDIT:
New feature added to quickPatcher.
renderhjs asked for a new feature. Generating bbs code. Very quickly done, so it may be a bit buggy. Result is in my post below.
Tutorial on how to use it(yes, made by these apps): http://www.gameartist.nl/tutorials/usage/
Replies
These are the known bugs:
Screenshot app asks 4 times for a folder when F2 is pressed.
And we decided to give the applications names:
Screenshot app = quickSnatcher.
HTML generator = quickPatcher.
Temporarly names btw.
Ok, after writing all this i actually find it has an icon in my windowsbar, which i did not notice because i auto-hide it. (it was gonna be my recommendation to fix this :P) Still it would be helpfull to show a splashscreen or something, to make sure the user knows it worked.
The crop tool was nicely done.
You might want to add support for shortcuts. For example: I want to make a ZBrush tutorial. I want to explain basic navigation. I can show the working space and indicate the buttons you can press to move and rotate and whatnot. I don't want to put the shortcuts that you would normally use in the text but make them extra obvious in some way.
Adding arrows or other sorts of markers might be handy as well, i do that alot when i make a tutorial.
I think i'm gonna use the crop tool of this thing very often, for sending a quick screen to a friend without opening photoshop, the rest, i'm not sure about but ofcourse i don't make tutorials daily.
Edit: I see it does some sort of optimization before saving the png. When i take a screen of this polycount page it is significantly lower in filesize (lots of black) than my desktop. I think it would be nice to control this, like when saving a jpg for web in photoshop. Especially if i want to show a screenshot to a friend real quick i dont want to send a 1.6mb png but rather a 200kb jpg. Just a thought.
Jerry.
And you dont have to use it for tutorials ofcourse, I personaly am going to use it to gather reference images and save it as html files so that I can search stuff inside of it, and to keep everything organized in folders.
I thought about this before, what i really wanted was a quick app that lets me save a picture from the web and then add tags to it, like on all those web 2.0 sites with those 'tagclouds'. The windows image viewer supports those tags so it would be really fast to find what you're looking for and find groups of images that share something. It would probably be an firefox extension and i really have no clue how to write them:poly118:
Can you share any nerd info on how you developed this? Python, c++, what libraries?
Jerry.
Edit: I only now opened your app, and it says groupbox3 above the GO button ^^
Edit2: When it's finished it says: "Something went wrong with the copy operation."
(oh and great tool)
EDIT: That tutorial has pretty big images, this is a better example:
Here's the HTML clone: www.gameartist.nl/tutorials/old
1: Old chair i found on flickr. I like the leeves on it and the round shapes.
2: The top side of the leather looks new, the rest is pretty old. I guess somehad with a fat ass and no chest sat on it.
3: See..it's never to dirty, so dont try to keep your textures clean at all times.
4: Ok at this moment, i'm not even sure why I chose old chairs for this example, but this is pretty simple to do, so who cares.
5: I really feel like modelling this, reminds me of HL2.
6: Nice detail in the wood(?).
7: This looks pretty new to me..why are they throwing it out? Does it..stink?
8: Same story here.
9: Ok enough chairs for now, you get the point.
Oh and Jerry: the groupbox3 thing is gone:P, and the error is probably because you are running it from the RAR, but closed the rar? Or you forgot to unpack the image files with it.
And both programmed in C#,nothing fancy used, everything .NET.
http://www.renderhjs.net/_ossman_test/
osman and me discussing maxscript matter (in Dutch/English spaghetti language)
http://www.renderhjs.net/_ossman_test/maxscipt_help/help_maxscript.html
A few things :
-When I am in f12 'mode', I always try to hit enter in order to get to the caption entry. I think you can remove f11 and replace it by enter altogether really.
-In the caption entry window I couldn't manage to break lines. No matter how many brakes I entered, the output always was a block of text.
-Gear.png is not included. I'd say go for Logo.png, and make it selectable in the f2 dialog, also allow users to have a text-only title if desired.
-No need to have the F2 for the XML setup dialog by the way. I would recommend putting all this under a right click on the icon running on the bottom right of the screen. You could also integrate the two apps in to one, and have the HTML settings accessible the same way. You could even remove the XML definitions step, and have the app figure all that from the HTML setup.
-You should also have the HTM generated on the fly (just like the XML is). When I was making progress on my test tut, I naturally wanted it to be displayed on a running browser window, but I soon realized I had to recompile every other minute to check my progress.
-Under f11, you could put a text edit mode to let us go back to previous chapters to edits text and image entries. The user shouldn't have to mess with XML or HTML at all.
-I had the HTML patcher poping up an error message, even if it went perfectly well.
I had the page title displayed on the right of the page logo on my HTMLs. I ended up giving the page a blank name just to avoid that.
Also, you could included a few CSS templates to choose from, or simply keep a default naming and let the user copy paste a .css from a folder full of them. I tried to replicate this look (hiding the <HR> by making it white, and so on)
http://www.pioroberson.com/tuts/tut_ut3_custom_head_model.htm
but somehow i didn't manage to restrict blocs of text to 700pix wide without editing inside the HTML file (i tried to do it all from a linked CSS, and using only the tag generated b the patcher obviously. But that may be just because I suck at CSS :P)
From working with that example in mind I realized you could also add support for :
Chapters headers
Notes
Code quote
Text independant of images
In current state I think I will use it as a raw way to store image and text for tuts, generate the html just to select all/copy all from a browser window, and paste all in a wysiwyg or a word processor editor to assign further formatting.
Good luck with all this!
We will add both application into one eventualy.
Will let you know when it's updated:).
As for formatting, I just found a very easy way. Instead of trying to handle everything in a linked CSS from the raw patcher output, I am now just doing some simple (hacky, but good enough) formatting in Nvu, the free wysiwyg editor based on the firefox engine. So yeah so far so good ! I just keep the XML open onscreen to check the current state of the tut. Then convert to simple HTML at the very end, and then, format this output visually to make it pretty.
Two more suggestions :
-When typing in the caption editing window I wish I could see the screenschot I just took. It would make the typing much easier, because it would give a reminder of what is being talked about!
-I'd love a setting letting me choose wether I want the text to be put before and after the picture. Usually when writing docs I type a block of text, the show a few pictures after that. But since your approach is fully screenshot based, it would be nice to be able to put the text after the screenshot (more like a caption).
I am rewriting the whole thing btw, and I've just added a timer, so it compiles every couple of seconds the HTML for you. The interval is changable, but I'm also thinking of making it so that everytime a screenshot is taken, the quickPatcher would compile one.
- time stamp in the XML file ,- and in some html layouts (though sometimes I would not like it in there)
- compression of the images after the session (so that a copy of the PNG files is created that can be either resized but also converted into a different format such as JPEG)
- snap function of the rectangle draw thingy that snaps on existing windows so that it is easier to select specific windows or panels
if I am in the mood I could program something in Actionscript that would read out the XML and display the content in some flash thingy e.g
- Diashow / presentation
- compact overview thingy where you can slide through the screenshots as a whole canvas
the advantage with flash would be that there is no conversion goin on - everything would be loaded at runtime (xml and the PNG images)
stellar work on this, you guys.
I agree about making the tray icon have more involvement in general, but most importantly the ctrl+F12 mode is awesome, but I'd like to have indicators for where my capture area is even when I'm outside of that mode, It's really convenient to just be able to press Ctrl+F11 repeatedly if I'm making an animated GIF or something where I plan on capturing the same area, but I keep having to pop in/out to check positioning of windows etc. Little corner indicators would be awesome.
I'll definitely be using these heavily. Thanks for taking the time to make these tools