Is MVC a design pattern or an architectural pattern?

MVC which stands for Model-View-Controller describes a software pattern that you can use in interactive computer systems. To understand if it is a design pattern or an architectural pattern, let's look at what these two are:

Architectural pattern: Concerned with the subsystems of an application with their relationships and collaborations with each other.

Design pattern: Concerned with the (further small) components of a subsystem with their relationships and collaborations with each other.

MVC is a pattern that you can use in both ways (as architectural or design) and ample amounts of real world cases where the pattern is used in both these worlds can be found.

MVC as an architectural pattern

Here the core functionality and data of an application are abstracted as the model. You have one or more views and one or more controllers collectively representing the user interface. A view is responsible for displaying information to the user. A controller is responsible for accepting user inputs, interpret them to understand what should be done and act accordingly (for example update data or invoke a functionality of the model).

A real world example is the implementation of a web application that follows the MVC architectural pattern. Many such web application frameworks exists. The key is that an application is broken down into components (call them subsystems) by the MVC pattern.

MVC architecture of a web application

MVC as a design pattern

Consider the many UI widget libraries available out there where MVC is used as a design pattern to implement widgets. Take for example the JSlider class (in Java Swing library). A JSlider instance represents a slider widget where a user can move the knob of the slider to change its position. JSlider is implemented as follows:

JSlider implementation

Note that in Java Swing library the xxxUI classes capture both the view and controller aspects of a widget. It's slightly different from MVC and Swing creators call this “separable model architecture”. For the purpose of this discussion, just don't care about this difference.

Here the model (BoundedRangeModel) doesn't represent the core functionality or data of the application. It's limited to represent the data (state) of the slider widget (Models of complex widgets may implement some amount of model specific functionality.). SliderUI's view related code is responsible for painting the slider (the background, knob,...). SliderUI's controller is responsible for interpreting a mouse click-and-drag as a semantic event that represents a slider position change. Accordingly the controller related code goes about updating the model. And then the view goes about painting the knob at a different position.

The scope of the MVC pattern here is just limited to implementing a slider widget. Would you call it architectural? I would not since I cannot consider the slider a collection of subsystems of an application. With the frame or reference set to a typical application, you wouldn't even recognize it as a top level subsystem. It's more appropriate to consider it a low level subsystem or a component and hence the MVC manifests as a design pattern in this context (Read initial paragraphs - What is considered a design pattern?).

Confusion:

Why is that the Swing creators gave the name “separable model architecture” to their widget design pattern? Probably because what is considered architectural itself is a question that leads to multiple explanations.

One such explanation is that if something (a quality, design aspect,.. ) is found spread throughout a system, it's considered architectural. That's a different way to think about architecture which is not the same as what I mentioned at the beginning of this article (See the description of a architectural pattern). Probably that's one reason why Swing creators used “architecture” in their pattern since it's found throughout the Swing library.

Yet another reason that I can think of is that they just focused on the UI “system”.

Fair  enough. Let's not argue. We understand what is what. Based on the first given description, this widget design pattern cannot be considered an architectural pattern.

Conclusion:

MVC can either be used as an architectural pattern or a design pattern.