Addressing Needs

After deciding on which target audience to explore we then had to look at the problems and needs we’d be facing, things like having a website that would work under different screen sizes as well as different browsers was a challenge but then we later found out that all of this could be achieved using the bootstrap CSS classes that work like columns that adjust to the browsers size as well as the screen size:


Click on this image for full ‘Scaffolding’ documentation.

Everything readjusts and falls into the right place no matter how big or small the browser/device is. This includes everything, from the body elements to the navigation elements, everything:

scaffolding-preview-max-width scaffolding-preview-min-width scaffolding-preview-min-width-with-nav

Thank the heavens for bootstrap and the people that made it!. With this issues out of the way we then moved on to other things.

We were aiming our product at students also so the styling of the website had to be fresh and modern, luckily bootstrap has some nice buttons, search bars, drop-down menus and colour palettes (colours on premade nav-bars) so to an extent that was covered too.


Target Audience and Similar Applications

The target audience for our web app will be students and more specifically graduates or any person starting out in the field of Digital Media Design. As a group we thought about which applications are used the most for project sharing as well as image sharing and we determined that we’d follow a few of their design principles and some traits of their aesthetics, we looked at different front-end development frameworks and decided that we’d use Bootstrap as it was the most documented and popular which meant wider access to tutorials and learning resources online :


We however also looked at Kickstart, It’s libraries are smaller than bootstrap’s and page loading times are faster due to the absence of any Jquery. It’s also open source and Resposive:


After deciding on which Front-end framework to use we then had to look for inspiration by looking at similar sites and deciding what makes people click when they browse them, so we did that we looked at Behance and Pinterest and determined that it was a combination of things, amongst these were the choice to choose what to look at by selecting specific categories and boxes, they also had the big canvas of images live-feeding into the site every thirty seconds and a bunch of fancy animation hover effects as well as fade away effects. Branding also played a big role and so did the colours and the icons.


Behance is very complex and in-depth with a lot of detail and fulfils their criteria for their target audience.


Pinterest is very intuitive and simple and works much like a post it note on a fridge door. Serves as a reminder whilst also managing to fulfil a second purpose as inspiration for those people that are involved in crafts such as graphic design and interior design.

Identifying and Conceptualising social needs

After much thinking and research our group finally came up with some possible concepts for our much needed app, we discussed things like equality on social apps and hierarchy as well as different audiences and what made these people like the sites they browsed everyday.

We agreed that we needed something, not necessarily new or breathtaking but rather something that could really help a specific group of people achieve a specific goal, that’s when we came up with the Idea of Baffled. It’s not only meant to be a site where everyone can share their projects but rather a site where students and only students can upload and share with the world their most precious projects. This gives graduates and mature students a fair chance to compete with other like-minded peers of a similar skill level for a chance to get a much needed job and a kickstart for their careers. Employers would pay us (Baffled) for advertisements and students wouldn’t ever have to spend a penny on monthly subscriptions or annoying startup costs.

Sites like behance are already very popular as they execute this concept very well and they tick most of the boxes, however there is just too much competition and all the expert’s work gets all the spotlight which means that new people entering the field or graphic design graudates etc never get noticed because they’re either new or not as good which then in turn means that they will very unlikely get the job over the expert/veteran/senior.

With all this in mind there were still other things that needed to be discussed, things like how the site would look like and what features it would have as well as how long this would all take to make. All these things were important, next week our group is meeting up again to decide for sure which target audience we’ll follow and why.

First Meeting

Team GASC emerges from the depths of BU!. (Giancarlo, Abraham, Stephanie and connor)

A few days ago we had our first meeting where we discussed key areas of the project, the whole process went smoothly and the group agreed on an Idea.

We went over things like setting up our GitHub repositories which I created, we decided on an Idea, we came up with a group name which I called baffled! and we planned the layout of our site.

The Idea I came up with was a more dimmed down version of Behance that only targets a specific demographic: STUDENTS!. A lot of people graduate and have a hard time trying to find jobs and employers be it full timers or freelancers everyone at some point wants to show the world how good they are and why they should get hired over their peer. That’s when Baffled! came in, the idea consists of a live-update/live-feed canvas or homepage that shows the most rated work, the editors choice of the week as well as the work that’s recently trending. Students will be able to submit their latest work and future employers as well as teachers and other users can view, comment and click on Baffled! (our version of ‘like’) to further promote the work and inspire the author to create more. Baffled! is about discovering new work, new hidden gems and promoting it through social networks or the site itself, it is a canvas for exploration. The aim of this project is to give newcomers a better chance at finding a job, pros will always get hired but new graduates will always have a hard time.

Today I also made a quick mock-up version of our about page so as to get an idea of layout and object placement:

about us

Overall it was a great meeting and we discussed a lot of things I am looking forward to finalising the project.

Centralised Databases and Social Tools

To further understand what Centralised databases are and how they are used in social networks as well as what they do I went on the web to so some research and this is what I found:

I found out that centralised databases are basically big libraries of information located at one static location that can be accessed from numerous points or areas, this works very much oppositely to distributed database frameworks where all the information is spread out to multiple platforms or websites.

These databases can be set up with multiple programming languages however some languages are preferred over others as they are better suited to work with queries. Database query languages work by looking and giving factual answers to factual questions whereas information retrieval query languages look for information relevant to a specific inquiry. Some examples of query languages are :

  • Contextual Query Language (CQL) – Information Retrieval Language
  • Structured Query Language (SQL) – Data Manipulation Language
  • Datalog – Deductive Databases
  • Data Mining Extensions (DMX) – Data Mining

Pros and Cons of Centralised Databases:

  • Access to all information from a single point.
  • Centralised Database search results are a lot faster (Search engine only needs to look at one location for answers).
  • Extra servers can be added at any time and easily to handle more information.
  • A lot easier to protect from cyber threats such as sabotages and data theft.


  • Limited amount of people can use it at one point.
  • Loss of data if not backed-up correctly and frequently.
  • Distributed Databases work even if a specific database is down, on the other hand centralised databases wont work at all if the (only) database is down.

Centralised databases are great for social sites as they can store peoples identities, pictures and other info into one main index that can then be accessed by every user through a search bar. This bring us to our website, today I discussed with my group my Idea of a picture library that resembles that of a site named Behance, people will be able to upload their work and share it with the world for other people to see things like: illustrations, photos, artwork, etc using a PHP form that will in turn be linked to a mySQL database. The form will have details such as whos the owner of the picture, when it was uploaded, it’s size and its location. Therefore when people want to see said image they just need to find it on the search bar, type it’s name, this will then in turn trigger the form and return the image with all the details such as it’s author, it’s size and it’s location. The possibilities are endless, more fields such as ‘which software was used to create this’ could be added to the form among other things.


What Is a Centralized Database?. 2015. What Is a Centralized Database?. [ONLINE] Available at: [Accessed 22 February 2015].

Why Should You Have a Centralized System? | Effective Database Management. 2015. Why Should You Have a Centralized System? | Effective Database Management. [ONLINE] Available at: [Accessed 22 February 2015].

Brainstorming and Initial Ideas

Here is a brainstorm of some of our initial ideas:

Brainstorm for Web App

Our group got together and we started discussing what could possibly be made and what couldn’t, we went through recipe sites that needed a database full of recipes that would then be classified by origin, season and time of the day. This however turned out to be too complicated to code so we decided on a simpler idea: the photo gallery, we did some research and started writing down what was needed to make the site. We agreed that we needed a login form in PHP preferably, another form for the upload procedure, we needed to style the site so that it would work on all devices for this we came across this library in css called bootstrap that belongs to TWITTER, this seemed to have solved the issue of ‘Responsive Design’, the rest of the meeting was pretty much about finding ways to work out how to make a search bar that was both accurate and fast.

Other topics that still needed to be discussed:

  • Who would do the branding and CSS.
  • Who would have to do the market research/Demographic Research.
  • Who had to make the wiki.
  • Who would make the repository etc.

Organizing My Blog

In order to make my blog more proffesional looking I had to change and add a few things:

  • Resize all the images to their max size
  • Add a categories widget
  • Add a calendar widget – this would track all my posts according to date
  • Add tags to my posts as well as categories

new blog widgets

I added a new widget to the Blog that includes a calendar as well as a category dropdown menu.

calendar widget

The calendar can be used to look for posts that were submitted on specific dates.

category widget

After I spent a long time categorising and tagging posts I added a category widget that allows users to look for specific subject-specific posts.

I also created a template on photoshop with a default size of 735px. Other things too keep in mind would be:

  • Remember to list things in bullet points
  • Keep images to a set size
  • Make sure to tag all your posts
  • Embed all videos on my blog using the embed or iFrame code
  • Write all posts on html

This system will ensure I get a more professional and effective blog that’s easy to navigate and read.