The second iPad web app on which I’ve been working with Nick Haskins of Spilled Milk Designs is nearly done. After many hours and many obstacles, we have a made the iPad web app for his photography portfolio ready for visitors.

As with our Spilled Milk Designs web app, the aim here was to create an iPad-friendly version of the main Flash website. The app contains a homepage slideshow, one more for the About page; next we have a promo reel showing Nick at work, a contact form and, finally, galleries with Nick’s amazing photos.

Once more, we have made use of Matteo Spinelli’s excellent iScroll script and, this time, it powers our main galleries. Another shout out goes to Mike Alsup for his jQuery plugin – Cycle, which runs the smoothly cross-fading Home and About pages’ slide shows.

P.S. Expect the app to get updated with some cool features soon. Stay tuned for more iPad goodness.

Client

Spilled Milk Designs

Services

• Layout Design – Photoshop
• Coding – HTML, CSS, jQuery, PHP

Website URL

http://ipad.haskinsphotography.com/

This is the landing page for the next project on which I’ll be working with Nick Haskins of Spilled Milk Designs. I won’t say much more about it for now, but you can check out Finger Sites on Facebook and Twitter.

Over the coming weeks, Nick and I will be busy working on the web app you can see in the second screenshot below. After that, we move to Finger Sites and that’s where the real fun starts. Stay tuned!

Update: On Nick’s suggestion, we have changed the color theme for the page. The new version is more vibrant and inviting.

Client

Spilled Milk Designs

Services

• Layout Design – Photoshop
• Coding – HTML, CSS

Website URL

http://fingersites.com/

Spilled Milk Designs specialize in building custom Flash websites on the Showit platform. I was contacted by their founder Nick Haskins with an offer to work with them on a version of the site that could be accessed on the iPad since the device doesn’t support Flash. The main idea was to build a web app that would look and feel like a native iPad app written in Objective-C, Cocoa or what have you.

Because iPad’s main browser is Apple’s own Safari, we were able to make use of many neat, (term used loosely:) new web technologies, like: localStorage, SVG graphics (coming soon), offline cache and many CSS3 properties which allowed us to minimize the need for images for the app’s layout. The tricky thing about this project was designing for the device’s two orientations – making sure the whole page was inside the device’s viewport and only have certain div elements or iframes scrollable. For making these elements scrollable and scrollable with style, Matteo Spinelli’s iScroll script and comments were invaluable. As for making page elements adapt to different orientations, we relied on CSS3 media queries and JavaScript orientation (and orientation changes) detection.

Working on this project has been very rewarding not only because I have learned more about some HTML5 features, iPad’s JavaScript methods and design for the iPad in general, but also because Nick is such a great person to work with. I am really going to enjoy working with him on our future projects so you can expect more iPad designs here soon.

P.S. The app is currently in alpha stage at version 0.8. I am working on a new project with Nick and, when that is finished, we go back to finalize the SMD app before we move onto something special.

Client

Spilled Milk Designs

Services

• Layout Design – Photoshop
• Coding – HTML5, CSS3, jQuery, PHP

Website URL

http://ipad.spilledmilkdesigns.com/

almosh82 is a WordPress-based portfolio I’ve built for a talented logo and brand identity designer from India. The client had the design for the website ready and has contacted me for the PSD to XHTML conversion.

Client

almosh82

Services

• PSD Slicing
• Coding – XHTML, CSS, jQuery, PHP (WordPress)

Website URL

http://www.almosh82.com/

HTDS Medical is a medical company based in China.

Client

Mina Mar Group

Services

• Layout Design – Photoshop
• Coding – XHTML, CSS, jQuery

Website URL

http://www.htdsmedical.com/

Client

EC-Consulting

Services

• Layout Design – Photoshop
• Coding – XHTML, CSS

Website URL

http://www.ecconsulting.rs/

Wilshire Investments is a website I’ve built for a company that helps firms go public (on the stock market).

Client

Mina Mar Group

Services

• Layout Design – Photoshop
• Coding – XHTML, CSS, jQuery

Website URL

http://www.wilshireconsulting.com/

Genius Logo is a website I’ve built for a friend and colleague, Miloš Radojević. Miloš is a very talented logo and brand identity designer. The minimalistic design was his idea and is based on his sketches.

Client

Genius Logo

Services

• Layout Design – Photoshop
• Coding – XHTML, CSS, jQuery

Website URL

http://www.geniuslogo.com/

MindUp BioResearch is a website I’ve built for group of medical researchers.

Client

Mina Mar Group

Services

• Layout Design – Photoshop
• Coding – XHTML, CSS, jQuery, PHP

Website URL

http://www.mindupbioresearch.com/

Slavica Biochem is a website I’ve built for a group of researchers in the field of neurological impairments.

Client

Mina Mar Group

Services

• Layout Design – Photoshop
• Coding – XHTML, CSS, jQuery, PHP

Website URL

http://www.slavicabiochem.com/