Final Project: Final Presentation & Contact Info

Real Estate Developer's Web Site - Kasthomes.com (not the final project link)

Purpose: To develop a web site for a property developers group on Long Island which they could manage themselves as their group's interests change... and to make money :-)

Explore:

• I performed a lot of market research related to real estate on the web, looking at solutions for developers and real estate agents. Found a few robust but out of date and unsupported solutions as well as one plug-in for WordPress. But nothing really good to speak of.
  
• Realizing there was no plug & play solution I started to brainstorm (pdf) an idea which I then decided to start as the final project.
  

Plan:

• Sitemap (pdf)- Defines the content areas for front-end and back-end needs.
  
• Wireframes (pdf)- Very detailed content boxes for all front-end and back-end pages. I built the wireframes with OmniGraffle with a Blueprint CSS framework already in mind (before actual XHTML coding). The wireframes were planned on a 24 column layout but I changed it to 16 columns when I started to write the XHTML. I changed the default download of 24-column grid to 16-columns easily with this css generator.
  
• I found such detail at this stage (in the wireframes) to be very beneficial to the actual development of XHTML and CSS. The client didn't really know what they were looking at but I didn't actually expect them to.
  

Build:

• Project development lives here onepotcooking.com/davidbone/kasthomes/ but the bulk of what I developed for the final project is the administration here onepotcooking.com/davidbone/kasthomes/administration
• Login Email: admin@admin.com Pass: admin
• If you looked at the wireframes you will see that I have a long way to go but for the purpose of this class I feel I got a great head start on a project I wouldn't have challenged myself with doing from scratch. I will finish this project along the path I've started here!

Learned: (XHTML, CSS, Javascript, PHP and MySQL)

• Practiced my XHTML and CSS. Learned a lot about the Blueprint CSS framework. Got back into hand coding too, which I had become lazy doing and was relying on applications to aid me. Will use Blueprint again.
  
• I'm also glad I took the time learn a program like OmniGraffle for the wireframes and also took the time to define the content layout in such detail. Definitely got me thinking I should wireframe any size project I do from now on since it helped my to just focus on development at the next stage. Wireframes aren't set in stone but at least you know what to expect on the first round of development.
  
• I would have liked to learn more about Javascript. Some basics were demystified but I certainly don't feel comfortable with it yet. Learned to read it better which will help in appropriating open source solutions but won't be writing it from scratch any time soon. I do realize though that my completed final project will have a lot of Javascript in the end.
  
• The PHP/MySQL part of this class was very exciting for me. I now feel comfortable in being able to build a simple dynamic site and relating the data to a database. That's a BIG step for me. Mind you I have only taken the first step in either but if there are any other classes to take, for me that class will focus on PHP & MySQL.

THANKS & KEEP IN TOUCH!
I really don't see me conversing on this blog in the future (I have two others) but please visit me at any of the following locations.

• Personal Blog nycbone.com - I started this to learn about WordPress and plan on getting back into writing at least once a week after the holidays. Probably turning it into more of a photo experience.
  
• Business Portfolio/Blog bonestructure.com - This is WordPress as well. Slapped up there to have at least a few things for clients to look at. This will be growing significantly in 2009, in content and as a project of mine to learn how to plan, design and build a WordPress theme. The goal is to launch a theme next year.
• Other links in the following signature (brought to you by Wisestamp). My daily email is nycbone [at] gmail [.] com
  

David Bone
718.809.0446
__________________________
follow me here as well:

LinkedinFacebookFlickrTwitter

FInal Project : Site Map Updated & Wireframes Created

I'm ready now to review all the information with my client, make notes, possibly update the following files one last time then start coding the structure. Design will probably start somewhere in the middle of coding.

In coding, I foresee myself creating examples of each section independently and then applying it to the whole. I plan to start coding the XHTML and CSS next Monday after review with client and Amos.

SITEMAP
I've updated the site map to represent just this project for a real estate development company.

Two questions for me still exist. 1) What are the client's needs for making new pages? 2) What are the true needs for Rentals?

I talked to the client last night and he said there wasn't much of a need at all so I'm realizing Rentals on the site will be different than anything Sale related. The site map will have to be updated once Rentals if figured out.

I'm sure there will be some speed bumps along the way but I believe I have a good idea of what is needed.




WIREFRAMES... all 31 pages!

Download the full PDF

Holy cow have I been making the boxes over the past few days. I've not detailed a site like this before in wireframes. I believe the time spent here will really save time in coding.

The wire frames are based on a 960 grid which is what the Blueprint CSS uses when I start coding. The red columns are based on this 960 grid.

This image is the idea for the front page that I will be submitting to the client for review.

I am going to code a 2-level navigation but I may not use it realizing I probably don't have enough data to warrant a need for it.

The footer is a big one, which is a style these days and I thought to try it here because the client doesn't want any static pages of information just dedicated to the company. That being so, all the company info I do have on the holding site now can fit in a big footer. This will be on every page.

One issue I know I need to resolve before coding is image size. I need to make sure there are no more than 3 sizes but I'm going to try to get away with 2 dimensions where the medium size will also serve as the small size by restricting it's dimensions in css. I'm thinking about needing a php photo processor for images uploaded.

I wire framed the complete administration as well. I have a lot of questions on these pages that I need to review with my client as well as figure out how the buckets (tables) of information will relate to each other. While creating the wire frames for this section I realized how the basic examples of coding from the last few weeks will apply here... pretty cool.

THE AID OF 3RD PARTY
While I was brainstorming last week I thought to use some or none of the following for framework & functionality.

• CSS: Blueprint Grid
• PHP: Need to find some kind of image process that will take a large upload and make a medium sized image from it. Perhaps I can code it but I highly doubt it at this stage.
• Javascript: Prototype & Scriptaculous (of course), Lightview for images, Tab (1 or 2) scripts, Accordian for editing properties page, Tooltips, TinyMCE
  
• Other: Google Analytics, ShareThis
  

Wireframe: My Pet Shop

In class assignment: Create a wireframe of information architecture for a pet store