Modern design thinking has evolved beyond a traditional problem-solving framework to become a strategic approach that helps organizations tackle complex business, customer, and technological challenges. Today, design thinking combines empathy, research, experimentation, and collaboration to create solutions that are not only desirable for users but also viable for businesses and feasible to implement. As organizations face increasing uncertainty and rapidly changing customer expectations, design thinking provides a structured way to identify problems, understand customer needs, and generate innovative solutions. By focusing on real human experiences and continuously testing ideas, businesses can reduce risk, improve customer satisfaction, and develop products and services that create meaningful value.
A new edge to design thinking
Luke Burroughs looks into using Adobe Reflow within responsive web design.
When responsive design was first coined by Ethan Marcotte and hit the digital sphere, it became harder and harder for designers to follow our existing, pre-conceived ideas of pixel-perfect design.
Our processes and thinking when it came to building designs for the web were changing and they were changing rapidly.
Aaron Shekey, a product designer at GitHub and musician from Minneapolis, is well known for his development of a new addition to Adobe’s suite of products. A tool to bridge the relationship between developers and designers alike. He named it: Edge Reflow. It was born from one problem, that many designers were encountering as design for web was changing.
The Idea
How in Adobe’s suite of tools is there no notion of a fluid canvas, one that could adapt to different devices and screen sizes?
We wanted to build a design tool that didn’t coddle ex-print designers. We weren’t building the next Dreamweaver or Muse. This is a design surface true to its medium. CSS selectors replace layer styles. Web-based font services replace unruly lists of local typefaces. Edge Reflow is a tool whose canvas is the web, with all its peculiarities
So what is Edge Reflow?
Edge Reflow is the latest from Adobe’s Creative suite and it is built specifically to address how responsive design changes over multiple web flows. Reflow takes static PSD files and adds a new layer of responsiveness and flexibility to them, but not just that, it challenges the way we think and perceive design for the web.
At the outset of a project, one the of the nightmares of creating new work is the dawning realization that I have to make twenty individual Photoshop files, one for each device and screen size. Reflow cuts out this speed hump allowing customisable breakpoints that bend and adapt a static file into outputted CSS and HTML, allowing a visual way to morph designs for multiple devices in multiple sizes.
How Does It fit Into the Process?
Edge Reflow works a lot like Adobe InDesign. Layouts are made up of a series of links, which can be populated directly through Photoshop and adjusted with web-based rules and restrictions. Moving elements around in Reflow is restricted and governed by the rules of the web, primarily HTML and CSS. For example, a lot of its behaviour follows absolute or relative positioning, z-indexes, and code based terminology that Photoshop just doesn’t address. Reflow provides a web-friendly fail-safe to any design, ensuring that what is created, has an output that is technically feasible.
Multiple Canvasses in one program
There are a number of ways to start a responsive design in Edge Reflow. The first port of call is to setup the page with the screen sizes needed. Most commonly, these are a large desktop, small desktop, tablet and mobile dimensions, but more can be added and changed as the design develops. Setting this criteria up using Edge Reflow’s ‘Responsive Rulers’ allows a set of parameters that creates hidden multiple canvases. As the designer starts building the elements of the page up one-by-one, those same elements automatically resize themselves for each breakpoint defined and can be manually edited. Pushing and pulling content directly from Photoshop allows the user to design and build on-the-fly.
Connectivity and Efficiency
If Photoshop CC is installed, it is possible to connect Edge Reflow and Photoshop together allowing changes to be made to a PSD file and updates automatically applied to the corresponding content in the Reflow project. If a developer and a designer are both working together on a project, there is no need to exchange a new set of assets. Those same assets can be re-used and re-sized across the breakpoints, keeping the file size of the project to a minimum. Multiple pages and templates can link to one another. What does this mean? Rather than create 100 separate PSD files, Reflow combines elements together to create templates than can be hot spotted, essentially transforming the idea of a static design into a fully working, visual and responsive prototype.
Demonstration
Edge reflow is a great way to demonstrate to clients how a design will change across the relevant devices needed and clients can physically resize layouts, watching the web’s behaviour change their designs, providing a sense of realism to any project. Reflow has add-ons. ‘Edge Inspect’ is an app that can be downloaded to tablet and mobile devices allowing changes to be made in real-time to Edge Reflow and refreshing on the corresponding device. For a designer, this means instant feedback on the feasibility of the project's responsiveness. It changes the way we think and perceive design for web. Gone are the days of static designs.
We must be encouraged to think: what happens when this title or stand first increases in size, what happens when it spans onto two or three lines, does the words get cut off, does the content below push down below the page fold?
Edge Reflow encourages us to think two or three steps down the road, and start thinking about design with the rules and restrictions of the web in mind. The more we learn about the behaviour of the web, the more useable our designs can become.
Moving Forward
Whilst an effective tool, Edge Reflow by far, does not eliminate the need of a developer. It wasn’t designed to speed up the process and cut out important members of the process. Its code outputted certainly doesn’t have the greatest mark-up, but the snippets of code that are generated from designs are definitely a useful resource for any developer needing to know the guidelines and features of a project.
I’ll leave this article with one thought in mind. If Photoshop could be compared to print design; then continually using the programme runs a risk of muscle memory. We are at risk of falling into habitual behaviour and producing designs that aren’t best fitted for the ever changing medium of the web. Edge Reflow provides a mechanism that forces us to reconsider the way our designs morph and behave. It is crucial to good practice.
Design Thinking Process - FAQs
Empathy is at the heart of design thinking because it helps organizations understand the motivations, behaviors, pain points, and expectations of the people they serve. Rather than relying on assumptions, teams use research methods such as interviews, observations, and usability testing to gain a deeper understanding of user needs. This user-centered approach ensures that solutions address real problems rather than perceived ones. When businesses prioritize empathy, they are more likely to create experiences that resonate with customers, strengthen relationships, and deliver measurable improvements in engagement, satisfaction, and loyalty.
Design thinking encourages experimentation, creativity, and continuous learning. Instead of seeking a perfect solution immediately, teams explore multiple possibilities, test assumptions, gather feedback, and refine ideas through iteration. This process creates an environment where innovation can thrive without the fear of failure. By encouraging diverse perspectives and collaborative problem-solving, design thinking helps uncover opportunities that may not be visible through conventional approaches. Organizations that embrace this mindset are often better equipped to respond to market changes, develop innovative products, and maintain a competitive advantage.
Design thinking is particularly effective for addressing complex and ambiguous challenges where traditional solutions may not be sufficient. Examples include improving customer experiences, redesigning business processes, developing digital products, enhancing employee engagement, and creating new service offerings. Because it focuses on understanding user needs and exploring multiple solutions, design thinking helps organizations navigate uncertainty more effectively. It creates a structured framework for discovering insights, validating ideas, and delivering solutions that align with both customer expectations and business goals.
Collaboration brings together individuals with different skills, perspectives, and experiences to solve problems collectively. Designers, researchers, developers, marketers, and business stakeholders all contribute valuable insights that can improve outcomes and uncover new opportunities. Cross-functional collaboration also helps ensure that solutions are practical, scalable, and aligned with organizational objectives. By encouraging open communication and shared ownership of challenges, design thinking promotes stronger teamwork and more innovative results.
Successful adoption requires leadership support, a willingness to experiment, and a commitment to user-centered decision-making. Organizations should invest in customer research, encourage cross-functional collaboration, and create a culture that embraces learning and iteration. Rather than being applied only to design projects, design thinking should become part of everyday decision-making across the business. When embedded effectively, it can help organizations improve innovation, strengthen customer relationships, and respond more effectively to changing market conditions.