Dev Attack! “Web!”

So I have decided to wrap my Android development and my Web development up into Dev Attack. As it makes perfect sense to me. I’m still constantly learning web development, so there is no point in neglecting that portion also! Plus I have be wanting to write about all the cool crazy things that have to do with web development!

Anyway lets get into it!

It has been a long time since the last post (for good reason mind you!). I have been travelling around, learning new things and I have kind of stepped away from android development (still learning though). My agenda has been focused on making web sites. Right now I’m working on a site for fellow co-host Chris, he wants to branch out on his own in massage therapy. When I heard that, I offered my assistants free of charge!

Doing this project has really opened my eyes on how the development process works. In that process I had to change up my work flow. I guess I’ll start with that since it actually was something hard for me to grasp. Even though I have done it with writing…

Mind Maps!

I never thought about creating mind maps for websites. It was just something I glossed over. But as I asked around my fellow developers, I was advised to. And so I set out on creating a mind map for his site. I started out with a typical question “What type of site?” Followed by: “Who is the owner and what features the owner would want?”, parallel to that was “Who is the audience and what features do they want?”. I ask these questions because as a developer/designer you need to have empathy to create for others.

Opposite to those are the answers:

Type of site? Basically a portfolio site.
The owner and audience? Chris is the owner and the audience is future clients

Then I went ahead and filled out what Chris and a Client would like to see on the site. From there I headed to Trello, made an account and started organizing what I had in my mind map.

Chris's Mind Map
My thought process

Staying Organized!

I use mind maps to spit ball my ideas then use Trello to solidify these ideas. I made five categories: Ideas/Features, Design, Development, QA, and Complete. I break down what I had in my mind maps, push them into Ideas/Features. Finally appoint them to whatever stage they are in.

Using Trello
Using Trello

Mockups!

Now to the fun part, visualizing the site! For now I use the good old method of pencil and paper. Recently got photoshop, but learning that in it’s self will take awhile. So for now I’ll stick to pencil and paper. I sketched out a few ideas but I was struck by one in particular and immediately starting coding.

Lets Code!

Of course being more developer than designer this is my favorite part. Here I had my sketch book by my side and I was ready. But nothing came to me, had sublime open with tabs for my HTML and CSS, then I realized I had no idea how to make a single page website. So I headed off to the internet and came back with Jekyll! Jekyll is Ruby framework, which is used to build static sites. Never do I have to worry about databases! Of course Jekyll wasn’t made for Windows, so I had to find workarounds and when I finally got it working (12am…), I created the basic layout the following days.

code chris

And that’s it! I’m in the coding stage still. My goal is to have the site up end of this week. You can check this out to see what I have as the layout so far (I’m far ahead of this version).

Go give someone a dollar! – Randy

Comment

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s