Wednesday, 15 December 2010

Group work and final reflection

Date: 10th December 2010

This was the last group work before everyone going on holiday, and before handing-in the assignment. But this is the first time we work together at the same time, as this was a tutorial class. Usually work is done in different times depending on individual personal schedule and availability, and because we only meet up to decided how to divide the work between us.

First, and before getting into details of our last group work, I thought I wrap up in a nutshell how we progressed from a simple idea to a working website, in my opinion. Since I joined late, I had absolutely no idea about the work that's been done before I joined the group, but from our first meeting, I understood that they have made a couple of interviews (users, librarians, etc), and based on these interviews, they have created their user characteristics, profiles, and personas. I was able to help in creating the personas, since I joined at the same time they started working on it. And I have to admit, I wasn't very confident about what I was doing even though I have done this twice in my undergraduate, but probably because I was reserved because I'm around a group of people I have never worked with before. So at the beginning, my participation was very limited, but little by little, I got confident enough to talk, suggest ideas, and offer alternative solutions to problems we faced. That's happened when I started working on the user journeys for Maria and Sophie, the two personas I was assigned to work on. Then I've created the task model, or the site map, for our website using OmniGraffle, which I found easy to use after a couple of trials and errors. This task model, helped us to visualize how the website is going to look like, which we started working on in creating the wireframes, but since we thought we were running a little bit behind schedule, we finished the important wireframes as much as possible, depending on our user journeys, so I can start coding for these page while the rest of the wireframes get done.

Now, and going back to my main point, the last group work, I never thought a group work on designing a website could be very challenging, because we're all working on the same CSS file, so whenever someone decided to add new styles to it, everyone had to wait, or work on something else until that person is finished so we can all download locally the latest version of it, this way, we don't mess up the website, or start mixing up pages and styles. I have to admit, I was the first to fall in this mistake, as I started editing and adding new styles to the CSS file without notifying the rest of the group, which led some of the group member to either redo what they have done all over again, or, and since it was my mistake, I had to copy their work in the notepad application, download the latest CSS file, and paste it back again. This happened because it was the first time to work all together at the same time. But after that, everything worked fine, and whenever any member wanted to make new changes, we first ask if anyone is making changes at the same time to the same file, and if so, the most important one gets done first, then the next, and so on.

A couple of days back, Rosa suggested having a tab navigation at the top with the website's services, giving users the ability to move from one service to another without having to go back to the main page, which I got around doing perfectly, and we all agreed that they are fitted in the best place, but what I didn't do is styling those tabs with colors representing each with the service color we already agreed on before. That's the mistake I did while working on this project, moving from one thing to another without finishing the first thing. So, since everyone was already working on the rest of the pages we didn't get around doing, I thought I should take this opportunity to finally do that. At first I was confused and wasn't actually thinking outside the box, since those tabs are made in a "ul" list, and this list is style in a certain way, I wasn't sure how am I going to assign each item in the list a different color. First thing that came to my head was creating a div class for each item, and after Cath confirming that this is the way to do it, I tried working on this, but didn't give the results I was hoping for, to be honest it didn't give any results at all. Then Cath suggested I should assign each item a different ID class, which was possible to do, since the tab navigation I created had an ID class called "selected" for which when the tab is the current opened page. I did that, and it worked perfectly in the page I was testing on, but the trick was to actually implement this to the rest of the website, without disturbing my group members, and without having them to stop their work just so I can do this. First I made sure no body made any changes to the CSS file except me, so I uploaded my version, the latest one, to the server. Next, I had to make sure no body is working on the old pages we've already done before, but thankfully they've all creating new pages, so this was easy too. I implemented the new tab navigation to all the pages, and waited for them to finish the new pages they are working on to amend them as well.

After finishing this, I remembered I faced a problem before with one of the pages that has a search option and a detailed search option that the JavaScript wasn't working correctly. First I'll explain the purpose of this. The user has two options, a normal simple search, which includes the input field and the search button, another option is to click on "detailed search" to give him more options to define that search without having him to move to a different page. That was done using JavaScript that I was able to get from this website and this website. Now, the problem I was facing, was the link for "detailed search" has to be clicked twice at the first time the page is loaded for the options to show up, and this is not we had in our head to have. It was supposed to be done in a single click, and another single click to hide the options. When I asked Cath, she said that she's not very familiar with JavaScript, which wasn't the answer I was hoping to hear, But when I explained exactly to her what's happening, she suggested that I take another look at the JavaScript and make sure that the code is not mixed up, as she said it must be because the div class that's holding the hide-able content is actually hidden at first, and the first click is just doing the "hide" option again, and the second click is getting the code back on track to show it. I took a look at the code, and she was right, that was exactly what was happening. The div class is already hidden at first, and the code has an "if - statement", which is saying, in natural English: "If the content is set to hide, then change it to hide, otherwise change it to show", a simple but fatal mistake, in my opinion. This was fixed easily in the JavaScript file without making any changes to any page or the CSS file.

Another problem we faced that day, was that James PC when uploading pages to the server, it was uploading to a different folder than "public_html" which is the main folder we all are uploading to. So I had to work the Dreamweaver ftp to fix this up. First thing I did was editing the settings for the ftp and make it directly upload to the "public_html" folder and only there. Then I decided to take an easier step, and delete our pages from anywhere on the server except in that folder, since I was sure I already have the latest files stored locally on two different PCs, But here is when I made a mistake as that folder has been created twice for some reason I don't know what, one inside the other, and I deleted the main one, then when I refreshed thinking it's gone, I found it there again so I deleted it again and this was the mistake as the second delete was actually happening in the main "public_html" folder, I didn't realize that until I opened the website and I found it giving me an error which then made me realize that everything is gone, I was scared, and actually paranoid for a little bit, but I tried as much as I can not to show it, because I know that the group depends entirely on me when it comes to the website, so what I did next was upload the files stored locally on my PC to the server, then got back to James’s PC and downloaded those files locally, and uploaded the new ones he made back to the server. But it didn't go perfectly as planned, as one of the pages was there, but the style sheet for it in the CSS file wasn't there, but I guess getting out with one file missing after this whole scenario is not a big problem, all we had to do was to write the style for it again, and thankfully it wasn't a very long one, and everything went back to normal. But this experience made me realize not to always act and the first assumptions I make when encountering similar or even different problems, I should always study the situation from different angles and try to tackle it in a smart way, one thing I did right was actually having local copy, a backup, stored on several machines, and I have also learned this the hard way but from past experience with different projects.

The rest of the day, I dedicated my time helping the rest of the group finishing the last pages, and explaining to them if I did something different and why I did, this way they can learn and practice more, as I'm sure they wanted that. But most of the work they were working on, they have done it themselves with very little help from my side, and I'm definitely sure they have learned a lot from this project, because I'm sure I did.

Even though my part of the work in this project was focused more on the website rather than the other stuff, but I guess this is the benefit of a group work. The work gets divided naturally between members depending on their experience and strong points, and then each member explains what they have done why they did it this way to the rest of the group, to learn. I was more focused on the website and the coding and I helped them in doing it themselves.

I was confident enough from the beginning that we are going to finish everything in time, I had no doubts, even though we were a little bit behind schedule, my only concern was am I going to learn anything from this or not, which I'm it was answered clearly from the blogs. Even though the website is marked 20%, I still wanted it to be as perfect as possible, that's why I dedicated my time and effort on it, I'm sure I would've done a far better job if I had the time to, as I still think that it needs a lot more to get it to the level we imagined it. Perhaps more graphics, making it usable by people of all abilities and disabilities, or integrate libraries websites and functionalities within this website. There is always a place for improvement, but for this website, as a project for a module in a course, I'm still satisfied with the outcome, either visible like this, the website, the documentation, or invisible like the experience and the self-improvement we all got.

No comments:

Post a Comment