NMS 520 - Project 2 Update

The great hosting mystery has finally been solved.  After a call to the Technology Contact Center, I was given a password.  Then after reading the online tutorial .pdf, I was able to use CyberDuck to get my files up onto the DePaul student webspace:

http://students.depaul.edu/~jandruka/index.html

Back to the coding, I feel like I’ve got a pretty good handle on the CSS positioning, and after some trial and error, I finally got the JQuery Lightbox plugin to work the way I wanted it to on my portfolio page.  This was a good challenge for me, since I’d never really worked with JQuery or JavaScript before.

The lightbox is working fine, but I’m not sure if it’s the best way to present the web portion of my portfolio.  Clicking on the thumbnail brings up a screenshot of the website, but there’s no opportunity to include a link within the description.  The way the lightbox generates the description is by reading the title of the link, and as far as I know it would be impossible to include an <a href> within a title that’s already within another <a href>.

I’d also like a little more room to describe what I did on each web project since none of these were my original designs.  I may want to give each web project its own page that could include a detailed description and a link to the live website, but this would be beyond the scope of Project 2, which is only supposed to be 3-5 pages.  This might be something to look into for the next phase of the project.

NMS 520 - Project 2 Update

Well I’ve put in some serious time trying to learn the ins and outs of CSS positioning, and I think I’ve almost got it.  I watched and rewatched some video tutorials at lynda.com, and while it looks like some of their example pages are out of date, the basic concepts remain the same.  I had a really tough time at first with the whole relative vs. absolute positioning thing, but one of the tips on a video tutorial made it simple: use relative only once when you’re making the container, then use absolute for the rest of the divs.  I don’t know if that’s an actual rule of thumb, but it worked for me.

It took a lot of trial and error, but my index page looks pretty much exactly like the Photoshop sketch I started with.  I altered some of the spacing once I saw the way it looks in a browser, but I’m sticking with the design concept.

For the images on my portfolio page, I’m experimenting with using a jQuery Lightbox plug-in.  I’m not sure if that’s out of the scope of this assignment, but I wanted to give it a shot.  I messed around a lot with the lightbox style sheet to get it to work the way I wanted, and so far so good.  I’ll wait and see how well this lightbox works once I test my site for every browser.  It may end up that I have to scrap the whole thing and go to a more traditional “click thumbnail->go to image” set-up, but it was a good experience to at least play with the jQuery stuff.

As far as hosting goes, I still haven’t been able to figure out the god-awful documentation of how to use the DePaul webspace.  In my Text and Image class, Michael Moore brought up the fact that the online directions are totally wrong and when he called IT Services there wasn’t much more help.  I may be able to temporarily use some webspace at work, which would be great since I really don’t want to drop any money on hosting before I absolutely have to.

NMS 520 - Project 2 Update
I&#8217;ll admit that I&#8217;m running a little behind on my own Project 2 timeline.  This may be obvious since I&#8217;m writing this blog post about 20 minutes before leaving for class, but the time I was going to set aside during lunch breaks and after work seems to have disappeared.  But hey, that&#8217;s life.
I&#8217;ve begun with a very rough sketch of my layout in Photoshop.  The plan is to use the Photoshop file as a guide when creating my HTML/CSS.  By arranging my elements in Photoshop first and using the rulers as guides, I can get a general sense of what size my divs will be and how all the elements will fit together.  Of course I won&#8217;t have any real idea of how it&#8217;s going to look out on the web until I start writing some code.  I also won&#8217;t have any idea of how different browsers are going to treat my code.
The basic design, which now lives in the relative safety of Photoshopland, is nothing earth shattering, but I wanted to start with something clean and simple, reminiscent of my page layouts in Intro to Graphic Design last quarter.  I think what I&#8217;ve sketched out above is enough of a start that I can move to Smultron and start bringing the blueprint to life.  I need to stay on top of this thing and write some code ASAP.

NMS 520 - Project 2 Update

I’ll admit that I’m running a little behind on my own Project 2 timeline.  This may be obvious since I’m writing this blog post about 20 minutes before leaving for class, but the time I was going to set aside during lunch breaks and after work seems to have disappeared.  But hey, that’s life.

I’ve begun with a very rough sketch of my layout in Photoshop.  The plan is to use the Photoshop file as a guide when creating my HTML/CSS.  By arranging my elements in Photoshop first and using the rulers as guides, I can get a general sense of what size my divs will be and how all the elements will fit together.  Of course I won’t have any real idea of how it’s going to look out on the web until I start writing some code.  I also won’t have any idea of how different browsers are going to treat my code.

The basic design, which now lives in the relative safety of Photoshopland, is nothing earth shattering, but I wanted to start with something clean and simple, reminiscent of my page layouts in Intro to Graphic Design last quarter.  I think what I’ve sketched out above is enough of a start that I can move to Smultron and start bringing the blueprint to life.  I need to stay on top of this thing and write some code ASAP.

NMS 520 - To Host Or Not To Host?

In preparing for Project 2, I have to consider what exactly I’m going to do with the project once this course is over, and more importantly, once I no longer have access to DePaul’s web space.  For this assignment, I intend to build an online portfolio for my work both within and outside of the NMS program.  I don’t have a super impressive portfolio yet, but for starters I’m going to include the print designs I created in Intro to Graphic Design as well as some of the websites I’ve worked on at my job.

I plan on purchasing a domain name immediately, but the question of where to host the site in the future is a tricky one.  If I use GoDaddy to secure the domain, I could also sign up for their “Best Value” hosing plan at $6.64/month.  This would be an easy option since all I’d have to do is upload the files to GoDaddy’s server without changing a thing.  But even though $6.64 doesn’t sound like much, it’s still a lot more than free.

If I want to opt for free hosting, I’m going to have to give up some control.  One option I’d like to explore is hosting my portfolio right here on tumblr.  This would require a bit of work up front, since I’d have to take my HTML/CSS design and somehow convert it into a tumblr theme.  I have no idea how to do this yet, but I’m sure it’s possible, and this could be a good project for me once school’s out for summer.  The one upside of hosting a site on tumblr is that after the initial grunt work of creating a theme, posting updates will be ridiculously simple.  I can add text, photo, audio, or video from any web connection in the world (and I’m pretty sure I can update via a web-enabled phone).  

A few examples of personal websites hosted on tumblr that have inspired me to host my own site here are azizisbored.com (comedian/actor Aziz Ansari), petewentz.com (Fall Out Boy bass player/mouthpiece Pete Wentz), and felldowntherabbithole.tumblr.com (Glee’s Diana Agron).  I figure if these Hollywood people (and their publicists) can do it, why can’t I?

NMS 520 - Personal Technology Toolkit

Present

Right now I’ve got a pretty good grasp of the basic concepts in HTML/CSS, but I’m not putting them into practice often enough to consider myself an expert.  I came to my current job thinking I’d have a chance to pick up some design and development experience, and while I’ve taken a few projects from Photoshop file to finished project, those experiences have been few and far between.  My work duties have been more on the business side of things lately, and I’m looking for whatever web projects I can get my hands dirty with some code.

Upcoming

In the projects for this class, I’m hoping to take my basic understanding of CSS and expand upon it to build a site that looks really “kickass” at first glance.  I’ve picked up the concepts of divs and positioning, etc., but I need to get out of my comfort zone by building something that doesn’t look like the standard run-of-the-mill small business website.

Future

I’ve got absolutely zero experience working with Flash, and I’ve heard that the NMS program’s Web Design II is focused completely on Flash.  Although some design purists might think the use of Flash on the web is an unneccessary distraction, the fact of the matter is that it’s out there and it’s being used.  If I want to have a well-rounded design portfolio, I’m going to have to prove that I know how to work with Flash.

Another area I’ve been looking to dive into is PHP.  A lot of my company’s development projects are written in PHP, and if I can get at least a working knowledge of the programming I’d like to transition my job function into more of a design/development guy than a business guy.  As I understand it, PHP is out of the scope of the NMS curriculum, so I’ll need to use an outside learning source like lynda.com to get myself started.

NMS 520 - Personal Web Footprint

After reviewing my name (joeandrukaitis) on namechk.com, I’ve come to the conclusion that there aren’t too many other Joe Andrukaitises out there on the internet.  Of the 145 web services listed, only 5 were taken.  I recognized Google, LinkedIn, and Tumblr as mine.  (I’m saving the joeandrukaitis Tumblr account for a creative portfolio once I actually have something to show off).  Curiously, my username was taken on Etsy and Kaboodle, but when I clicked through, I got one server error and one instance of “Sorry, that user doesn’t exist.”  I’m guessing that namechk.com isn’t 100% accurate all the time, but I still think it’s a good resource for helping people plant their personal flags on the web before somebody with the same name beats them to it.

When searching Google with my name, Joe Andrukaitis, my Twitter page is the first result.  This is somewhat comforting, because at least it’s me.  But it’s also a little disconcerting because that means I need to watch what I tweet about.  The result below that was a tweet from last week where I praised White Sox pitcher Mark Buehrle and ripped on my most hated sports franchise, the Chicago Cubs.  That’s innocent enough I guess, but a Cub-loving potential employer might not love it so much.

The next result is a Facebook account that is definitely not mine.  This is an older gentleman that nobody could confuse for me, but then again maybe I should be glad my Facebook doesn’t show up on the first page of results.

This reminds me of a time several years ago when some coworkers from the east coast found another Joe Andrukaitis on MySpace.  His location was listed as only “Illinois” and there was a very nondescript profile picture of a dark-haried twentysomething guy that could have passed for me.  That Joe liked to openly post about how much he loved using recreational drugs.  Evenutally the folks from our marketing group in PA realized it wasn’t me and we had a laugh about the whole crazy mix-up when we met for a conference.  But it’s scary to think this guy with the same uncommon name as me could have somehow led to me being fired for violating company drug policy.

I got fired for something completely unrelated.  But that’s another story for another time.