

Hello again.
Not so much a busy week as much as a busy weekend, as far as the drawing app goes. I did not have a single free moment to work on it during the week with the middle of the term upon us. However last night, or should I say yesterday at about 2pm I began working on the app again and I did not stop until around 2:30am the following day only to sleep five hours and then continue working. So despite hold backs throughout the week I have made some significant improvements to the drawing app. Oh and all the code is on GitHub at https://github.com/JasonHintlian/WArtMuseumColor I will work this week to get this added as a branch of of our 401Project on GitHub, hopefully with all the comments too.
There have been some major advancements in the User Interface UI this week including new cool buttons a new size selection menu and a few new ancient approved colors from the Worcester Art Museum WAM. On top of that I have corrected the issue of thumbnails squishing which was nothing more than a quick change to some css and added a few arrows to symbolize a scrolling option. I now that the WAM would like the button to disappear when the scroll reaches its end like many iOS application but that may not be so easy to do in a web application. It will certainly be a topic for research this week.
So too the implementation. First the new buttons just set there background to the current color, like the old color button but now they are overlaid with a partially transparent image. This is achieved in css by setting the background to the desired image. I creates the illusion of a wet paint brush and bubble styled sizes. Next I built a new pop up canvas to hold the different sizes. I chose this method as opposed to size buttons linked through html because it allows the user to easily expand or hide the menu. In addition we can reference the x and y coordinates of a mouse-down event in order to set the size based on the position of our mouse. There are six images that make up the size menu one permanent partially transparent background and five different pointer images drawn with respect to the current size. Though I am quite certain I can reduce this down to one pointer image and then just redraw it were necessary that will have to wait till next week.
The third new change this week is simply the proper sizing of the coloring images and fe extra colors. In addition I did add a few arrows to the scroll menu, but they have no functionality other than being a visual queue to the user that “this area can scroll”. I would certainly like to add some functionality to those buttons so I will look into that this week. Other than that all our coloring images are now the official images form WAM. That was a quick change, I did resize the images for the thumbnails but that should not make any difference visually but it goes a long way toward improving the smoothness of scrolling.
Overall this weeks effort was geared towards creating the UI that WAM wants so hopefully they approve of the newer buttons and the size selection menu. There new set of colors made a nice addition to the app but I would like to find a copy of photoshop we can “legally” use to make a better looking color wheel with ultimately more color and shades to select. So this weeks agenda will most likely be focused on scrolling and a better color wheel as well as creating a branch off of our 401Project repository. Should all the UI expectations be met early enough I would also like to work on a sub-pixel curve algorithm to create a smoother painting experience, but we will see how it goes.
Anyway till next time.
Jason

From the blog jasonhintlian » cs-wsu by jasonhintlian and used with permission of the author. All other rights reserved by the author.