Prompted by Adrianne
Overview
Prompted by Adrianne is my AI-focused portfolio and writing space, built to document prompt engineering, workflow experiments, and reflections on how people can use generative AI more thoughtfully. Rather than treating AI as a novelty or a shortcut, I wanted the site to function as a place where experimentation, strategy, and human judgment all come together.
The Goal
- Create a dedicated home for my AI-related work and prompt engineering projects
- Document experiments, workflows, and case studies in a way that feels clear and useful
- Build a portfolio that reflects both practical AI use and a human-centered, ethical perspective
Context
As I spent more time learning about generative AI, I realized I needed a separate space for the kinds of projects and ideas that did not fully fit into my coding or data portfolios. Prompted by Adrianne became that space.
This project also represents several firsts for me: it was my first time building a site using Hugo, working with Tailwind CSS in a real project, using cloud hosting through Netlify, and incorporating AI-assisted guidance as part of my workflow.
Choosing Hugo was also a deliberate shift away from the CMS workflow I had been more familiar with through WordPress. Instead of managing themes, plugins, and a backend, I wanted to understand how a static site generator works more directly and how much of the site I could control through files, templates, and content structure.
It exists to document how I use AI in real workflows, how I think about prompting as both a technical and creative skill, and how I approach AI critically rather than blindly. The site is also part of my broader multi-site ecosystem, giving AI work its own focused identity while still connecting to my other portfolios.
What I Built
- A dedicated portfolio site for prompt engineering, AI experiments, and workflow documentation
- A homepage that introduces the purpose and tone of the project
- A structure for future case studies, prompt notes, experiments, and ethical AI reflections
Design Direction
The visual direction of Prompted by Adrianne intentionally moves away from cold, robotic AI aesthetics. Instead of presenting AI as monotone or purely mechanical, I wanted the site to feel personal, playful, and human-centered.
The pastel palette and kawaii visual language reflect both my own design preferences and the personality of my AI guide. Elements such as draggable stickers help the site feel more interactive and expressive, reinforcing the idea that AI tools do not have to feel sterile or impersonal. They can be shaped by the people who use them.
The sticker elements are also part of this experimentation. Most of the stickers were generated with AI assistance, while I also created one myself. This mix reflects how I am exploring generative AI as a creative tool rather than a replacement for original work. I wanted to see whether AI could produce “original-feeling” visuals without directly copying existing artwork, while still maintaining a consistent, kawaii-inspired style across the site.
This project was also part of my early experimentation with “vibe coding.” At the time, I wanted to see how far I could take that process and whether I could translate a very specific visual idea in my head into a functioning website.
The design also reflects the learning process behind the build. Since I was still new to Hugo, Tailwind CSS, and static-site workflows, I used ChatGPT as a guide throughout the process. Not only to help generate ideas, but also to explain layout decisions, Tailwind utility classes, and why certain parts of the site were structured the way they were.
- The layout supports both project-based content and reflective writing without feeling too formal
- The pastel and kawaii styling makes AI feel more approachable and less intimidating
- Interactive elements such as stickers add personality and reinforce the site’s playful identity
- The overall vibe is closer to a creative prompt lab than a corporate AI landing page
Tech Stack
- Hugo — used to generate a fast static site for long-form writing, portfolio pages, and project documentation. I chose it over WordPress because I wanted to learn a more lightweight, file-based workflow without relying on a traditional CMS backend.
- Tailwind CSS — used to build the layout and UI quickly using utility-first styling while learning a new CSS workflow. I chose Tailwind over frameworks like Bootstrap or Bulma because I wanted more direct control over styling decisions instead of starting from a predefined component look.
- Custom CSS — used to extend and refine the visual identity beyond Tailwind utilities, especially for the more playful and personality-driven elements of the site.
- Netlify — used for cloud hosting and deployment of the site. Although I already had hosting through Hosting.com, Netlify made more sense for static-site workflows because it handled deployment from the repository more cleanly than a traditional hosting setup.
Challenges
- Defining the site as an AI portfolio rather than a generic blog or news-style AI site
- Balancing experimentation with a more serious, human-centered perspective on AI
- Organizing content in a way that can support case studies, prompt notes, and reflections without feeling scattered
- Learning several new workflows at once, including Hugo, Tailwind CSS, and Netlify-based deployment
- Deciding when it made more sense to move away from familiar tools like WordPress and traditional hosting in order to support a static-site workflow
Solutions
I approached the site as a portfolio and documentation space first, rather than as a stream of disconnected AI posts. This helped me shape the structure around projects, workflows, and reflections instead of trying to cover every AI trend.
I also focused on keeping the design readable and intentional so the site could support different kinds of content, from practical prompt experiments to more critical writing about ethical AI. That balance helped the site feel both personal and purposeful.
Part of the solution was accepting that this project needed to function as a learning environment as much as a portfolio piece. Instead of defaulting to WordPress and traditional hosting, I intentionally used Hugo and Netlify so I could better understand static-site workflows from the ground up. I also chose Tailwind CSS over more opinionated CSS frameworks because I wanted to experiment more freely and learn how utility-based styling could support a highly specific visual direction.
What I Learned
- AI portfolios are stronger when they document real workflows instead of only abstract ideas
- Prompt engineering is easier to communicate when it is tied to actual use cases and outcomes
- A clear point of view is important in AI work, especially when balancing experimentation with ethics
- Building real projects is one of the best ways to learn new tools like Hugo, Tailwind CSS, and cloud hosting platforms
- Choosing unfamiliar tools can be worthwhile when the goal is not just to ship a site, but to understand a new workflow more deeply
What I’d Improve Next
- Add more full case studies based on prompt experiments and workflow breakdowns
- Refine how prompt notes, case studies, and reflections are organized as the site grows
- Expand the site’s visual system so it can support more experimental content without losing structure