{"id":681,"date":"2021-01-03T19:46:38","date_gmt":"2021-01-03T18:46:38","guid":{"rendered":"https:\/\/nikoripka.de\/?p=681"},"modified":"2025-01-31T20:31:01","modified_gmt":"2025-01-31T19:31:01","slug":"fhp-website-redesign","status":"publish","type":"post","link":"https:\/\/nikoripka.de\/en\/fhp-website-redesign\/","title":{"rendered":"UAS Potsdam website"},"content":{"rendered":"
\n\n\n\n
\n
\n
\n
    \n
  • <\/li>\n
  • <\/li>\n
  • <\/li>\n
  • <\/li>\n
  • <\/li>\n
  • <\/li>\n <\/ul>\n <\/div>\n \n <\/div>\n<\/div><\/div>\n\n\n\n

    It\u2019s 1997 and the IT department of the University of Applied Sciences Potsdam publishes its first website. Over the following years, the University grows and flourishes with more students and courses. This is accom\u00adpanied by more content, more contri\u00adbu\u00adtions, more people and a chaotic system of hundreds of sub-pages. Appli\u00adcants, professors, students, resear\u00adchers \u2013 everyone wants to be understood. In the process, the big picture is lost from sight. 22 years later, 14 students in a UX seminar set out to bring order to the chaos. A website redesign.<\/p>\n\n\n\n

    The analysis of the existing website and the target groups took place together. After that, the groups separated and produced four different concept and design drafts with the help of the insights we had gathered together. During that time we still worked together as a group and gave each other regular feedback.<\/p>\n\n\n\n

    Analysis & target groups<\/h2>\n\n\n\n

    One of the first steps in the analysis was to break down the current infor\u00admation structure of the main navigation. In order to have a compa\u00adrison to other insti\u00adtutes, a compe\u00adtitor analysis was also made and the websites of other univer\u00adsities were analysed. At the same time, a large number of examinees on campus were asked about their experience with the university website during their quali\u00adfying exami\u00adnation at the Department of Design.<\/p>\n\n\n\n

    Two target groups were defined: internal and external visitors. Internal visitors are university members who know their way around and know what they are looking for. External visitors, on the other hand, want to get an impression of the university; they are not helped by a quick search, because they do not know what they are looking for.<\/p>\n\n\n\n

    Infor\u00admation architecture<\/h2>\n\n\n\n

    The current FH website attempts to divide the content into six main categories\/actions: Infor\u00admation, studies, teaching, training, research<\/em> and coope\u00adration<\/em>. These categories are further divided into up to four sub-levels. Things get even trickier if the desired content cannot be clearly assigned to a category, if pages are found in several categories or if the same content appears in several pages.<\/p>\n\n\n\n

    First, we reorga\u00adnised all the top pages. Then we defined four new main categories: studies, research, teaching<\/em> and university<\/em>All pages can be found under these categories; there are no further levels. Instead, they are only grouped, which helps to avoid a confusing and deep structure. With one click on the main category, visitors can see all sub-pages at once.<\/p>\n\n\n\n

    \n
    \n
    \n
      \n
    • <\/li>\n
    • <\/li>\n <\/ul>\n <\/div>\n \n <\/div>\n<\/div><\/div>\n\n\n\n

      Data types & filters<\/h2>\n\n\n\n

      We defined ten data types: News, events, people, projects, downloads, jobs and intern\u00adships, study programmes, courses, workshops & labs<\/em> and rooms<\/em>. Each data type has its own overview page. When users call up these overviews, they see all the existing data. The data displayed can then be reduced or sorted using filters.<\/p>\n\n\n\n

      Style guide<\/h2>\n\n\n\n

      When choosing the colours, we aimed to stay close to the corporate design of the UAS Potsdam. In order to create a better colour harmony with the images used on the website, we used the surrounding colours of the main building as colour inspi\u00adration. This includes blue and blue-green tones caused by the reflec\u00adtions in the glass of the buildings. For the typeface, we used the official font of the University: FHP Sun by LucasFonts.<\/p>\n\n\n\n<\/div>\n