Interesting Photography Techniques

August 9th, 2010 No comments »

If you’re a photographer and like  to create/ manipulate in mediums other than Photoshop or other software, then finding different ways to take pictures will probably grab your attention as much as it does mine. I recently came across a couple of new ways of taking photographs (new to me of course), only one of which I would consider myself brave enough to try: TtV and Camera Toss (ughhh!).

Through the Viewfinder, or TtV

This technique involves taking picture through the viewfinder of another camera. Yes, you will require two cameras for this technique. The neat thing is the second camera doesn’t have to be in working order, it just needs it’s lens system to be intact.

Typically you will need the camera you will be taking the picture with, and then you will need something like a vintage twin-lens reflex camera. Kodak’s Duaflex cameras come to mind. If you can’t find any at your local yard sales, try eBay; they’re not too difficult to find there, and not too expensive either (shipping will get you though). once you have that, you are going to need to build a housing to hold your “middle” camera. This is to keep out unwanted light and to be able to stably position your “live” camera. I’m not going to go into those details here as someone else has already explained it well here and here.

By the way, you are going to end up with a reversed image using this technique. From what I’ve read, the consensus is to leave the image as it was taken.

Camera Toss

Photo: Ospreye

I was totally surprised, or dare I say shocked, to discover the “camera toss” group on flickr.com. But being a web designer, photographer, artistic type developer, my curiosity got the better of me, so I dug a little deeper. If you follow this link to the Camera Toss blog you will find a few tips on getting started.

Here are my thoughts on the basic tips:

  1. Be careful. To me this means don’t let your camera out of hands.
  2. Have fun. Mmmmh, not so easy to do when you’re thinking how valuable your equipment is.
  3. Experiment. Okay, not so bad, but I’m sure there are ways to try new things that aren’t quite so risky.

Got any other interesting photography techniques, especially ones that cannot be easily reproduced in a post production environment, I’d love to hear about it.

VN:F [1.8.1_1037]
Rating: 0.0/5 (0 votes cast)

No comments »

Posted in Photography

TIP: jQuery’s .ajax() call and ASP.NET webservices serialization

July 29th, 2010 No comments »

I have recently been writing a bunch more AJAX applications that use ASP.NET for the back end, this time using web services. Initially everything was running fine: added a jQuery ajax call to my service.asmx file to load a list of items into a table, update my item paging, etc, and I’m on my way. However, as most programmers know, complexity is bound to catch up with you. Suddenly the page had a host of other controls that also required updating at the same time, so now I’m passing back complex data types from my web service. Now that simple .ajax() call is a source of frustration!

The trouble began when trying to pass back a complex object that contained a List<T> among other things. Actually, I probably could have circumvented the problem. After all, my basic methodology was working: get and return a list of items and display them within a table. But I wanted to return some additional fields that were not part of the list of items. Oh, and I did not want to perform a series of AJAX calls; I wanted it all in one go. What did I do that created the problem? I created a wrapper class to hold my list together with the other data I wanted to pass back. I had a really complex data type!

The original working server code, which was written as:

VB
<WebMethod()> _
Public Function GetList(parameter1 as integer, parameter2 as integer) As IEnumerable
  Dim items as List(Of Product)
  ' Do some work
  Return items
End Function

had now become this:

VB
<WebMethod()> _
Public Function GetList(parameter1 as integer, parameter2 as integer) As  IEnumerable
  Dim myData as dataObject
  ' Do some work
  Return items
End Function

Public Class dataObject

  Private _items as List(Of Product)
  Public Property Items() as List(Of Product)
    Get: return _items
    End Get
    Set (ByVal value As List(Of Product))
      _items = value
    End Set
  End Property

End Class

Serialization

Taking a look under the hood, I realized one of the differences was that I now had this __type identifier field in the json data being returned from the web service. I thought if I could get rid of this it might simplify the problem. Well, this next step did not solve the problem, but I'm making note of it here because unless you actually need to know the type (say you're consuming the web service from another ASP.NET application), it just creates extra overhead. And besides we like json because it's so lightweight, and I'm writing my app this way because I want the performance benefit.

I did three things:

  1. I changed the JavaScriptSerialize initialization.
  2. I made the wrapper class and its default constructor method protected internal (protected friend).
  3. I changed the return type of my WebMethod to 'string'.

JavaScript Changes

The success function of jQuery's ajax() call takes a parameter 'msg'. In the intial working code, the value of 'msg.d' gave me the json object that I could work with. After the update it became 'undefined'. After much debugging with FireBug and searching other solutions, I realized the response actually looked a little weird. It seemed to have been serialized to a json object, but it contained a whole lot of additional back-slashes and quote marks. The solution was quite simple really, I needed one more step of parsing using the JavaScript eval() function to get the results:

JS
var result = eval('(' + msg.d + ')');
Process(result.Items);
VN:F [1.8.1_1037]
Rating: 0.0/5 (0 votes cast)

No comments »

Posted in AJAX, jQuery

Tags:

Web Design for Developers

July 27th, 2010 No comments »

If you are a software developer that has to tackle web design as a tag on to your main profession, how do you do it? Apparently Brian Hogan has written a book on this already: Web Design for Developers: A Programmer’s Guide to Design Tools and Techniques (The Pragmatic Programmers). Fortunately I have had the advantage of being both artistic and technical, which means picking up new software skills in Photoshop, Flash or whatever design platform happens to be available comes fairly easy to me. While I am not a serious artist, I do have a good sense of color, and layout, with typography being one of my strongest areas from a design perspective. Mixing art and technology has not been too difficult for me.

But how do other developer’s who work in both worlds succeed at this? I would love to hear from developers who also design, whether out of necessity or love for the medium. Furthermore, what tools do developers have at their disposal — I can’t imagine too many developers with Visual Studio and SQL Server also have Adobe Photoshop or Flash installed on their system, although it would make sense if you’re a pure Adobe shop since they do have some all encompassing design suites that also cater for developers. I remember my first use of Flash was to create an interactive mobile banking demo to run standalone without a browser. That was before I started web design.

In the Web 2.0 World, building web applications cannot be successful devoid of any artistic stroke, whether it is for art’s sake or even plain usability. I can tell from my experience as a previous freelancer that it doesn’t get any easier when you work alone; in fact the smaller the team, the greater the demands are on your skills. Even a simple web app can benefit from stylish buttons and matching icons. Someone with great logic can make an educated guess on how best to organize or structure a page. In fact I would daresay that some developers are capable of beating designers that possess only a background in art when it comes to creating usable interfaces.

Keeping current can also be a major pain-point for developers. When you have limited resources and time for learning, do you spend it on design books, a Photoshop seminar, exploring emerging standards such as HTML5, or do you go for that training seminar on the latest version of SQL Server? How do you do it?

VN:F [1.8.1_1037]
Rating: 0.0/5 (0 votes cast)

No comments »

Posted in Computer Programming, Web Design

Tags:

HTML5 – To design or not to?

June 21st, 2010 No comments »

I have read several articles that reference browser support of the HTML5 standard and how to get older browsers to play nicely with the new spec — browsers like Internet Explorer 6 through 8. They generally do this by manipulating the DOM through a snippet of JavaScript. This way the browser will recognize the new elements introduced in HTML5 and correctly apply and render them using the defined style-sheet definitions. See this article for a typical example of how it is done.

One thing I must mention about JavaScript dependence in visual design is the case for broken JavaScript. The chances of not having JavaScript support is very slim, but I find it more likely that with the resurgence of JavaScript enabled pages, due to popular libraries such as jQuery, the chances of turning up pages with broken scripts also increases. What happens in some cases is that subsequent code in the page stops working, and, without testing, the problem often goes unnoticed especially to all us FireFox users.

My opinion would be not to ‘make’ the older browsers support HTML5 — just let them be. After all, do websites really need to look (and work) the same in every browser? Or should we look for alternative solutions that don’t depend on JavaScript?

VN:F [1.8.1_1037]
Rating: 0.0/5 (0 votes cast)

No comments »

Posted in Web Design

Tags:

A simple Google Maps implementation – Part I

June 10th, 2010 No comments »

Tutorial using the Maps JavaScript API version 3 (version 2 is deprecated)

This will illustrate how to get Google Maps working together with ASP.NET and jQuery. Before we get to the ASP.NET part of it, here is some basic groundwork that is essential for any page using Google Maps. The new Google Maps API, release in May this year has some significant performance improvements, and is fairly simple to work with. It would be a shame to build an web page that grinds, so I looked at ways to create a simple map and make it work fast.

If you’re here looking for an updated Google Maps ASP.NET control that uses the newer Google Maps API, you’re not going to find it. What you’ll find is actually a simpler approach. As far as the .NET code is concerned, I had previously made use of a Google Maps ASP.NET control (this one), and this implementation was birthed out of my search for an updated version (which I did not find anything suitable=simple). More about the .NET side a bit later.

Basics

Step 1: Throw away your API key! Seriously though, no API Key is needed to use Google Maps the way it is done here.

Step 2: Add some JavaScript to your HTML…

In order to create a simple html page that will display a map, a link to Google Maps API JavaScript file needs to be included in the page linked as shown below. The ‘sensor’ query-string variable must be explicitly set to either false or true. I’ve chosen false since I am not auto-detecting the user’s location in any way. After the API has been loaded we can customize our script to initialize the map on the page:

JS
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var map;
var geocoder;
$(document).ready( function(){
  // initialize map
  var latlng = new google.maps.LatLng(38.5, -95); // center point for the map
  var mapOptions = {
    zoom: 3,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
  geocoder = new google.maps.Geocoder();
});
</script>

The second script block contains the code to initialize the map. It requires a block element with id = “map_canvas”. So, place a div element on the page that will be the map canvas. If you’re here looking for a Google Maps ASP.NET Control, you don’t need a control — just a few snippets of HTML and JavaScript. We do this as per Google Maps recommendations like this:

» Read more: A simple Google Maps implementation – Part I

VN:F [1.8.1_1037]
Rating: 4.0/5 (1 vote cast)

No comments »

Posted in Web Design, jQuery

Tags:

XSLT Shortlist

May 4th, 2010 No comments »

Coming from different programming backgrounds can really interfere with ones grasp of other languages, not only when it doesn’t do what you want, but when it can, but just won’t operate the way your primary language does. Here’s my take on XSLT methods based on what I’d expect coming from a .NET perspective.

If-Then statement

<xsl:if test="[test something here]">
   Do some work here!
</xsl:if>

If-Then-Else statement

Aha! There is no extension to the xsl:if operator that allows us to handle the ‘else’. An XSLT If-Then-Else is essentially a xsl choose-when-otherwise — same test, just a different way of saying it.

<xsl:choose>
    <xsl:when test="[test something here]">
        Do some work here
    </xsl:when>
    <xsl:otherwise>
        Do some other work here
    </xsl:otherwise>
</xsl:choose>

Will add more here as I encounter the need. Suggestions welcome!

VN:F [1.8.1_1037]
Rating: 0.0/5 (0 votes cast)

No comments »

Posted in .NET, XSL and XSLT

Tags:

Google and Your Site Load Time

April 12th, 2010 No comments »

We should have known it was coming, right? Google search rankings are now affected by your site speed. Your host’s performance has always had an impact on search listings, but it used to be more of a hit-or-miss situation: there was a time when I would check my sites’ stats to see that some pages were not indexed because they just plain took too long to load. However, this new development affects much more than whether your page is captured or not—it affects your site’s overall placement within search results. So what I would really like to know is how much this is going to affect existing search rankings.

Most savvy developers should already be aware of things that clog the channels: heavy and bloated HTML and style-sheet files, accumulation of scripts and libraries, un-vetted media files (flash banners, images, video and audio), and third-party scripts such as metrics tracking files.

While we can pay attention to the bandwidth required by individual files, it is important to take a look at the overall architecture of your site. Here are a few tips to get you started:

  1. First, measure. There is no point to spending time whittling a 5KB CSS file down to 4KB if your HTML is weighing in at 40-50KB. Besides, I would think that Google is primarily interested in the HTML part of things anyway. There are a number of tools that you can use to pinpoint the slow parts of a page, i.e. whether it is the DNS look-ups, HTML and supporting file sizes, or number of embedded images and linked files, etc that are costing you. However, you may want to fore-go this until you have taken a look at your site from your users’ perspective. Find a machine with a slow connection (think dial-up), or even outside the network you are developing on, and poke around your website. If you regularly flip through your own sites you may already have a lot of content cached on your own machine, which would affect your experience, so it is important to get “out” there.
  2. I recently heard Nicole Sullivan, author of Even Faster Websites, speak at An Event Apart in Seattle on the subject of Object-Oriented CSS. While there are definite differences of opinion on the matter, if there is one thing everyone can take away from this, it is to optimize not just on the CSS properties, but on optimizing our use of selectors. Too often we spend a lot of time in between the curly braces. It takes more effort to refine the selectors we use, as it often requires us to operate on the HTML as well. This is where it pays to be both an HTML and CSS guru. Taking a closer look at the CSS selector structure of your pages may reveal things about your HTML that you may not be aware of by merely looking at the HTML.
  3. Make sure your metrics tracking scripts do not require being hosted on your server. While I don’t expect the search bots to try load these up to measure the performance of the content page, any content that is served from your site places a demand on your server resources, and if your server is already choking, you won’t want to add to that.
  4. The same goes for advertising banners: get them off your server. There are designers who pride themselves in squeezing every last byte out of their images and then there are those who pride themselves in delivering the ultimate and most stunning high-def experience without regard to bandwidth-challenged users. No problem finding the latter. What’s the point of having a super-stunning website if no-one can find you.

I have questions of my own: Is Google going to take into account the effect of their own search bots on your website’s backbone? How long before other search engines follow suit is anyone’s guess. If you are looking for tools to help you with reducing file size, the Google Webmaster blog provides a number of these, along with last Friday’s announcement of the site speed metric. See you there.

VN:F [1.8.1_1037]
Rating: 0.0/5 (0 votes cast)

No comments »

Posted in Web Design

Tags:

User Agent String requirements

April 2nd, 2010 No comments »

I recently had the task of tracking down the source of an error in one of my web applications that turned out to have something to do with the user agent string detection. I have always assumed that the user agent property was a given, but, alas, even the given things are not set in stone.

According to the HTTP 1.1 spec, the User-Agent (UA) request-header field is supposed to inform us about the program that is making the call, be that a browser, bot or other application. Generally this information is used for statistical purposes, allowing the host to determine among other things, the application, operating system, software vendor and revision number.

I have known that in some cases this string can be faked, and it is easy enough to do this in certain browsers, such as FireFox and Opera. Apparently there is even a user agent switcher add-on for FireFox that makes this job easy for you (intended for development purposes of course). And if that is not sufficient, a search will find you ways to edit the UA value on almost any browser, and also the values used by almost any browser in existence. So while I had thought to test different values — legitimate and dangerous — I had not thought to cater for the case of no UA string.

I have had to resort to the following where I have to tackle user-agent detection:

If IsNothing(Context.Request.UserAgent) Then
Context.Response.Clear()
Context.Response.Write("<h1>Sorry!</h1><p>We could not determine the UserAgent type.</p>")
Context.Response.End()
End If
' Carry on...

But what do you do if the user-agent string is missing? Is this a valid condition to anticipate?

VN:F [1.8.1_1037]
Rating: 0.0/5 (0 votes cast)

No comments »

Posted in .NET