Dr. Kathryn Ibata-Arens
April 2022
Designing a Responsive Website to Highlight Academic Excellence and Increase Audience Reach
Web Design
CSS Front-End
Squarespace Web Development
Dr. Kathryn Ibata-Arens is a scholar of innovation and entrepreneurship, science and technology policy, and economic development. As she grows in popularity, the client desired to have a central platform where her work can be easily accessed. I designed a responsive website that would increase the client’s exposure towards her audience, thus, improving traffic flow, popularity and book sales.
My contributions to the project are listed on the left, and the tools used are detailed below.
Adobe Illustrator | Adobe Photoshop | Figma | Visual Studio Code | Squarespace | CSS
whatt’s cookin’
April 2022
Designing a Responsive Website to Highlight Academic Excellence and Increase Audience Reach
Web Design
CSS Front-End
Squarespace Web Development
Dr. Kathryn Ibata-Arens is a scholar of innovation and entrepreneurship, science and technology policy, and economic development. As she grows in popularity, the client desired to have a central platform where her work can be easily accessed. I designed a responsive website that would increase the client’s exposure towards her audience, thus, improving traffic flow, popularity and book sales.
My contributions to the project are listed on the left, and the tools used are detailed below.
Adobe Illustrator | Adobe Photoshop | Figma | Visual Studio Code | Squarespace | CSS
Discovery of data clustering tools and designing for scholars.
Challenges
• The client did not have a personal website to market publications and research tools.
• Centralising client’s work into one platform — a personal website — to extend audience reach.
Focus
• Minimal Design.
• Meaningful Concept.
• Responsive site for desktop and mobile.
How-Might-We
...increase the client’s exposure?
...market the client’s expertise and services?
...create smooth interface experience for the target audience?
Key Takeaway
Designing for public figures, such as authors and scholars, provides valuable insights into incorporating marketing components into personal websites. It highlighted the significance of thorough research of the market and presenting design decisions grounded in research findings to meet client expectations.
Discovery of data clustering tools and designing for scholars.
Challenges
• The client did not have a personal website to market publications and research tools.
• Centralising client’s work into one platform — a personal website — to extend audience reach.
Focus
• Minimal Design.
• Meaningful Concept.
• Responsive site for desktop and mobile.
How-Might-We
...increase the client’s exposure?
...market the client’s expertise and services?
...create smooth interface experience for the target audience?
Key Takeaway
Designing for public figures, such as authors and scholars, provides valuable insights into incorporating marketing components into personal websites. It highlighted the significance of thorough research of the market and presenting design decisions grounded in research findings to meet client expectations.
“While working with you, I’ve learnt how to make design decisions on how I want to present by virtual presence. I’ve never thought about it that way, but I have a good feeling your wonderful work will create some traction towards my website.”
- Dr. Kathryn Ibata-Arens | Award Winning Author
“While working with you, I’ve learnt how to make design decisions on how I want to present by virtual presence. I’ve never thought about it that way, but I have a good feeling your wonderful work will create some traction towards my website.”
- Dr. Kathryn Ibata-Arens | Award Winning Author
“While working with you, I’ve learnt how to make design decisions on how I want to present by virtual presence. I’ve never thought about it that way, but I have a good feeling your wonderful work will create some traction towards my website.”
- Dr. Kathryn Ibata-Arens | Award Winning Author
Scroll
Scroll
Introduction
Introduction
Introduction
Dr. Kathryn Ibata-Arens approached us with a task of helping her create a brand and web presence. With the release of her new book, she wanted to create a central platform where her audience could get to know her, purchase her published work and get closer insights to her professional life. We had a brainstorming session and decided that what she needed was a website. Next steps were research, wire-framing, brand development, web designing and finally the product launch.
Dr. Kathryn Ibata-Arens approached us with a task of helping her create a brand and web presence. With the release of her new book, she wanted to create a central platform where her audience could get to know her, purchase her published work and get closer insights to her professional life. We had a brainstorming session and decided that what she needed was a website. Next steps were research, wire-framing, brand development, web designing and finally the product launch.
Increased the audience engagement by more than 60% and reduced the bounce rate to 33%
Increased the audience engagement by more than 60% and reduced the bounce rate to 33%
Increased the audience engagement by more than 60% and reduced the bounce rate to 33%
-Web Analytics + Google Analytics
-Web Analytics + Google Analytics
Process
Process
Process
Information Architecture
Information Architecture
I created a user flow diagram to map out how feasible will the interaction be to the end users. One of the problems I had to formulate a solution for is how the interface would provide a smooth navigation to the user. I successfully included all necessary information in each page, while maintaining a marketing perspective the client was aiming to achieve.
I created a user flow diagram to map out how feasible will the interaction be to the end users. One of the problems I had to formulate a solution for is how the interface would provide a smooth navigation to the user. I successfully included all necessary information in each page, while maintaining a marketing perspective the client was aiming to achieve.
I created a user flow diagram to map out how feasible will the interaction be to the end users. One of the problems I had to formulate a solution for is how the interface would provide a smooth navigation to the user. I successfully included all necessary information in each page, while maintaining a marketing perspective the client was aiming to achieve.
Authors in Similar Genre
Authors in Similar Genre
A few authors within the same discipline as the client that inspired the website design choices.
A few authors within the same discipline as the client that inspired the website design choices.
A few authors within the same discipline as the client that inspired the website design choices.
Prototypes
Prototypes
Prototype iterations from low fidelity to high fidelity for desktop and mobile versions.
Prototype iterations from low fidelity to high fidelity for desktop and mobile versions.
Prototype iterations from low fidelity to high fidelity for desktop and mobile versions.
Low Fidelity
Low Fidelity
Mid Fidelity
Mid Fidelity
Additional Assets
Additional Assets
Other assets included in the website but not shown in the prototyping phase.
Other assets included in the website but not shown in the prototyping phase.
Other assets included in the website but not shown in the prototyping phase.
Full Screen Menu
Full Screen Menu
Calendar
Calendar
Takeaways
Takeaways
Takeaways
Additional User Testing
Additional User Testing
I worked with the client and her assistant to collect content for the website. I shared detailed explanations of the design direction at each prototyping phase. I sent the final Hi-Fi prototype to the client for testing and we shared it with other people for feedback. We learned that it is important to cast a wider net when looking for user testing participants. Due to time constraints, we could only test with a few users. Additional testing would have had a huge impact on the overall project.
I worked with the client and her assistant to collect content for the website. I shared detailed explanations of the design direction at each prototyping phase. I sent the final Hi-Fi prototype to the client for testing and we shared it with other people for feedback. We learned that it is important to cast a wider net when looking for user testing participants. Due to time constraints, we could only test with a few users. Additional testing would have had a huge impact on the overall project.
I worked with the client and her assistant to collect content for the website. I shared detailed explanations of the design direction at each prototyping phase. I sent the final Hi-Fi prototype to the client for testing and we shared it with other people for feedback. We learned that it is important to cast a wider net when looking for user testing participants. Due to time constraints, we could only test with a few users. Additional testing would have had a huge impact on the overall project.
Extensive research on Specific Genres
Extensive research on Specific Genres
This project turned out to be a learning experience when it came to designing for public figures such as authors in this case. From my experience, personal websites do not have a marketing component to it, which is quite contrary to how authors want their personal websites to be. From this I learned how to do extensive research on authors, how they structured their websites, use of CTA and overall marketing language. My ability to present design decisions which were supported from findings in my research was highly appreciated by the client.
This project turned out to be a learning experience when it came to designing for public figures such as authors in this case. From my experience, personal websites do not have a marketing component to it, which is quite contrary to how authors want their personal websites to be. From this I learned how to do extensive research on authors, how they structured their websites, use of CTA and overall marketing language. My ability to present design decisions which were supported from findings in my research was highly appreciated by the client.
This project turned out to be a learning experience when it came to designing for public figures such as authors in this case. From my experience, personal websites do not have a marketing component to it, which is quite contrary to how authors want their personal websites to be. From this I learned how to do extensive research on authors, how they structured their websites, use of CTA and overall marketing language. My ability to present design decisions which were supported from findings in my research was highly appreciated by the client.
Collaboration with other developers
Collaboration with other developers
I was responsible for both UX/UI design and front-end development for this project. It was challenging, but I managed to get the client's approval by creating multiple iterations and prototypes. I had to use basic templates and custom CSS code to build the website within the allocated time. If I had more time, I would have outsourced the front-end development so I could focus on UX/UI.
I was responsible for both UX/UI design and front-end development for this project. It was challenging, but I managed to get the client's approval by creating multiple iterations and prototypes. I had to use basic templates and custom CSS code to build the website within the allocated time. If I had more time, I would have outsourced the front-end development so I could focus on UX/UI.
I was responsible for both UX/UI design and front-end development for this project. It was challenging, but I managed to get the client's approval by creating multiple iterations and prototypes. I had to use basic templates and custom CSS code to build the website within the allocated time. If I had more time, I would have outsourced the front-end development so I could focus on UX/UI.