DESIGN MEDIA ARTS UCLA Department of Deisgn Media Arts UCLA UCLArts Art Sci EDA DMA Labs Support Website Credits

Transcription

1 LINDSAY HARVEY DMA SITE DESIGN STUDENT PORTAL Announcements Lectures Exhibitons FALCULTY HIGHLIGHT DMA FEEDS DMA MAIL LIST 2009 Department of Deisgn Media Arts rts Art Sci EDA DMA Labs Support Website Credits

2 DMA SITE DESIGN #1 For the first design for the DMA site, I decided to stick pretty close to my original wireframe. One of the major differences is the placement of the student portal to be a bit smaller in order to fit more events in and still have a place of prominance on the page. I also have name the student portal port 22, the port we have to use to connect to the server from outside the labs. The pink color comes from the current dma site which I thought would be a good color choice in order to tie the 2 sites together. The gallery section is designed so that when the user mouses over a thumbnail of a gallery picture, the project name and student s name will pop up in a white box from below. The gallery pictures will be selected randomly just like the current site. The events section will also function quite closely to the current one as users will be able to see current and upcoming events and subscribe to the feeds. I ve also added a faculty and student highlight to further personalize the site and give users a quick introduction to one of our faculty members and one student; these will also cycle randomly like the gallery so that it is different each time a user visits the site. Overall, the site has a very clean and simple layout that is very user friendly and has most of the information or links to the information that users could possibly want.

3 DMA SITE DESIGN #1 PORT 22 Student Portal dma feeds GRAD Project name Person name UNDERGRAD Event 1 FALCULTY Event 2 FACULTY HIGHLIGHT Faculty name Event 3 Student name Event 4 announcements lectures exhibitons mail list rts Art Sci EDA DMA Labs Support Website Credits 2009 Department of Deisgn Media Arts

4 DMA SITE DESIGN #2 For the second design for the DMA site, I again stuck pretty close to my original wireframe and implemented much of the same design choices as I did in the first design. In this design, I wanted it to look a bit more complex than the previous simple design, so I created a lined background in white and gray and then used inner drop shadows to create a sort of inset field to all of the boxes as if they were cut out of the previous layer. Again, I wanted to make the student portal button stand out, so I gave it pink box and left it at the top right underneath the main title. The gallery also works a tiny bit different in that the project and student information now pops up from the bottom right hand corner to look as if it s emerging from the pervious layer. I think that overall the site still holds its simplicity but has a more complex feel to it and makes the user want to interact with it and find out more information.

5 DMA SITE DESIGN #2 PORT 22 Student Portal dma feeds GRAD Project name Person name UNDERGRAD Event 1 FALCULTY Event 2 FACULTY HIGHLIGHT Faculty name Event 3 Student name Event 4 announcements lectures exhibitons mail list rts Art Sci EDA DMA Labs Support Website Credits 2009 Department of Deisgn Media Arts